首页 文章

在XAML中为Xamarin.Forms中的MasterDetailPage进行数据绑定

提问于
浏览
9

到目前为止,大多数使用Xamarin.Forms的示例都使用C#来构建UI . 我更喜欢将XAML用于UI,并将其数据绑定到ViewModels .

我在将Xamarin.Forms.MasterDetailPage与XAML结合使用时遇到了麻烦,我似乎无法将C#示例移植到XAML ViewModels .

这是我到目前为止的XAML:

<?xml version="1.0" encoding="UTF-8" ?> 
<MasterDetailPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:NSContacten;assembly=NSContacten"
    x:Class="MasterDetailExample.Main"
    Title="Master Detail Example">

    <MasterDetailPage.Master BindingContext="{Binding Menu}">
        <ContentPage Padding="5, 25">               
            <StackLayout Orientation="Vertical">
                <Label Text="Master" HorizontalOptions="Center" />
                <Label Text="{Binding Subtitle}" HorizontalOptions="Center" />
            </StackLayout>    
        </ContentPage>
    </MasterDetailPage.Master>

    <MasterDetailPage.Detail BindingContext="{Binding Detailpage}">
        <ContentPage Padding="5, 25">    
            <StackLayout Orientation="Vertical">
                <Label Text="Detail" HorizontalOptions="Center" />
                <Label Text="{Binding Subtitle}" HorizontalOptions="Center" />
            </StackLayout>    
        </ContentPage>
    </MasterDetailPage.Detail>    
</MasterDetailPage>

该组件有效:我确实看到了'Master'和'Detail'标签 . 不显示绑定标签(在BindingContext对象上) .

我已经使用了大量不同的组合,但我仍然陷入困境:这是如何工作的?我的绑定是不正确的(如果它在“ContentPage”上),我不能绑定到.Master和.Detail属性等? “菜单”和“详细信息页面”绑定应该如何?

如果有人能帮助我,那将是一个巨大的帮助!下一步是在.Master中按下按钮时将更改.Detail . 提前致谢!

1 回答

  • 16

    你的Xaml几乎没问题,但是:

    • {BindingContext} 在属性上无效,应位于 ContentPage 元素上

    • MasterDetailPage.Master 要求设置 Page.Title ,否则抛出 .

    这是正确的Xaml为我工作:

    <?xml version="1.0" encoding="UTF-8" ?> 
    <MasterDetailPage
        xmlns="http://xamarin.com/schemas/2014/forms"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        xmlns:local="clr-namespace:NSContacten;assembly=NSContacten"
        x:Class="MasterDetailExample.Main"
        Title="Master Detail Example">
    
        <MasterDetailPage.Master>
          <ContentPage Padding="5, 25"  BindingContext="{Binding Menu}" Title="Master">
              <StackLayout Orientation="Vertical">
                  <Label Text="Master" HorizontalOptions="Center" />
                  <Label Text="{Binding Subtitle}" HorizontalOptions="Center" />
              </StackLayout>
            </ContentPage>
    
        </MasterDetailPage.Master>
    
        <MasterDetailPage.Detail>
            <ContentPage Padding="5, 25"  BindingContext="{Binding Detailpage}">
    
              <StackLayout Orientation="Vertical">
                  <Label Text="Detail" HorizontalOptions="Center" />
                  <Label Text="{Binding Subtitle}" HorizontalOptions="Center" />
              </StackLayout>
    
            </ContentPage>
        </MasterDetailPage.Detail>
    </MasterDetailPage>
    

    我使用匿名类型作为页面视图模型进行了测试:

    public MyMDPage ()
    {
        InitializeComponent ();
        BindingContext = new {
            Menu = new { Subtitle = "I'm Master" },
            Detailpage = new { Subtitle = "I'm Detail" }
        };
    }
    

    这很好用 . 在您的情况下,您可能希望视图模型具体类型而不是匿名类型,但您明白了 .

相关问题