更改 ItemContainerStyle 时 ListBoxItem 选择的问题
Issues with ListBoxItem selection when ItemContainerStyle was changed
我更改了 ItemContainerStyle 的样式,结果是这样的:
我很喜欢这个结果,但是在测试可用性时我注意到当我 select 一个没有文本或图像的区域(图像上的红色区域)时 "IsSelected" 不会触发也不会select 项目。如果不更改样式,则不会出现该问题..
有人知道原因以及如何解决该问题吗?
这是我的 xaml 代码:
<DockPanel>
<ListBox x:Name="lvCustomers" Margin="0" BorderThickness="0" SelectionMode="Single"
VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch"
ScrollViewer.VerticalScrollBarVisibility="Auto" Background="{x:Null}" >
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Grid>
<Border Name="BackgroundBorder" SnapsToDevicePixels="True"/>
<Border Name="Border">
<ContentPresenter />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter TargetName="BackgroundBorder" Property="Background" Value="Black" />
<Setter TargetName="BackgroundBorder" Property="Opacity" Value="0.5" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsFocused" Value="False"/>
</MultiTrigger.Conditions>
<Setter TargetName="BackgroundBorder" Property="Background" Value="Black" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<DockPanel Margin="10,0,0,5" HorizontalAlignment="Stretch">
<DockPanel Margin="0,10,10,10" DockPanel.Dock="Left" HorizontalAlignment="Stretch">
<TextBlock FontWeight="Bold" Foreground="White" x:Name="customerDetailsName" Text="{Binding Name}" FontSize="16" DockPanel.Dock="Top"/>
<DockPanel DockPanel.Dock="Top">
<TextBlock Foreground="White" x:Name="customerDetailsCityContent" Text="{Binding City}" FontSize="14" />
<TextBlock Foreground="White" x:Name="customerDetailsBarraContent" Text="-" FontSize="12" />
<TextBlock Foreground="White" x:Name="customerDetailsStateContent" Text="{Binding Region}" FontSize="14" />
</DockPanel>
<TextBlock Foreground="White" x:Name="customerDetailsCNPJContent" Text="{Binding CNPJ}" FontSize="14" />
</DockPanel>
<Image x:Name="customerImageStatus" Source="{Binding StatusImage}" Width="22" Height="22" Margin="10,0,25,0" DockPanel.Dock="Right" HorizontalAlignment="Right" />
</DockPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</DockPanel>
提前致谢。
请尝试在控件模板中设置 Background="Transparent" 或 IsHitTestVisible="True" 到网格和边框。要实现透明对象的命中测试,您应该设置背景透明。
我更改了 ItemContainerStyle 的样式,结果是这样的:
我很喜欢这个结果,但是在测试可用性时我注意到当我 select 一个没有文本或图像的区域(图像上的红色区域)时 "IsSelected" 不会触发也不会select 项目。如果不更改样式,则不会出现该问题..
有人知道原因以及如何解决该问题吗?
这是我的 xaml 代码:
<DockPanel>
<ListBox x:Name="lvCustomers" Margin="0" BorderThickness="0" SelectionMode="Single"
VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch"
ScrollViewer.VerticalScrollBarVisibility="Auto" Background="{x:Null}" >
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Grid>
<Border Name="BackgroundBorder" SnapsToDevicePixels="True"/>
<Border Name="Border">
<ContentPresenter />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter TargetName="BackgroundBorder" Property="Background" Value="Black" />
<Setter TargetName="BackgroundBorder" Property="Opacity" Value="0.5" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsFocused" Value="False"/>
</MultiTrigger.Conditions>
<Setter TargetName="BackgroundBorder" Property="Background" Value="Black" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<DockPanel Margin="10,0,0,5" HorizontalAlignment="Stretch">
<DockPanel Margin="0,10,10,10" DockPanel.Dock="Left" HorizontalAlignment="Stretch">
<TextBlock FontWeight="Bold" Foreground="White" x:Name="customerDetailsName" Text="{Binding Name}" FontSize="16" DockPanel.Dock="Top"/>
<DockPanel DockPanel.Dock="Top">
<TextBlock Foreground="White" x:Name="customerDetailsCityContent" Text="{Binding City}" FontSize="14" />
<TextBlock Foreground="White" x:Name="customerDetailsBarraContent" Text="-" FontSize="12" />
<TextBlock Foreground="White" x:Name="customerDetailsStateContent" Text="{Binding Region}" FontSize="14" />
</DockPanel>
<TextBlock Foreground="White" x:Name="customerDetailsCNPJContent" Text="{Binding CNPJ}" FontSize="14" />
</DockPanel>
<Image x:Name="customerImageStatus" Source="{Binding StatusImage}" Width="22" Height="22" Margin="10,0,25,0" DockPanel.Dock="Right" HorizontalAlignment="Right" />
</DockPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</DockPanel>
提前致谢。
请尝试在控件模板中设置 Background="Transparent" 或 IsHitTestVisible="True" 到网格和边框。要实现透明对象的命中测试,您应该设置背景透明。