Загрузка различных пользовательских настроек при выборе флажка в шаблоне mvvm

Question

Я работаю над шаблоном wpf mvvm. Я разработал несколько UserControls для разных флажков. При выборе флажка соответствующий UserControl должен быть загружен с правой стороны.

Для одного флажка, я добавил UserControl в MainView.xaml, как это:

<StackPanel> 
    <UserControl Name="CCS01" ScrollViewer.CanContentScroll="True" Margin="5" > 
     <local:CCS01 HorizontalAlignment="Left"></local:CCS01> 
    </UserControl> 
</StackPanel> 

Я хранится список флажков в DataGrid в другой UserControl, как этот

класс

<DataGrid Width="150" Grid.Row="0" Background="LightGray" CanUserAddRows="False" AutoGenerateColumns="False" HorizontalAlignment="Left" Name="dataGridCustomers" ItemsSource="{Binding Path=UsecaseListItems}" CanUserResizeColumns="False" CanUserResizeRows="False"> 
    <DataGrid.Columns> 
     <DataGridCheckBoxColumn Width="40" Header="Select" Binding="{Binding Path=IsSelected, UpdateSourceTrigger=PropertyChanged}">      
     </DataGridCheckBoxColumn> 
     <DataGridTextColumn Width="85" Binding="{Binding Path=UsecaseName}" Header="UsecaseName" IsReadOnly="True" > 
      <DataGridColumn.HeaderStyle> 
       <Style TargetType="DataGridColumnHeader"> 
        <Setter Property="FontWeight" Value="Bold"/> 
        <Setter Property="Foreground" Value="Black"></Setter> 
       </Style> 
      </DataGridColumn.HeaderStyle> 
     </DataGridTextColumn>  
    </DataGrid.Columns> 
</DataGrid> 

модели представления, как это:

[![private string _usecaseName; 
     public string UsecaseName 
     { 
      get { return _usecaseName; } 
      set 
      { 
       _usecaseName = value != null ? value.Trim() : null; 
       OnPropertyChanged("UsecaseName"); 
      } 
     } 

     private string _description; 
     public string Description 
     { 
      get { return _description; } 
      set 
      { 
       _description = value != null ? value.Trim() : null; 
       OnPropertyChanged("Description"); 
      } 
     } 
     private bool _IsSelected; 
     public bool IsSelected 
     { 
      get { return _IsSelected; } 
      set 
      { 
       _IsSelected = value; 
       OnPropertyChanged("IsSelected"); 
      } 
     } 

     private bool _AllSelected; 
     public bool AllSelected 
     { 
      get { return _AllSelected; } 
      set 
      { 
       _AllSelected = value; 
       foreach (var reportListItemModel in UsecaseListItems) 
       { 
        reportListItemModel.IsSelected = this._AllSelected; 

       } 

       OnPropertyChanged("AllSelected"); 

      } 
     } 


     private ObservableCollection<UseCase> _usecaseListItems = new ObservableCollection<UseCase>(); 
     public ObservableCollection<UseCase> UsecaseListItems 
     { 
      get { return _usecaseListItems; } 
      set { 
       _usecaseListItems = value; 
       OnPropertyChanged("UsecaseListItems"); 
      } 
     }][1]][1] 

Короче говоря, я хочу разделить страницу на два столбца, слева у меня есть список UserControls и справа. Я хочу просмотреть выбранный UserControl (можно выбрать только один) и связать выбранный флажок с соответствующий UserControl в классе ViewModel.

Для справки, я добавляю изображение UI здесь:

Answer 1

Вы пытаетесь что-то вроде этого:

* .xaml

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="auto"/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <DataGrid Grid.Column="0" Background="LightGray" CanUserAddRows="False" AutoGenerateColumns="False" HorizontalAlignment="Left" ItemsSource="{Binding Path=UsecaseListItems}" 
       Name="dataGridCustomers" CanUserResizeColumns="False" CanUserResizeRows="False" 
       SelectionChanged="dataGridCustomers_SelectionChanged"> 
     <DataGrid.Columns> 
      <DataGridCheckBoxColumn Width="auto" Header="Select" Binding="{Binding Path=IsSelected, UpdateSourceTrigger=PropertyChanged}"> 
      </DataGridCheckBoxColumn> 
      <DataGridTextColumn Width="auto" Binding="{Binding UsecaseName}" Header="UsecaseName" IsReadOnly="True" > 
       <DataGridColumn.HeaderStyle> 
        <Style TargetType="DataGridColumnHeader"> 
         <Setter Property="FontWeight" Value="Bold"/> 
         <Setter Property="Foreground" Value="Black"></Setter> 
        </Style> 
       </DataGridColumn.HeaderStyle> 
      </DataGridTextColumn> 
     </DataGrid.Columns> 
    </DataGrid> 
    <Border Grid.Column="1" BorderThickness="1" BorderBrush="Gray"> 
     <Grid Grid.Column="1" x:Name="HostGrid" Margin="5"> 

     </Grid> 
    </Border> 
</Grid> 

* .cs (код позади)

private void dataGridCustomers_SelectionChanged(object sender, SelectionChangedEventArgs e) 
{ 
    var SelectedItem = dataGridCustomers.SelectedItem; 
    string UserControlName = ((UseCase)SelectedItem).UsecaseName; 
    Assembly ass = Assembly.GetExecutingAssembly(); 
    foreach (var item in ass.GetTypes()) 
    { 
     if (item.Name == UserControlName) 
     { 
      UserControl uc = (UserControl)Activator.CreateInstance(item,null); 
      HostGrid.Children.Add(uc); 
     } 
    } 
} 

Если вы можете удалить этот флажок, было бы лучше. Поскольку CheckBox позволяет множественный выбор

Answer 2

1. Создать класс MyControl с 2-мя свойствами string Name (будет переплетены к вашему DataGrid) и UserControl Control это будет ваш контроль.
2. Создайте список своих элементов управления.
3. В вашей ViewModel создать MyControl SelectedControl свойство, это скажет вам, что выбранные элементы управления, и привязать его к сетке
4. На ваш взгляд добавить ContentControl и привязать его к: SelectedControl.Control