【发布时间】:2022-01-15 15:22:12
【问题描述】:
我正在尝试为 ListBox 中的每个项目添加一个按钮。 它是这样的:
添加按钮前的样式模板:
<Style TargetType="ListBox" x:Key="ListBoxStyle">
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<ItemsPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled"/>
</Style>
<Style TargetType="ListBoxItem" x:Key="ListBoxItemStyle">
<Setter Property="Canvas.Left" Value="{Binding Rectangle.X}"/>
<Setter Property="Canvas.Top" Value="{Binding Rectangle.Y}"/>
<Setter Property="Width" Value="{Binding Rectangle.Width}"/>
<Setter Property="Height" Value="{Binding Rectangle.Height}"/>
<Setter Property="BorderBrush" Value="{Binding Hexadecimal}"/>
<Setter Property="BorderThickness" Value="2"/>
<Setter Property="Content" Value=""/>
</Style>
这是我使用样式的方式:
<ListBox
ItemsSource="{Binding LabelShapes}"
Width="{Binding ActualWidth, ElementName=Img}"
Height="{Binding ActualHeight, ElementName=Img}"
VerticalAlignment="Top"
HorizontalAlignment="Left"
SelectionMode="Extended"
Style="{StaticResource ListBoxStyle}"
ItemContainerStyle="{StaticResource ListBoxItemStyle}"/>
使用画布添加按钮:
<Style TargetType="ListBoxItem" x:Key="ListBoxItemStyle">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Canvas>
<Border
Canvas.Left="{Binding Rectangle.Left}"
Canvas.Top="{Binding Rectangle.Top}"
Width="{Binding Rectangle.Width}"
Height="{Binding Rectangle.Height}"
BorderBrush="{Binding Hexadecimal}"
BorderThickness="2"/>
<Grid Height="20" Canvas.Left="{Binding Rectangle.Left}" Canvas.Top="{Binding Rectangle.Bottom}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button Grid.Column="2" Width="50" Height="30" />
</Grid>
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
我的问题是,当我使用画布添加按钮时,无法选择 ListBoxItem。设置 ListBoxItem 样式并使 ListBoxItem 可以被选择的正确方法是什么?任何帮助将不胜感激。
更新
我添加了一些视觉状态:
<Style TargetType="ListBoxItem" x:Key="ListBoxItemStyle">
<Setter Property="Canvas.Left" Value="{Binding Rectangle.X}"/>
<Setter Property="Canvas.Top" Value="{Binding Rectangle.Y}"/>
<Setter Property="IsSelected" Value="{Binding IsSelected}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border x:Name="MyBorder"
Width="{Binding Rectangle.Width}"
Height="{Binding Rectangle.Height}"
BorderBrush="{Binding Hexadecimal}"
BorderThickness="2">
<Border.Background>
<SolidColorBrush Color="Transparent" />
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected" />
<VisualState x:Name="Selected">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="MyBorder" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedBackgroundColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="MyBorder" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedUnfocusedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Height="20" Canvas.Left="{Binding Rectangle.Left}" Canvas.Top="{Binding Rectangle.Bottom}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button Width="50" Height="30" />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
现在可以选择项目,但我不知道如何在边框底部放置一个按钮?
【问题讨论】:
-
在 ListBoxItem 的 ControlTemplate 中处理不同的视觉状态,您已将其替换为您自己的,无需任何状态处理。有关示例,请参阅ListBox ControlTemplate Example。除此之外,ControlTemplate 中还应该有一个 ContentPresenter,以显示实际的项目数据。你有一个带有 Border 和 Grid 孩子的 Canvas 也很奇怪。画布似乎毫无意义。将网格放入边框。
-
如果我使用 Grid 而不是 Canvas,ListBoxItem 无法通过 Canvas.Left 和 Canvas.Top 定位。
-
ListBoxItem 是 ItemsPanel 中 Canvas 的子项,而不是 ListBoxItem ControlTemplate 中的子项。在 ControlTemplate 内的 Border 上设置 Canvas.Left 和 Top 没有意义,因为您已经在 ListBoxItem 本身上设置了 Left 和 Top。
标签: wpf listbox listboxitem