UWP

Question

我开发了一个应用程序，用户可以在其中编辑 "big" 表单：

表单包含很多字段：它显示在一个 Pivot 中，其中每个 PivotItem 代表表单的一个类别。
一些类别包含一个或多个子项目：它们通过 Master-Detail 展示显示。

为了显示详细信息部分的项目，我使用直接绑定到模型的 ContentPresenter：

<ContentPresenter
    x:Name="DetailContentPresenter"
    Grid.Column="1"
    Grid.RowSpan="2"
    BorderThickness="1,0,0,0"
    Padding="24,0"
    BorderBrush="{ThemeResource SystemControlForegroundBaseLowBrush}"
    Content="{x:Bind MasterListView.SelectedItem, Mode=OneWay}">

    <ContentPresenter.ContentTemplate>
        <DataTemplate x:DataType="models:Form_Parts">
            <...>
        </DataTemplate>
    </ContentPresenter.ContentTemplate>
</ContentPresenter>

这很好用，但主窗体中有一个 "third" 级别：照片列表，我通过 GridView 在 ContentPresenter 中显示。这也很好用，但我想使用 "Add" 按钮或 "ItemClick" 事件与照片进行交互：我不知道如何在主 ViewModel 中绑定命令，而不是ContentPresenter 的 DataContext。此表单的其他字段在此 ViewModel 上绑定良好。

我做了一些测试但没有任何结果：

<StackPanel Orientation="Horizontal" Grid.Row="1">
    <GridView ItemsSource="{Binding images}"
              ItemClick="{Binding PhotoClickCommand}">
        <GridView.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="Gray" BorderThickness="1" 
                        Padding="10"
                        Height="150" Width="190">
                    <Image Stretch="UniformToFill"
                           Source="{Binding bitmap_image}" />
                </Border>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
    <Border BorderBrush="Gray" BorderThickness="1" 
            Padding="10"
            Height="150" Width="190">
        <Button Command="{Binding Path=DataContext.AddPhotoCommand, ElementName=DetailsPage}" 
                Height="100" Width="100">
            <Viewbox>
                <SymbolIcon Symbol="Add"/>
            </Viewbox>
        </Button>
    </Border>
</StackPanel>

=> 有办法吗？

编辑： 我解决了 "Add" 按钮的问题，感谢 Alteik：

<Button Command="{Binding ElementName=Root, Path=DataContext.AddPhotoCommand}" Height="100" Width="100">

但我总是遇到 GridView 的 ItemClick 问题。我试过这个：

<GridView ItemsSource="{Binding images}"
          IsItemClickEnabled="True"
          SelectionMode="None">
    <i:Interaction.Behaviors>
        <core:EventTriggerBehavior EventName="Tapped">
            <core:InvokeCommandAction Command="{Binding ElementName=Root, Path=DataContext.EditPhotoCommand}" 
                                      CommandParameter="{Binding Mode=OneWay}"/>
        </core:EventTriggerBehavior>
    </i:Interaction.Behaviors>
    <...>
</GridView>

但是我在 ViewModel 中没有得到预期的参数：

private void EditPhoto(object sender)
{
    Images sImage = (Images)sender;
    if (sImage != null)
    {
        NavigationService.NavigateTo<CommentImageViewModel>(this, new Object[] { sImage }, true);
    }
}

发件人是当前的 Form_Parts（ContentPresenter 的 DataTemplate），而我会得到我的图像集合中的选定项目，它绑定到网格视图...

=> 我该怎么做才能解决这个问题？

Answer 1

您应该能够更改子元素中的 DataContext，执行此操作：

Command"{Binding ElementName=Root, Path=DataContext.TheCommandFromRoot}"

显然您需要将父元素的名称设置为 "Root"

UWP - 如何将 ContentPresenter 的元素绑定到主 ViewModel？

UWP - How to bind a ContentPresenter's element to the main ViewModel?

xaml

binding

mvvm

viewmodel