第二十四章：页面导航（八）

动态页面生成
BuildAPage程序是一个多页面应用程序，但BuildAPage项目只包含一个名为BuildAPageHomePage的页面类。 顾名思义，该程序从代码构造一个新页面，然后导航到它。
XAML文件允许您在此构造的页面上指定所需内容：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="BuildAPage.BuildAPageHomePage"
             Title="Build-a-Page"
             Padding="10, 5">
    <StackLayout>
        <Label Text="Enter page title:" />
        <Entry x:Name="titleEntry"
               Placeholder="page title" />
        <Grid VerticalOptions="FillAndExpand">
            <ContentView Grid.Row="0">
                <StackLayout>
                    <Label Text="Tap to add to generated page:" />
                    <ListView x:Name="viewList"
                              ItemSelected="OnViewListItemSelected">
                        <ListView.ItemsSource>
                            <x:Array Type="{x:Type x:String}">
                                <x:String>BoxView</x:String>
                                <x:String>Button</x:String>
                                <x:String>DatePicker</x:String>
                                <x:String>Entry</x:String>
                                <x:String>Slider</x:String>
                                <x:String>Stepper</x:String>
                                <x:String>Switch</x:String>
                                <x:String>TimePicker</x:String>
                            </x:Array>
                        </ListView.ItemsSource>
                    </ListView>
                </StackLayout>
            </ContentView>

            <ContentView Grid.Row="1">
                <StackLayout>
                    <Label Text="Tap to remove from generated page:" />
                    <ListView x:Name="pageList"
                              ItemSelected="OnPageListItemSelected" />
                </StackLayout>
            </ContentView>
        </Grid>

        <Button x:Name="generateButton"
                Text="Generate the Page!"
                IsEnabled="False"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Clicked="OnGenerateButtonClicked" />
    </StackLayout>
</ContentPage>

使用页面顶部的条目为构造的页面指定Title属性。 然后，ListView会列出您在页面上可能需要的八个常见视图。 当您选择这些视图时，它们将被传输到第二个ListView。 如果要从页面中删除其中一个，只需在第二个ListView中点击它。
以下是您为页面选择了一些元素后的样子。 请注意，您可以选择多个相同类型的元素，每个元素都有一个唯一的数字：

当你完成“设计”你的页面时，只需点击生成页面！ 底部的按钮，程序构建该页面并导航到它：

代码隐藏文件具有两个ListView元素的ItemSelected处理程序，用于添加项目和从第二个ListView中删除项目，但Button的Clicked处理程序中发生了更有趣的处理：

public partial class BuildAPageHomePage : ContentPage
{
    ObservableCollection<string> viewCollection = new ObservableCollection<string>();
    Assembly xamarinForms = typeof(Label).GetTypeInfo().Assembly;
    public BuildAPageHomePage()
    {
        InitializeComponent();
        pageList.ItemsSource = viewCollection;
    }
    void OnViewListItemSelected(object sender, SelectedItemChangedEventArgs args)
    {
        if (args.SelectedItem != null)
        {
            viewList.SelectedItem = null;
            int number = 1;
            string item = null;
            while (-1 != viewCollection.IndexOf(
            item = ((string)args.SelectedItem) + ' ' + number))
            {
                number++;
            }
            viewCollection.Add(item);
            generateButton.IsEnabled = true;
        }
    }
    void OnPageListItemSelected(object sender, SelectedItemChangedEventArgs args)
    {
        if (args.SelectedItem != null)
        {
            pageList.SelectedItem = null;
            viewCollection.Remove((string)args.SelectedItem);
            generateButton.IsEnabled = viewCollection.Count > 0;
        }
    }
    async void OnGenerateButtonClicked(object sender, EventArgs args)
    {
        ContentPage contentPage = new ContentPage
        {
            Title = titleEntry.Text,
            Padding = new Thickness(10, 0)
        };
        StackLayout stackLayout = new StackLayout();
        contentPage.Content = stackLayout;
        foreach (string item in viewCollection)
        {
            string viewString = item.Substring(0, item.IndexOf(' '));
            Type viewType = xamarinForms.GetType("Xamarin.Forms." + viewString);
            View view = (View)Activator.CreateInstance(viewType);
            view.VerticalOptions = LayoutOptions.CenterAndExpand;
            switch (viewString)
            {
                case "BoxView":
                    ((BoxView)view).Color = Color.Accent;
                    goto case "Stepper";
                case "Button":
                    ((Button)view).Text = item;
                    goto case "Stepper";
                case "Stepper":
                case "Switch":
                    view.HorizontalOptions = LayoutOptions.Center;
                    break;
            }
            stackLayout.Children.Add(view);
        }
        await Navigation.PushAsync(contentPage);
    }
}

这个Clicked处理程序创建一个ContentPage和一个StackLayout，然后简单地遍历第二个ListView中的字符串，通过使用Assembly类定义的GetType方法找到相应的Type对象。 （注意名为xamarinForms的Assembly对象被定义为一个字段。）对Activator.CreateInstance的调用会创建实际元素，然后可以针对最终布局略微定制。
在代码中创建ContentPage对象并向其添加元素并不新鲜。事实上，标准的Xamarin.Forms项目模板包含一个带有构造函数的App类，该构造函数实例化了ContentPage并为其添加了一个Label，因此您在第2章中介绍了这种技术。但是这种方法很快被放弃了，转而支持从ContentPage派生类的更灵活的技术。派生类更强大，因为派生类可以访问受保护的方法，如OnAppearing和OnDisappearing。
但是，有时候回到基础会很有帮助。