基于MVVM的组合框选择的WPF更改窗口布局

Question

我需要根据用户在组合框中选择的内容来更改窗口的布局。 我已经尝试了一种可能的方法，但感觉它笨拙并且被黑了。 我确定他们一定是更干净的MVVM解决方案。

我的想法是在GroupBox中的多个停靠面板所在的位置，其可见性设置为崩溃。 做出选择后，适当的底座面板将设置为可见。 我试图找到一种在视图模型内执行此操作的方法，但没有成功。 我也忍不住认为自己的尝试违反了MVVM。

XAML

<GroupBox Header="Options">
    <Grid>
        <DockPanel LastChildFill="False" x:Name="syncWellHeadersDockPanel" Visibility="Collapsed">
            <Button DockPanel.Dock="Right" Content="Test"></Button>
        </DockPanel>
        <DockPanel LastChildFill="False" x:Name="SyncDirectionalSurveyDockPanel" Visibility="Collapsed">
            <Button DockPanel.Dock="Left" Content="Test02"></Button>
        </DockPanel>

    </Grid>
</GroupBox>

ViewModel-ComboBox的选定项目的属性

private StoredActionsModel _selectedStoredAction = DefaultStoredAction.ToList<StoredActionsModel>()[0];
        public StoredActionsModel SelectedStoredAction
        {
            get { return _selectedStoredAction; }
            set
            {
                if (value != _selectedStoredAction)
                {
                    //  Unset Selected on old value, if there was one
                    if (_selectedStoredAction != null)
                    {
                        _selectedStoredAction.Selected = false;
                    }
                    _selectedStoredAction = value;
                    //  Set Selected on new value, if there is one
                    if (_selectedStoredAction != null)
                    {
                        _selectedStoredAction.Selected = true;
                    }
                    OnPropertyChanged("SelectedStoredAction");

                    if (_selectedStoredAction.StoredActionID == 4)
                    {
                        //X:SyncWellHeaderDockPanel.visibility = true?????
                    }
                }
            }
        }

Answer 1

这是一种纯XAML方式，可以完全按照您的要求进行操作。 有点冗长。

注意，我们不再在DockPanel的属性中设置Visibility 。 如果我们仍然这样做，则Style触发器中设置的值将被属性覆盖。 这就是依赖属性工作的方式。

<GroupBox Header="Options">
    <Grid>
        <DockPanel LastChildFill="False" x:Name="syncWellHeadersDockPanel" >
            <Button DockPanel.Dock="Right" Content="Test"></Button>
            <DockPanel.Style>
                <Style TargetType="DockPanel" >
                    <Setter Property="Visibility" Value="Collapsed" />
                    <Style.Triggers>
                        <DataTrigger 
                            Binding="{Binding SelectedStoredAction.StoredActionID}" 
                            Value="1"
                            >
                            <Setter Property="Visibility" Value="Visible" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </DockPanel.Style>
        </DockPanel>
        <DockPanel LastChildFill="False" x:Name="SyncDirectionalSurveyDockPanel">
            <Button DockPanel.Dock="Left" Content="Test02"></Button>
            <DockPanel.Style>
                <Style TargetType="DockPanel" >
                    <Setter Property="Visibility" Value="Collapsed" />
                    <Style.Triggers>
                        <DataTrigger 
                            Binding="{Binding SelectedStoredAction.StoredActionID}" 
                            Value="2"
                            >
                            <Setter Property="Visibility" Value="Visible" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </DockPanel.Style>
        </DockPanel>
    </Grid>
</GroupBox>

做到这一点的另一种方法是将SelectedStoredAction.StoredActionID传递给DataTemplateSelector ，但这涉及编写C＃代码，该代码知道您的XAML资源键是什么，而我不是粉丝。