更新列表框不同的内容在WPF按钮点击

Question

所以我有一个列表框和一个工具栏在我的WPF应用程序。工具栏只具有常规控件，而列表框具有垂直扩展器。

我需要列表框有一个不同的扩展器集，具体取决于单击哪个按钮。现在它看起来像这样：

<ListBox> 
    <local:Select_Analysis_Panel/> 
</ListBox> 

哪里local:Select_Analysis_Panel是包含扩展独立用户控件文件。单击按钮时动态更新ListBox控件内容的最佳方法是什么？

在过去的几个小时里，我一直在尝试为每个扩展器集合使用set DataTemplates，并用下面的代码很少用到绑定到items控件属性。我只是试图在设置MVVM接口之前设计基本框架。后来我打算用你知道ItemsSource="{Binding WhatExpanderViewModelProperty}"或者类似的东西来代替ItemsSource="Network_anal"。

<ListBox Width="250" Margin="5,0,0,0"> 
      <ListBox.Resources> 

       <DataTemplate DataType="Select_Analysis_Panel"> 
        <local:Select_Analysis_Panel/> 
       </DataTemplate> 

       <DataTemplate x:Key="Network_anal" DataType="NetworkAnalysis"> 
        <local:NetworkAnalysis/> 
       </DataTemplate>.Resources> 

      <ListBox.Template>      
       <ControlTemplate> 
        <Border Background="Red"/> 
       </ControlTemplate>      
      </ListBox.Template> 

      <ItemsControl ItemsSource="Network_anal"/> 
</ListBox> 

我对此采取正确的方法吗？

这是我正在尝试做的。点击“文件”按钮时，下方的侧栏显示这两个扩展：

而当“网络设计”按钮，这些扩展器dipslayed：

Answer 1

选项1：

子类的部分：

每一部分

可以从基座部分类作为子类，和特定DataTemplate可用于每个：

<Window x:Class="MiscSamples.MultiToolbar" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:MiscSamples" 
     Title="MultiToolbar" Height="300" Width="300"> 
    <Window.Resources> 
     <BooleanToVisibilityConverter x:Key="BoolToVisibilityConverter"/> 
    </Window.Resources> 
    <DockPanel> 
     <ListBox ItemsSource="{Binding Sections}" 
       SelectedItem="{Binding SelectedSection}" 
       DisplayMemberPath="Name" 
       DockPanel.Dock="Top"> 
      <ListBox.ItemContainerStyle> 
       <Style TargetType="ListBoxItem"> 
        <Setter Property="IsEnabled" Value="{Binding IsEnabled}"/> 
        <Setter Property="Visibility" Value="{Binding IsVisible, Converter={StaticResource BoolToVisibilityConverter}}"/> 
        <Setter Property="MinWidth" Value="80"/> 
        <Setter Property="MinHeight" Value="40"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="ListBoxItem"> 
           <Border BorderBrush="Black" BorderThickness="1"> 
            <ToggleButton IsChecked="{Binding IsSelected, Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"> 
             <ContentPresenter ContentSource="Content"/> 
            </ToggleButton> 
           </Border> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </ListBox.ItemContainerStyle> 
      <ListBox.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal"/> 
       </ItemsPanelTemplate> 
      </ListBox.ItemsPanel> 
     </ListBox> 

     <ScrollViewer Width="300" DockPanel.Dock="Left"> 
      <ContentPresenter Content="{Binding SelectedSection}"> 
       <ContentPresenter.Resources> 
        <DataTemplate DataType="{x:Type local:FileSection}"> 
         <TextBlock Text="User Control For File Section"/> 
        </DataTemplate> 
        <DataTemplate DataType="{x:Type local:NetworkDesignSection}"> 
         <TextBlock Text="User Control For Network Design"/> 
        </DataTemplate> 
        <DataTemplate DataType="{x:Type local:SelectAnalysisSection}"> 
         <TextBlock Text="User Control For Select Analysis"/> 
        </DataTemplate> 
       </ContentPresenter.Resources> 
      </ContentPresenter> 
     </ScrollViewer> 

     <Grid Background="Gray"> 
      <TextBlock Text="Design Surface" TextAlignment="Center" VerticalAlignment="Center" FontWeight="Bold"/> 
     </Grid> 
    </DockPanel> 
</Window> 

代码背后：

public partial class MultiToolbar : Window 
    { 
     public MultiToolbar() 
     { 
      InitializeComponent(); 

      var vm = new MainViewModel(); 
      vm.Sections.Add(new FileSection() {Name = "File"}); 
      vm.Sections.Add(new NetworkDesignSection() { Name = "Network Design" }); 
      vm.Sections.Add(new SelectAnalysisSection() { Name = "Select Analysis" }); 

      DataContext = vm; 
     } 
    } 

主要视图模型：

public class MainViewModel: PropertyChangedBase 
    { 
     private ObservableCollection<Section> _sections; 
     public ObservableCollection<Section> Sections 
     { 
      get { return _sections ?? (_sections = new ObservableCollection<Section>()); } 
     } 

     private Section _selectedSection; 
     public Section SelectedSection 
     { 
      get { return _selectedSection; } 
      set 
      { 
       _selectedSection = value; 
       OnPropertyChanged("SelectedSection"); 
      } 
     } 
    } 

节：

public abstract class Section:PropertyChangedBase 
    { 
     public string Name { get; set; } 

     private bool _isEnabled = true; 
     public bool IsEnabled 
     { 
      get { return _isEnabled; } 
      set 
      { 
       _isEnabled = value; 
       OnPropertyChanged("IsEnabled"); 
      } 
     } 

     private bool _isVisible = true; 
     public bool IsVisible 
     { 
      get { return _isVisible; } 
      set 
      { 
       _isVisible = value; 
       OnPropertyChanged("IsVisible"); 
      } 
     } 

     //Optionally 
     //public string ImageSource {get;set;} 
     //ImageSource = "/Resources/MySection.png"; 
    } 

    public class FileSection: Section 
    { 
     ///... Custom logic specific to this Section 
    } 

    public class NetworkDesignSection:Section 
    { 
     ///... Custom logic specific to this Section 
    } 

    public class SelectAnalysisSection: Section 
    { 
     ///... Custom logic specific to File Section 
    } 

    //...etc etc etc 

结果：

请注意，我用ToggleButton少不了的ListBoxItem.IsSelected财产模拟TabControl - 喜欢行为。

Answer 2

您可以设置的DataContext整个表格并将listbox的ItemsSource或将listbox的ItemsSource直接绑定到某个集合。