在MVVM中切换视图模式和编辑模式？

Question

我是MVVM的新手,我决定继续前进并开始在我即将开展的项目中采用它.

我已经阅读了这个相关的问题和答案,但我不知道如何使用MVVM实现这一点.

我希望我的项目中的所有视图都有2种模式,编辑模式和视图模式.
我不希望用户默认情况下看到所有字段的TextBoxes,我宁愿让他们看到TextBlocks(或将所有TextBoxes' 设置IsReadOnly为true属性(通过样式等你告诉我..).

当用户打开实体时,它通常应该是TextBlocks,Labels(或只读文本框)等,如果他点击"编辑"(如果他有权限),它应该进入编辑模式,所有字段的标签应该被反转为TextBoxes(RichTextBoxes等,ComboBoxes或任何其他不仅仅是标签的可编辑字段).

我很确定我不是唯一有这个问题的人,我想听听专家们在纯MVVM中切换这些模式的最有效方法是什么,以及为它声明两个单独的视图是否常见.

请介绍一篇很好的文章,解释如何做到这一点(也许是由Visual State ?? IDK完成的).

更新
我想知道什么而不是如何,我的问题是关于模式,我应该在V或VM中将编辑模式与视图模式分开吗？ 所以请在答案中强调这个细节.

提前致谢.

Answer 1

将该IsReadOnly属性用于文本框并将其绑定到"编辑模式"属性:

<TextBox .... IsReadOnly={Binding IsViewMode} ... />

然后在您的视图模型中:

public bool IsViewMode
{
    get { return _IsViewMode; }
    set
    {
        _IsViewMode= value;
        // Call NotifyPropertyChanged when the source property is updated.
        NotifyPropertyChanged("IsViewMode");
    }
}

IsViewMode默认为,true并false在用户单击"编辑"时切换到.绑定将立即使所有文本框都可编辑.

您可以对其他控件执行相同的操作 - 尽管IsEnabled在这些情况下它将是您需要绑定的属性 - 尽管您有灰色控件.

要交换文本块和控件,您需要让两个控件共享网格中的相同位置,并IsViewMode通过一对转换器控制它们的可见性:

<TextBlock Grid.Row="1" Grid.Column="2" ...
           Visiblity={Binding IsViewMode, Converter=DirectConverter} ... />
<ComboBox Grid.Row="1" Grid.Column="2" ...
          Visiblity={Binding IsViewMode, Converter=InvertedConverter} ... />

直接转换器是:

return IsViewMode ? Visibility.Visible : Visibility.Collapsed;

倒置转换器是:

return IsViewMode ? Visibility.Collapsed : Visibility.Visible;