C# 如何在ListBox中的每个ListBoxItem之间放置分隔符?
这是我的XAML:C# 如何在ListBox中的每个ListBoxItem之间放置分隔符?,c#,wpf,listbox,C#,Wpf,Listbox,这是我的XAML: <ListBox Grid.Row="1" x:Name="lstGames" Background="#343434" > <ListBox.ItemTemplate> <DataTemplate> <Grid ShowGridLines="True"> <Grid.ColumnDefinitions&
<ListBox Grid.Row="1" x:Name="lstGames" Background="#343434" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid ShowGridLines="True">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="{Binding ImageUrl}" Width="100"/>
<StackPanel Grid.Column="1">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Title:" />
<TextBlock Text="{Binding Title}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Release Date:" />
<TextBlock Text="{Binding ReleaseDate}" />
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
在DataTemplate中放置一个矩形并给它一种颜色,ListBox是否有某种方式可以在每个项目之间本机设置一些内容?您可以将分隔符的表示方式移动到
ListBoxItem
控制模板中,如以下故意简化的示例所示:
<Grid>
<Grid.Resources>
<PointCollection x:Key="sampleData">
<Point>10,20</Point>
<Point>30,40</Point>
<Point>50,60</Point>
</PointCollection>
</Grid.Resources>
<ListBox ItemsSource="{StaticResource sampleData}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<StackPanel>
<Separator/>
<ContentPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
10,20
30,40
50,60
这会将分隔符保留在项目模板之外。取舍是,您可能需要从默认的
ListViewItem
控件模板复制更多内容以满足您的需要。当然,分隔符
是可视化渲染分隔符的仅有的十几种方法之一。这是一个更好的示例,因为在顶部没有分隔符
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<StackPanel>
<Separator x:Name="Separator"/>
<ContentPresenter/>
</StackPanel>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource PreviousData}}" Value="{x:Null}">
<Setter Property="Visibility" TargetName="Separator" Value="Collapsed"/>
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
这是基于@EvaLacy给出的更完整的答案 由于该答案替换了
ListBoxItem
的模板,因此它禁用了在选择列表项时发生的内置高亮显示(因为高亮显示是通过原始模板中的触发器完成的)。要恢复此功能,请将默认触发器放入新模板中,并稍微调整模板内容:
我使用旧但有用的应用程序检索了这些触发器。我的解决方案:
<Style x:Key="STYLE_ListBoxSubItem" TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
<Setter Property="VerticalContentAlignment" Value="Stretch"></Setter>
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<DockPanel LastChildFill="True">
<Separator x:Name="Separator" DockPanel.Dock="Top" BorderBrush="Black" BorderThickness="2"/>
<Border x:Name="Border" SnapsToDevicePixels="true">
<ContentPresenter VerticalAlignment="Center" />
</Border>
</DockPanel>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource PreviousData}}" Value="{x:Null}">
<Setter Property="Visibility" TargetName="Separator" Value="Collapsed"/>
</DataTrigger>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Border" Property="Background" Value="Orange"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="#888888"/>
</Trigger>
<Trigger Property="Control.IsMouseOver" Value="True">
<Setter TargetName="Border" Property="Background" Value="LightGray"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- Usage -->
<ListBox ItemContainerStyle="{StaticResource STYLE_ListBoxSubItem}"/>
我同意将分隔符放在列表的最顶端是很奇怪的,但在底部看起来可能很好。为此,您可以在控件模板中将
移动到
下面,这也将消除对数据触发器的需要。如何使用项控件实现这一点?