核心概念

对于完全不了解 Ionic 应用程序开发的人来说，了解项目背后的核心理念、概念和工具会有所帮助。在深入复杂主题之前，我们将介绍 Ionic Framework 的基本概念及其工作原理。

UI 组件

Ionic Framework 是一个 UI 组件库，这些组件是可重复使用的元素，是应用程序构建块。Ionic 组件使用 Web 标准 使用 HTML、CSS 和 JavaScript 构建。虽然这些组件是预先构建的，但它们的设计从根本上是为了高度可定制性，以便应用程序可以使其成为自己的组件，使每个应用程序都拥有独特的外观和风格。更具体地说，Ionic 组件可以轻松地进行主题化，以便在整个应用程序中全局更改外观。有关自定义外观的更多信息，请参阅 主题。

自适应样式

自适应样式是 Ionic Framework 的内置功能，允许应用程序开发者使用相同的代码库为多个平台构建应用程序。每个 Ionic 组件都会根据应用程序运行的平台调整其外观。例如，Apple 设备（如 iPhone 和 iPad）使用 Apple 自有的 iOS 设计语言。同样，Android 设备使用 Google 的设计语言，称为 Material Design。

通过在平台之间进行细微的设计更改，为用户提供熟悉应用程序体验。从 Apple App Store 下载的 Ionic 应用程序将获得 iOS 主题，而从 Android Play 商店下载的 Ionic 应用程序将获得 Material Design 主题。对于从浏览器作为渐进式 Web 应用程序 (PWA) 查看的应用程序，Ionic 将默认使用 Material Design 主题。此外，在某些情况下选择使用哪个平台完全是可配置的。有关自适应样式的更多信息，请参阅 主题。

导航

传统的 Web 应用程序使用线性历史记录，这意味着用户向前导航到页面，然后可以点击后退按钮导航回。这方面的一个例子是在维基百科上点击，用户在浏览器的线性历史记录堆栈上向前和向后移动。

相比之下，移动应用程序通常使用并行的“非线性”导航。例如，一个带选项卡的界面可以为每个选项卡提供单独的导航堆栈，确保用户在导航和在选项卡之间切换时不会丢失他们的位置。

Ionic 应用程序采用这种移动导航方法，支持可以嵌套的并行导航历史记录，同时保持 Web 开发人员熟悉的熟悉的浏览器风格导航概念。

对于使用 Angular 和 @ionic/angular 构建的应用程序，我们建议使用 Angular Router，它在每个新的 Ionic 4 Angular 应用程序中都默认提供。

原生访问

使用 Web 技术（如 Ionic 应用程序！）构建的应用程序的一个惊人功能是它可以在几乎任何平台上运行：台式计算机、手机、平板电脑、汽车、冰箱等等！Ionic 应用程序的相同代码库可以在许多平台上运行，因为它基于 Web 标准和这些平台共有的通用 API。

Ionic 最常见的用例之一是构建一个应用程序，该应用程序可以从 App Store 和 Play Store 下载。iOS 和 Android 软件开发工具包 (SDK) 都提供 Web 视图，这些视图呈现任何 Ionic 应用程序，同时仍然允许完全访问原生 SDK。

诸如 Capacitor 和 Cordova 等项目通常用于为 Ionic 应用程序提供对原生 SDK 的访问。这意味着开发者可以使用通用的 Web 开发工具快速构建应用程序，并且仍然可以访问原生功能，例如设备的加速度计、相机、GPS 等等。

主题

Ionic Framework 的核心是使用 CSS 构建的，这使我们能够利用 CSS 属性（变量） 提供的灵活性。这使得设计外观很棒的应用程序变得非常容易，同时遵循 Web 标准。我们提供了一组颜色，以便开发者可以获得一些很棒的默认值，但我们鼓励覆盖它们以创建与品牌、公司或所需调色板相匹配的设计。从应用程序的背景颜色到文本颜色，一切都是完全可定制的。有关应用程序主题的更多信息，请参阅 主题。

事件

许多 Ionic 组件使用 CustomEvent 来通知开发者组件中的重要状态更改。例如，ion-datetime 组件将在选定的日期发生更改时发出 ionChange。

开发者可以使用标准事件，例如 click，就像他们通常一样。但是，在组件的 阴影根 内发出的许多事件将被 重新定位 到主机元素。这可能会导致多个 click 处理程序执行，即使用户只点击了一次。因此，开发者应依赖 Ionic 的事件来正确了解 Ionic 组件的状态更改。Ionic 的事件以 ion 为前缀，以避免与标准事件发生冲突。每个组件的文档页面都列出了开发者可以在应用程序中监听的可用事件。