在 UWP 中使用 DataTriggerBehavior 更改 ContentTemplate [英] Changing ContentTemplate using DataTriggerBehavior in UWP

问题描述

我试图将我的 View 拆分成多个 UserControl，然后根据特定值显示适当的 View.>

我在 WPF 中是这样完成的:

<DataTemplate x:Key="CardView"><views:CardView/></数据模板><DataTemplate x:Key="OtherView"><views:OtherView/></数据模板><DataTemplate x:Key="MainView"><views:MainView/></数据模板></Window.Resources>...<ContentControl Content="{Binding}"><ContentControl.Style><Style TargetType="{x:Type ContentControl}"><Setter Property="ContentTemplate" Value="{StaticResource MainView}"/><Style.Triggers><DataTrigger Binding="{Binding CurrentView}" Value="其他"><Setter Property="ContentTemplate" Value="{StaticResource OtherView}"/></数据触发器><DataTrigger Binding="{Binding CurrentView}" Value="Card"><Setter Property="ContentTemplate" Value="{StaticResource CardView}"/></数据触发器><DataTrigger Binding="{Binding CurrentView}" Value="Main"><Setter Property="ContentTemplate" Value="{StaticResource MainView}"/></数据触发器></Style.Triggers></风格></ContentControl.Style></内容控制>

这在 WPF 中效果很好，并且 CurrentView 是 ViewModel 上的 string 属性，通过 Button按/等

由于 UWP 中没有 DataTriggers，我了解到您可以使用 DataTriggerBehaviors 来完成同样的事情.所以我试过这个:

<DataTemplate x:Key="PaymentView"><local:PaymentView/></数据模板><DataTemplate x:Key="InvoiceView"><local:InvoiceView/></数据模板></Page.Resources>...<ContentControl Content="{绑定}"ContentTemplate="{StaticResource InvoiceView}"RelativePanel.AlignLeftWithPanel="True"RelativePanel.AlignRightWithPanel="True"RelativePanel.Below="PageHeader"><交互性:交互.行为><core:DataTriggerBehavior Binding="{x:Bind ViewModel.CurrentView}" Value="Invoice"><core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource InvoiceView}"/></core:DataTriggerBehavior><core:DataTriggerBehavior Binding="{x:Bind ViewModel.CurrentView}" Value="Payment"><core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource PaymentView}"/></core:DataTriggerBehavior></interactivity:Interaction.Behaviors></内容控制>

但由于某种原因，ChangePropertyAction 没有触发.我知道 CurrentView 正在改变，因为我在它上面设置了一个断点.以防万一，这里是属性:

私有字符串_currentView;公共字符串 CurrentView{得到 { 返回 _currentView;}设置 { 设置(参考 _currentView，值)；}}

我使用的是 Template10，所以我所有的 ViewModel 都通过 ViewModelBase 继承了 BindableBase，所以所有的 OnPropertyChanged> 东西也应该正常工作(所有其他属性都工作正常).

无论如何，我知道 CurrentView 正在改变，但 ChangePropertyAction 行为没有触发.有什么我遗漏的吗?

解决方案

我曾假设 ContentControl 可以使用编译的绑定 {x:Bind ViewModel.CurrentView} 工作> 因为设计者认识到与 AutoComplete 绑定.

一旦我将其更改为使用常规绑定{Binding CurrentView}，那么触发器就开始正常工作.这是工作版本:

<DataTemplate x:Key="PaymentView"><local:PaymentView/></数据模板><DataTemplate x:Key="InvoiceView"><local:InvoiceView/></数据模板></Page.Resources>...<ContentControl Content="{绑定}"ContentTemplate="{StaticResource InvoiceView}"RelativePanel.AlignLeftWithPanel="True"RelativePanel.AlignRightWithPanel="True"RelativePanel.Below="PageHeader"><交互性:交互.行为><core:DataTriggerBehavior Binding="{Binding CurrentView}" Value="Invoice"><core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource InvoiceView}"/></core:DataTriggerBehavior><core:DataTriggerBehavior Binding="{Binding CurrentView}" Value="Payment"><core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource PaymentView}"/></core:DataTriggerBehavior></interactivity:Interaction.Behaviors></内容控制>

I am trying to split out my View into multiple UserControls and then display the appropriate View depending on a certain value.

I accomplish this in WPF like this:

