Ionic初始屏幕

初始屏幕类似于启动屏幕或启动屏幕。它是一个图形控制元素, 由一个包含图像, 徽标和软件当前版本的窗口组成。在加载应用程序或其他项目时显示。加载完成后, 用户通常会看到另一个功能更强的屏幕。初始屏幕只是一个显示屏幕, 允许用户在加载硬件以向用户展示软件时看东西。通常在启动游戏或程序时出现。

初始屏幕的常见元素包含公司名称和徽标, 或表明人们将使用什么的标题。启动画面最出色的示例是启动Microsoft操作系统时的Microsoft徽标。

每个移动应用程序必须包含一个图标和初始屏幕。 Ionic提供了一个简单的解决方案来添加启动屏幕, 该屏幕需要开发人员进行最少的工作。在本教程中, 我们将逐步使用Cordova初始屏幕插件来查看初始屏幕。

步骤1：创建一个新项目。你可以从此处了解如何在Ionic 4中创建项目。如果你已经有一个Ionic项目, 则可以跳过此步骤。

步骤2：接下来, 导航至项目, 并使用以下命令安装以下初始屏幕插件。该插件负责在应用程序启动期间显示和隐藏启动屏幕。

$ cd myApp
$ ionic cordova plugin add cordova-plugin-splashscreen
$ npm install @ionic-native/splash-screen

步骤3：如果你想利用Apache Cordova的启动画面插件, 请在你的项目中添加以下命令。

cordova plugin add org.apache.cordova.splashscreen

步骤4：将以下行添加到config.xml文件中。添加后, 你的应用程序构建会在应用程序启动时显示启动屏幕3000毫秒。

<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />

步骤5：现在, 你需要向项目添加图像和图标。你可以在项目的资源文件夹中找到初始屏幕图像。

步骤6：在设备中运行该应用程序时, 启动该应用程序之前, 你会看到一个初始屏幕。在这里, 你会发现默认的Ionic图标已更改。

最常见的初始屏幕尺寸如下：