c# - Xamarin 使用 xaml 创建具有多个详细 View 的 masterdetailpage

Question

我是 Xamarin 框架的新手，正在为 iOS 和 Droid 共享应用程序开发应用程序。我只是想使用带有 XAML 的 Masterdetailpage 布局制作一个像 facebook 应用程序一样的左 slider 菜单。我找不到合适的示例或 stub 来开发结构化编程。如果有人可以向我建议链接或示例代码以从现在开始我当前项目的旅程，那将是很大的帮助？提前致谢。

Answer 1

MasterDetailPageDemoPage是来自 GitHub Xamarin-forms-samples 的主详细信息页面示例的链接.我也会发布此链接中的代码，以防将来链接断开

using System;
using Xamarin.Forms;

namespace FormsGallery
{
    class MasterDetailPageDemoPage :  MasterDetailPage
    {
        public MasterDetailPageDemoPage()
        {
            Label header = new Label
            {
                Text = "MasterDetailPage",
                Font = Font.SystemFontOfSize(30, FontAttributes.Bold),
                HorizontalOptions = LayoutOptions.Center
            };

            // Assemble an array of NamedColor objects.
            NamedColor[] namedColors = 
                {
                    new NamedColor("Aqua", Color.Aqua),
                    new NamedColor("Black", Color.Black),
                    new NamedColor("Blue", Color.Blue),
                    new NamedColor("Fuschia", Color.Fuschia),
                    new NamedColor("Gray", Color.Gray),
                    new NamedColor("Green", Color.Green),
                    new NamedColor("Lime", Color.Lime),
                    new NamedColor("Maroon", Color.Maroon),
                    new NamedColor("Navy", Color.Navy),
                    new NamedColor("Olive", Color.Olive),
                    new NamedColor("Purple", Color.Purple),
                    new NamedColor("Red", Color.Red),
                    new NamedColor("Silver", Color.Silver),
                    new NamedColor("Teal", Color.Teal),
                    new NamedColor("White", Color.White),
                    new NamedColor("Yellow", Color.Yellow)
                };

            // Create ListView for the master page.
            ListView listView = new ListView
            {
                ItemsSource = namedColors
            };

            // Create the master page with the ListView.
            this.Master = new ContentPage
            {
                Title = "Color List",       // Title required!
                Content = new StackLayout
                {
                    Children = 
                    {
                        header, 
                        listView
                    }
                }
            };

            // Create the detail page using NamedColorPage
            NamedColorPage detailPage = new NamedColorPage(true);
            this.Detail = detailPage;

            // For Android & Windows Phone, provide a way to get back to the master page.
            if (Device.OS != TargetPlatform.iOS)
            {
                TapGestureRecognizer tap = new TapGestureRecognizer();
                tap.Tapped += (sender, args) =>
                    {
                        this.IsPresented = true;
                    };

                detailPage.Content.BackgroundColor = Color.Transparent;
                detailPage.Content.GestureRecognizers.Add(tap);
            }

            // Define a selected handler for the ListView.
            listView.ItemSelected += (sender, args) =>
                {
                    // Set the BindingContext of the detail page.
                    this.Detail.BindingContext = args.SelectedItem;

                    // Show the detail page.
                    this.IsPresented = false;
                };

            // Initialize the ListView selection.
            listView.SelectedItem = namedColors[0];
        }
    }
}

如果您想在 Xaml 中执行此操作，请参阅下面的示例:

根页面

<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"       
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    xmlns:view="clr-namespace:MyApp.Views;assembly=MyApp"
    x:Class="MyApp.Views.RootPage">
    <MasterDetailPage.Master>
        <view:MainMenu />
    </MasterDetailPage.Master>
    <MasterDetailPage.Detail>
        <view:HomePage />
    </MasterDetailPage.Detail>
</MasterDetailPage>

主菜单

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                       x:Class="MyApp.Views.MainMenu">
    <Label Text="I should actually be a list or something" VerticalOptions="Center" HorizontalOptions="Center" />
</ContentPage>

首页

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                       x:Class="MyApp.Views.HomePage">
    <Label Text="Hello World" VerticalOptions="Center" HorizontalOptions="Center" />
</ContentPage>