<Window.Resources>
    <DataTemplate x:Key="CardView">
        <views:CardView />
    </DataTemplate>
    <DataTemplate x:Key="OtherView">
        <views:OtherView />
    </DataTemplate>
    <DataTemplate x:Key="MainView">
        <views:MainView />
    </DataTemplate>
</Window.Resources>

...

<ContentControl Content="{Binding}">
    <ContentControl.Style>
        <Style TargetType="{x:Type ContentControl}">
            <Setter Property="ContentTemplate" Value="{StaticResource MainView}" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding CurrentView}" Value="Other">
                    <Setter Property="ContentTemplate" Value="{StaticResource OtherView}" />
                </DataTrigger>
                <DataTrigger Binding="{Binding CurrentView}" Value="Card">
                    <Setter Property="ContentTemplate" Value="{StaticResource CardView}" />
                </DataTrigger>
                <DataTrigger Binding="{Binding CurrentView}" Value="Main">
                    <Setter Property="ContentTemplate" Value="{StaticResource MainView}" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ContentControl.Style>
</ContentControl>

This works great in WPF, and the CurrentView is a string property on the ViewModel that is changed via Button presses/etc.

Since there are no DataTriggers in UWP, I have read that you can accomplish the same thing using DataTriggerBehaviors instead. So I have tried this:

<Page.Resources>
    <DataTemplate x:Key="PaymentView">
        <local:PaymentView />
    </DataTemplate>
    <DataTemplate x:Key="InvoiceView">
        <local:InvoiceView />
    </DataTemplate>
</Page.Resources>

...

<ContentControl Content="{Binding}"
                ContentTemplate="{StaticResource InvoiceView}"
                RelativePanel.AlignLeftWithPanel="True"
                RelativePanel.AlignRightWithPanel="True"
                RelativePanel.Below="PageHeader">
    <interactivity:Interaction.Behaviors>
        <core:DataTriggerBehavior Binding="{x:Bind ViewModel.CurrentView}" Value="Invoice">
            <core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource InvoiceView}" />
        </core:DataTriggerBehavior>
        <core:DataTriggerBehavior Binding="{x:Bind ViewModel.CurrentView}" Value="Payment">
            <core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource PaymentView}" />
        </core:DataTriggerBehavior>
    </interactivity:Interaction.Behaviors>
</ContentControl>

But for some reason, the ChangePropertyAction is not firing. I know that the CurrentView is changing, as I have set a breakpoint on it. Just in case, here is the property:

private string _currentView;
public string CurrentView
{
    get { return _currentView; }
    set { Set(ref _currentView, value); }
}

I am using Template10, so all of my ViewModels inherit BindableBase through ViewModelBase, so all the OnPropertyChanged stuff should also be working properly (all other properties are working fine).

Anyway, I know the CurrentView is changing, but the ChangePropertyAction behavior is not firing. Is there something I'm missing?

解决方案

I had assumed that the ContentControl would work using the compiled binding {x:Bind ViewModel.CurrentView} because the designer recognized that binding with AutoComplete.

Once I changed it to use regular binding {Binding CurrentView}, then the trigger started working properly. Here is the working version:

<Page.Resources>
    <DataTemplate x:Key="PaymentView">
        <local:PaymentView />
    </DataTemplate>
    <DataTemplate x:Key="InvoiceView">
        <local:InvoiceView />
    </DataTemplate>
</Page.Resources>

...

<ContentControl Content="{Binding}"
                ContentTemplate="{StaticResource InvoiceView}"
                RelativePanel.AlignLeftWithPanel="True"
                RelativePanel.AlignRightWithPanel="True"
                RelativePanel.Below="PageHeader">
    <interactivity:Interaction.Behaviors>
        <core:DataTriggerBehavior Binding="{Binding CurrentView}" Value="Invoice">
            <core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource InvoiceView}" />
        </core:DataTriggerBehavior>
        <core:DataTriggerBehavior Binding="{Binding CurrentView}" Value="Payment">
            <core:ChangePropertyAction PropertyName="ContentTemplate" Value="{StaticResource PaymentView}" />
        </core:DataTriggerBehavior>
    </interactivity:Interaction.Behaviors>
</ContentControl>

这篇关于在 UWP 中使用 DataTriggerBehavior 更改 ContentTemplate的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！