将 VisualStateManager VisualState 绑定到视图模型

本文关键字：视图 模型 绑定 VisualStateManager VisualState | 更新日期: 2023-09-27 18:32:01

我有三种不同VisualState的网格。如何将此信息绑定到我的视图模型，因为我需要根据视图状态以不同的方式执行操作。

现在我使用的是 CurrentStateChanged 事件（这不是很 mvvm 的方式），但主要问题是打开应用程序时不会触发该事件，所以我不知道初始视觉状态。

我目前的观点：

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="AdaptiveVisualStateGroup" CurrentStateChanged="{x:Bind ViewModel.ViewStateChanged, Mode=OneWay}">
        <VisualState x:Name="VisualStateNarrow">
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="0" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
            ...
            </VisualState.Setters>
        </VisualState>
        <VisualState x:Name="VisualStateNormal">
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="720" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
            ...
            </VisualState.Setters>
        </VisualState>
        <VisualState x:Name="VisualStateWide">
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="1000" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
            ...
            </VisualState.Setters>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

查看型号：

public void ViewStateChanged(object sender, VisualStateChangedEventArgs args)
{
    if(args.NewState.Name == "VisualStateNarrow")
    {
        isNarrowState = true;
    }
    ...
}

将 VisualStateManager VisualState 绑定到视图模型

我找到如何做到这一点的唯一方法是使用代码隐藏。换句话说，也没有找到真正的MVVM方式。但是由于我使用的是 x：Bind，我已经在代码后面的视图中也有一个视图模型的属性......所以使用它很容易。

要使其正常工作，您需要使用以下代码，请注意，我也在代码隐藏中将 VisualStateManager 的 CurrentStateChanged 链接到 OnCurrentStateChanged 方法。

public sealed partial class MainPage : Page
{
    private IViewModel ViewModel => DataContext as IViewModel;
    public MainPage()
    {
        this.InitializeComponent();
    }
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
        UpdateVisualState(VisualStateGroup.CurrentState);
    }
    private void UpdateVisualState(VisualState currentState)
    {
        ViewModel.CurrentState = currentState;
    }
    private void OnCurrentStateChanged(object sender, VisualStateChangedEventArgs e)
    {
        UpdateVisualState(e.NewState);
    }
}
相关文章：