Question

我有一个wpf-mvvm应用程序。

因为我接下来......

<Combo box>
item 1
item 2
</Combo box>
<stack pnel>
 <user control 1 />
 <user control 1 />
</stack pnel>

如果用户从组合中选择“项目1”，我需要显示“用户控件1” 如果用户从组合中选择“项目2”，我需要显示“用户控件2”

在viewmodel中...我有一个这两个组合框项目的IList。

在这里隐藏/展示物品的最佳方式是什么？

Answer 1

您实际上可以完全删除StackPanel，因为您一次只会显示一个UserControl。

完成后，您可以使用technique described here将ComboBox的值绑定到UserControl的可见性。只需为未选择的UserControl将Visibility设置为Collapsed。

这使您可以在XAML中完全处理此问题。

Answer 2

总有一种方法可以做到： - ）

例如，您可以采用非常简单的方式：订阅SelectionChanged，检查哪个是当前选定的项目，并将要隐藏的项目的可见性设置为折叠。

还有更先进的方法，但我怀疑这项简单任务需要它们。但是，随着代码的开发，您可能需要重新考虑使用此方法。

Answer 3

这演示了两种简单的方法，您可以使用样式根据组合框中的选择更改元素的可见性。第一个样式检查组合框的SelectedIndex，第二个样式检查其SelectedValue。我已在此示例中使用字符串对象填充了组合框，但您可以将SelectedValue与任何类型的对象一起使用，只要您知道其ToString()方法返回的内容。

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:system="clr-namespace:System;assembly=mscorlib">
  <DockPanel>
  <ComboBox x:Name="comboBox" DockPanel.Dock="Top">  
   <system:String>Item 1</system:String>
   <system:String>Item 2</system:String>
  </ComboBox>
  <TextBlock DockPanel.Dock="Top" Text="This displays if Item 1 is selected">
   <TextBlock.Style>
    <Style TargetType="TextBlock">
      <Setter Property="Visibility" Value="Collapsed"/>
      <Style.Triggers>
       <DataTrigger Binding="{Binding ElementName=comboBox, Path=SelectedIndex}" Value="0">
        <Setter Property="Visibility" Value="Visible"/>
       </DataTrigger>
      </Style.Triggers>
    </Style>
   </TextBlock.Style>
  </TextBlock>
  <TextBlock DockPanel.Dock="Top" Text="This displays if Item 2 is selected.">
   <TextBlock.Style>
    <Style TargetType="TextBlock">
      <Setter Property="Visibility" Value="Collapsed"/>
      <Style.Triggers>
       <DataTrigger Binding="{Binding ElementName=comboBox, Path=SelectedValue}" Value="Item 2">
        <Setter Property="Visibility" Value="Visible"/>
       </DataTrigger>
      </Style.Triggers>
    </Style>
   </TextBlock.Style>
  </TextBlock>
  </DockPanel>
</Page>

如何隐藏/显示堆栈面板中的项目？

3 个答案: