在查看和编辑模式之间切换 ListDetailsView 中的 DetailsTemplate

Question

我确实有一个 ListDetailsView 显示一些数据（让我们说 Company 作为这里的一个简单示例）。通常Company 的详细信息显示为只读。但是，通过ListDetailsView.DetailsCommandBar 可以编辑Company（也可以添加新的Company）。 view 和 edit 模式之间的明确分离似乎是 UI 的一个不错的选择。我使用UserControl 来显示Company 的详细信息。

所以这是我的问题：

1. view- 和 edit- 模式之间的区别应该发生在哪里？我认为拥有CompanyDetailsControl 和CompanyDetailsEditControl 并在两者之间进行选择是个好主意（两者都使用相同的CompanyDetailsViewModel）。还有其他解决方案，例如，CompanyDetailsControl 可以在内部处理 edit- 和 view- 模式。
2. 假设在两个UserControl 之间切换是个好主意，那么ListDetailsView.DetailsTemplate 如何实现呢？我虽然在这里使用DataTemplateSelector 很容易，但这仅适用于ItemTemplate。

不确定要提供什么代码来澄清我的问题。因此，如果您需要任何代码来更好地理解我的问题，请发表评论。

Answer 1

注意：我从未使用过 UWP 应用，只应用了 WPF 中的 MVVM 模式。

---

没有画出应该发生分割的直线。这通常取决于开发者自己，使用哪个框架等等。

我个人会选择UI handles UIs' things 和ViewModel handles data only。这意味着视图负责向您显示您希望看到/控制应用程序的控件。当视图获知 property was changed 时，它应该更新它的外观。

既然我们知道应用程序将具有 edit 和 readonly 模式，我们应该准备所有必要的 UI 组件（UserControls、Pages、...）来处理这两种状态。它们将被绑定到ViewModel，其基址在BaseViewModel 中，其中已经有这个编辑变量。这样每个 UI 组件都知道它可以使用它。

基础视图模型：

abstract class BaseViewModel : INotifyPropertyChanged
{
    private string mIsInEditMode;
    public string IsInEditMode
    {
        get { return mIsInEditMode; }
        set
        {
            if(mIsInEditMode == value) return;

            mIsInEditMode = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(IsInEditMode));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

所有“正常”的 ViewModel 都继承自它：

class CompanyViewModel : BaseViewModel
{ /* props and logic of company */ }

UI 组件 (UserControl) 将具有触发器 (<Style.Triggers/>) 或将属性 Visibility 和 IsEnabled 绑定到 BaseViewModel。这些绑定将处理这种显示/隐藏逻辑，您可以控制整个布局、隐藏控件等。

<UserControl d:DataContext="{x:Bind local:CompanyViewModel}">
  <UserControl.Resources>
      <local:BoolInverterConverter x:Key="BoolInvert"/>
  </UserControl.Resources>

  <Grid>

     <Grid IsVisible="{Binding IsInEditMode}" IsEnabled="{Binding IsInEditMode}">
       <!-- Controls for edit mode -->
     </Grid>

     <Grid IsVisible="{Binding IsInEditMode, Converter={StaticResource BoolInvert}}"
           IsEnabled="{Binding IsInEditMode, Converter={StaticResource BoolInvert}}">
       <!-- Controls for readonly mode -->
     </Grid>

  </Grid>
</UserControl>

注意：我使用了属性IsVisible，您实际上将Visibility 与一些自定义转换器一起使用。