PLC-IoT 网关开发札记（3）：Xamarin Forms 首页跳转的正确姿势

1. 需求

使用 Xamarin.Forms 默认的模板生成卡片式 App 项目后，App 打开的是第一个卡片页。实用中，往往需要 App 启动后呈现一个 Splash，在 Splash 页面的后台完成系统初始化的一些任务，然后自动跳转或者等待用户点击 “立即体验”/“开始使用” 等按钮，App 再呈现具体的内容。

那么如何正确，安全地实现页面跳转呢？

2. 实现

2.1 App.xaml

<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="I2oT.App">

    <!-- Resources used by multiple pages in the application -->
    <Application.Resources>

        <Thickness x:Key="PageMargin">8</Thickness>

        <!-- Colors -->
        <Color x:Key="PrimaryColor">White</Color>
        <Color x:Key="SecondaryColor">White</Color>
        <Color x:Key="TertiaryColor">Silver</Color>
        <Color x:Key="EditableColor">DarkBlue</Color>
        <Color x:Key="DescriptiveTextColor">#505060</Color>

        <Color x:Key="AppPageBackgroundColor">White</Color>
        <Color x:Key="AppPageColor">#1976D2</Color>
        <Color x:Key="AppForegroundColor">White</Color>
        <Color x:Key="AppBackgroundColor">#1976D2</Color>
        <Color x:Key="AppFillBackgroundColor">White</Color>
        <Color x:Key="AppTextCommonColor">#1976D2</Color>
        <Color x:Key="AppTabBarUnselectedColor">#A3FFFFFF</Color>
        <Color x:Key="AppItemSelectedColor">#F0F0F0</Color>
        <Color x:Key="AppItemUnSelectedColor">#3060C0</Color>
        <Color x:Key="AppTipIconColor">Red</Color>
        <Color x:Key="AppPlaceholderColor">Silver</Color>

        <Style x:Key="PropertyCaptionStyle" TargetType="Label">
            <Setter Property="TextColor" Value="{StaticResource AppTextCommonColor}"/>
            <Setter Property="FontSize" Value="Small"/>
            <Setter Property="VerticalOptions" Value="Center"/>
            <Setter Property="WidthRequest" Value="88"/>
        </Style>

        <Style x:Key="PropertyCommentStyle" TargetType="Label">
            <Setter Property="TextColor" Value="{StaticResource AppTextCommonColor}"/>
            <Setter Property="FontSize" Value="Caption"/>
            <Setter Property="VerticalOptions" Value="Center"/>
            <Setter Property="HorizontalOptions" Value="End"/>
            <Setter Property="HorizontalTextAlignment" Value="End"/>
            <Setter Property="WidthRequest" Value="32"/>
        </Style>

        <Style x:Key="PropertyIntegerStyle" TargetType="Slider">
            <Setter Property="BackgroundColor" Value="Transparent"/>
            <Setter Property="ThumbColor" Value="DarkGreen"/>
            <Setter Property="HorizontalOptions" Value="FillAndExpand"/>
            <Setter Property="MinimumTrackColor" Value="DarkGray"/>
            <Setter Property="MaximumTrackColor" Value="DarkRed"/>
            <Setter Property="HeightRequest" Value="32"/>
        </Style>
    </Application.Resources>
</Application>

App.xaml 中没有什么功能性的内容，它只是一个启动器，在 App.xaml 中定义了一堆颜色和样式。当然还可以在这里定义更多的资源，以<Application.Resources>...</Application.Resources>封装起来，作为 Application 全局的资源。

2.2 App.xaml.cs

using System;
using System.IO;
using System.Net.Http;
using I2oT.Data;
using I2oT.Models;
using I2oT.Views;
using Xamarin.Forms;

namespace I2oT
{
    public partial class App : Application
    {
        static I2oTDatabase database;
        static RemoteGateway gateway;

        // Create the database connection as a singleton.
        public static I2oTDatabase Database
        {
            get
            {
                if (database == null)
                {
                    database = new I2oTDatabase(Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "I2oT.db"));
                }
                return database;
            }
        }

        public static RemoteGateway Gateway
        {
            get
            {
                if(gateway == null)
                {
                    gateway = new RemoteGateway();
                }
                return gateway;
            }
        }

        public App()
        {
            InitializeComponent();

            MainPage = new SplashPage();
        }

        protected override void OnStart()
        {
        }

        protected override void OnSleep()
        {
        }

        protected override void OnResume()
        {
        }
    }
}

App.xaml.cs 是功能性代码。我的这个例子中，定义了两个静态对象，分别是

1. 本地数据库 I2oTDatabase，
2. 物联网网关 RemoteGateway。这两个对象的使用在后续的开发中会陆续提到，这里先不管它。
3. 在 App 的构造函数中，多了一句话

MainPage = new SplashPage();

就是它！

MainPage 是 Application 的一个属性，指定 MainPage 相当于把 Application 的当前控制权交给新的对象。在这里，SplashPage 是已经定义好的引导页。