WPF ListBox 修改鼠标悬停颜色和选中状态颜色

    每次使用到ListBox控件，鼠标悬停和选中时，ListBoxItem的默认样式太丑了，设置了ItemTemplate也不管用的，下面就讲述一下WPF更改ListBoxItem选中/鼠标悬浮时突出显示颜色的处理方法。

    经过查询和学习，最终发现要实现这两个功能主要是定义一个ItemContainerStyle来实现的，下面的示例代码重定义了ListBox控件中项的样式以及自定义选中项的颜色。选中ListBoxItem或鼠标悬浮在ListBoxItem上时，通过属性触发器修改ListBoxItem的选中状态的背景色和字体颜色；鼠标悬停时背景色和字体颜色，如下：

<ListBox x:Name="stud_lb">
	<ListBox.Resources>
		<!--非高亮文本色-->
		<SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Green"/>
		<Style TargetType="ListBox">
			<!--重定义ListBox中项的样式-->
			<Setter Property="ItemTemplate">
				<Setter.Value>
					<DataTemplate>
						<Grid Margin="0" HorizontalAlignment="Stretch" Width="200">
							<Border Margin="5" BorderBrush="SteelBlue" BorderThickness="1" CornerRadius="5" Background="{Binding Path=Background, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}}" >
								<Grid Margin="5">
									<Grid.RowDefinitions>
										<RowDefinition/>
										<RowDefinition/>
									</Grid.RowDefinitions>
									<TextBlock Text="{Binding StudentID}"/>
									<TextBlock Grid.Row="1"  Text="{Binding StudentName}"/>
								</Grid>
							</Border>
						</Grid>
					</DataTemplate>
				</Setter.Value>
			</Setter>
			<!--自定义选中项的颜色-->
			<Setter Property="ItemContainerStyle">
				<Setter.Value>
					<Style TargetType="ListBoxItem">                                
						<Style.Triggers>
							<Trigger Property="IsSelected" Value="true">
								<Setter Property="Background" Value="Yellow"/>
								<Setter Property="Foreground" Value="Red"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="LightGreen"/>
								<Setter Property="Foreground" Value="OrangeRed"/>
							</Trigger>
						</Style.Triggers>
					</Style>
				</Setter.Value>
			</Setter>
		</Style>
	</ListBox.Resources>
</ListBox>

    后台代码实现：主要是给ListBox控件绑定ItemsSource数据源。

public partial class ListBoxStyle : UserControl
{
	public ListBoxStyle()
	{
		InitializeComponent();
		for (int i = 0; i < 5; i++)
		{
			StudentsList.Add(new Student() { StudentAge = 12 + i, StudentID = i, StudentName = "JoanVan" + i });
		}
		this.stud_lb.ItemsSource = StudentsList;
	}

	public List<Student> StudentsList = new List<Student>();

	public class Student
	{
		public int StudentID { get; set; }
		public string StudentName { get; set; }
		public int StudentAge { get; set; }
	}
}

    当我们运行结果如下图，发现鼠标悬浮的颜色改变了，选中的颜色也使按预期的；但是ListBox选中和鼠标悬浮的背景颜色还是系统默认的（如右图）。

 

    要解决这个问题，我这里是通过修改ListBoxItem控件的Template；

<ListBox x:Name="stud_lb">
	<ListBox.Resources>
		<!--非高亮文本色-->
		<SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Green"/>
		<Style TargetType="ListBox">
			<!--重定义ListBox中项的样式-->
			<Setter Property="ItemTemplate">
				<Setter.Value>
					<DataTemplate>
						<Grid Margin="0" HorizontalAlignment="Stretch" Width="200">
							<Border Margin="5" BorderBrush="SteelBlue" BorderThickness="1" CornerRadius="5" Background="{Binding Path=Background, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}}" >
								<Grid Margin="5">
									<Grid.RowDefinitions>
										<RowDefinition/>
										<RowDefinition/>
									</Grid.RowDefinitions>
									<TextBlock Text="{Binding StudentID}"/>
									<TextBlock Grid.Row="1"  Text="{Binding StudentName}"/>
								</Grid>
							</Border>
						</Grid>
					</DataTemplate>
				</Setter.Value>
			</Setter>
			<!--自定义选中项的颜色-->
			<Setter Property="ItemContainerStyle">
				<Setter.Value>
					<Style TargetType="ListBoxItem">
						<Setter Property="SnapsToDevicePixels" Value="True"/>
						<Setter Property="Background" Value="Transparent"/>
						<Setter Property="Template">
							<Setter.Value>
								<ControlTemplate TargetType="{x:Type ListBoxItem}">
									<Border Background="Transparent" SnapsToDevicePixels="True">
										<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
									</Border>
								</ControlTemplate>
							</Setter.Value>
						</Setter>
						<Style.Triggers>
							<Trigger Property="IsSelected" Value="true">
								<Setter Property="Background" Value="Yellow"/>
								<Setter Property="Foreground" Value="Red"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="LightGreen"/>
								<Setter Property="Foreground" Value="OrangeRed"/>
							</Trigger>
						</Style.Triggers>
					</Style>
				</Setter.Value>
			</Setter>
		</Style>
	</ListBox.Resources>
</ListBox>

最终实现结果，选中和鼠标悬浮，背景颜色都只在ListBoxItem上显示了。

**************************************************************************************************************