C# WPF - Comment modifier la grille affichée d'une fenêtre 'Préférences' en utilisant un ListView?

Question

Je suis en train de créer une fenêtre 'Préférences' dans mon programme C# WPF.

Le but de cette fenêtre est d'avoir un ListView sur la gauche, et une liste de contrôles modifiables sur la droite.

Chaque élément de ListView correspond directement à une grille contenant tous les contrôles sous le contenu de l'élément sélectionné.

Une fois l'élément dans ListView modifié, la visibilité de la grille actuelle doit être réduite et la grille qui correspond à la visibilité de l'élément sélectionné doit être modifiée pour être visible.

Je pensais que DataBinding pourrait fonctionner pour cela, mais je n'ai aucune idée de comment l'utiliser. Quelqu'un pourrait m'informer s'il vous plaît comment implémenter cette fonctionnalité?

Je n'ai qu'une seule grille pour le moment. La fenêtre entière ressemble à ceci:

<Window x:Class="DarkOrbit_Skill_Price_Calculator.DarkOrbit_Skill_Price_Calculator___Preferences" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:DarkOrbit_Skill_Price_Calculator" 
     mc:Ignorable="d" 
     Title="DarkOrbit Skill Price Calculator - Preferences" Height="360" Width="640" WindowStartupLocation="CenterScreen" WindowStyle="ToolWindow"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 
     <ListView Name="ListView_PreferenceOption" Width="150" Margin="5" SelectionChanged="SelectionChanged_ListView_PreferenceOption"> 
      <ListViewItem IsSelected="True"> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="Images\Installing Updates.png" Height="35"/> 
        <TextBlock Text="Update" FontSize="14" FontFamily="Segoe UI" VerticalAlignment="Center" Margin="5"/> 
       </StackPanel> 
      </ListViewItem> 
     </ListView> 
     <Grid Margin="5" Name="Grid_Update" Grid.Column="1"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="Auto"/> 
      </Grid.RowDefinitions> 
      <StackPanel Orientation="Horizontal"> 
       <Label Content="Update Version Architecture" VerticalAlignment="Center"/> 
       <ComboBox IsReadOnly="True" Width="100" Margin="5"> 
        <ComboBoxItem Content="64-Bit"/> 
        <ComboBoxItem Content="32-Bit" IsSelected="True"/> 
       </ComboBox> 
      </StackPanel> 
     </Grid> 
    </Grid> 
</Window> 

Je n'ai absolument aucune idée quant à la façon d'échanger la grille en fonction de l'indice sélectionné.

Answer 1

Vous pouvez lier la visibilité de chaque grille à l'état sélectionné de l'élément de liste correspondant en référençant l'élément ListViewItem. Quelque chose comme ceci:

<Grid> 
    <Grid.Resources> 
     <BooleanToVisibilityConverter x:Key="Converter" /> 
    </Grid.Resources> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <ListView Width="150" Margin="5"> 
     <ListViewItem IsSelected="True" x:Name="One"> 
      <TextBlock Text="Update" FontSize="14" FontFamily="Segoe UI" 
       VerticalAlignment="Center" Margin="5"/> 
     </ListViewItem> 
     <ListViewItem IsSelected="False" x:Name="Two"> 
      <TextBlock Text="Foo" FontSize="14" FontFamily="Segoe UI" 
       VerticalAlignment="Center" Margin="5"/> 
     </ListViewItem> 
    </ListView> 
    <Grid Margin="5" Grid.Column="1" 
     Visibility="{Binding IsSelected, ElementName=One, Converter={StaticResource Converter}}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="Auto"/> 
     </Grid.RowDefinitions> 
     <StackPanel Orientation="Horizontal"> 
      <Label Content="Update Version Architecture" VerticalAlignment="Center"/> 
      <ComboBox IsReadOnly="True" Width="100" Margin="5"> 
       <ComboBoxItem Content="64-Bit"/> 
       <ComboBoxItem Content="32-Bit" IsSelected="True"/> 
      </ComboBox> 
     </StackPanel> 
    </Grid> 
    <Grid Margin="5" Grid.Column="1" 
     Visibility="{Binding IsSelected, ElementName=Two, Converter={StaticResource Converter}}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="Auto"/> 
     </Grid.RowDefinitions> 
     <StackPanel Orientation="Horizontal"> 
      <Label Content="Update Something Else" VerticalAlignment="Center"/> 
      <ComboBox IsReadOnly="True" Width="100" Margin="5"> 
       <ComboBoxItem Content="64-Bit"/> 
       <ComboBoxItem Content="32-Bit" IsSelected="True"/> 
      </ComboBox> 
     </StackPanel> 
    </Grid> 
</Grid> 

Answer 2

Pour ceux qui éprouvent la même situation et que vous souhaitez utiliser le code C# pour faire ce travail, j'ai finalement pensé le code suivant:

StackPanel[] allGrids = { Grid_1, Grid_2, Grid_3, Grid_4, ... }; //Replace StackPanel with the 
//type of control you are using, e.g. Grid or WrapPanel. 

foreach (StackPanel grid in allGrids) 
{ 
    grid.Visibility = Visibility.Collapsed; //collapse all grids 
} 

allGrids[(your listview/other control).SelectedIndex].Visibility = Visibility.Visible; 
//make the grid you need visible