WPF:如何使用selecteditem信息绑定ListBox ItemsControl中Button的可见性?

时间:2015-06-16 19:57:35

标签: c# wpf listbox itemscontrol selecteditem

我有一个列表框绑定到ObservableCollection of Items。每个listboxItem包含一些文本块和几个按钮。我想仅在选择列表框项目或hightlight时显示listboxItem内的按钮。如果列表框项未突出显示,则应隐藏该按钮。我试图使用datatrigger绑定到IsSelected属性。但它不起作用。请指教。感谢

        <ListBox Name="LayoutListBox" SelectedItem="{Binding Path=SelectedLayout, Mode=TwoWay}" ItemsSource="{Binding Layouts}" SelectionMode="Single" HorizontalContentAlignment="Stretch">
      <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
          <Style.Resources>
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Gray"/>
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Gray"/>
          </Style.Resources>
        </Style>
      </ListBox.ItemContainerStyle>
      <ListBox.ItemTemplate>
        <DataTemplate>
          <Grid>
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Border HorizontalAlignment="Stretch" Margin="2" CornerRadius="2" BorderBrush="#80808080" BorderThickness="1" Background="GhostWhite">
                    <Grid>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height ="*"/>
                                    <RowDefinition Height ="*"/>
                                </Grid.RowDefinitions>
                                <DockPanel Grid.Row="1" Grid.Column="3" DockPanel.Dock="Right">
                                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Visibility="{Binding Path=ViewName, Converter={StaticResource Converter}, ConverterParameter=false}">
                                        <Button ToolTip="Save">
                                            <Image Source="/Common.View;component/LayoutManager/View/Images/PushPin.png" />
                                        </Button>
                                        <Button Click="EditButtonClick" ToolTip="Edit">
                                            <Image Source="/Common.View;component/LayoutManager/View/Images/pencil.png" />
                                        </Button>
                                        <Button Click="DeleteButtonClick" ToolTip="Delete">
                                            <Image Source="/Common.View;component/LayoutManager/View/Images/cross.png" />
                                        </Button>
                                    </StackPanel>
                                </DockPanel>
                            </Grid>
                        </DockPanel>
                    </Grid>
                  </Border>
          </Grid>
        </DataTemplate>
      </ListBox.ItemTemplate>
    </ListBox>

2 个答案:

答案 0 :(得分:3)

我选择了一个简单的示例来显示列表框项目中的按钮。它必须绑定为RelativeSource并且必须使用Converter

示例:

<Window.Resources>
        <BooleanToVisibilityConverter x:Key="booleanVisibleConverter" />
    </Window.Resources>
    <Grid>
        <ListBox ItemsSource="{Binding ObservableCollection}" Grid.Row="0" SelectedItem="{Binding Path=Item}" 
                 SelectionMode="Single" IsSynchronizedWithCurrentItem="True" Margin="1" ScrollViewer.HorizontalScrollBarVisibility="Disabled" SelectedIndex="0">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Label Content="{Binding}" />
                        <Button Content=" X " Visibility="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}}, Path=IsSelected, Converter={StaticResource booleanVisibleConverter}}" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

答案 1 :(得分:1)

您可以创建与每个按钮关联的样式,如下所示:

<Style TargetType="{x:Type Button}">
  <Setter Property="Visibility" Value="Collapsed"/>
    <Style.Triggers>
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource 
                            Mode=FindAncestor, AncestorType={x:Type ListBoxItem}},
                            Path=IsSelected}" Value="True">
           <Setter Property="Visibility" Value="Visible"/>
     </DataTrigger>
  </Style.Triggers>
</Style>