Подсветка элементов в ListBox

ListBox часто используемый конрол для отображения разообразных списков. Для отображения ифнормации разработчики пользуются шаблонами отображения данных (DataTemplate). Пусть у нас есть ListBox с заполнеными данными:

<Window x:Class="ListBoxHighliter.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="341" Width="299">
    <Window.Resources>
        <DataTemplate x:Key="PersonTemplate">
            <Grid Margin="3" Background="LightGray">
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Grid.Row="0" Margin="5" Text="Фамилия" />
                <TextBlock Grid.Column="1" Grid.Row="0" Margin="5" Text="{Binding Surname}" />

                <TextBlock Grid.Column="0" Grid.Row="1" Margin="5" Text="Имя" />
                <TextBlock Grid.Column="1" Grid.Row="1" Margin="5" Text="{Binding Name}" />

                <TextBlock Grid.Column="0" Grid.Row="2" Margin="5" Text="Телефон" />
                <TextBlock Grid.Column="1" Grid.Row="2" Margin="5" Text="{Binding Phone}" />
            </Grid>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <ListBox x:Name="lstBox" ItemTemplate="{StaticResource PersonTemplate}" 
                 HorizontalContentAlignment="Stretch">
        </ListBox>
    </Grid>
</Window>

Для данных будем использовать коллекцию объектов ObservableCollection:

public class Person
{
    public string Surname { get; set; }
    public string Name { get; set; }
    public string Phone { get; set; }

    public Person()
    {
    }
}

Свой ListBox мы заполним в контрукторе формы:

ObservableCollection persons = new ObservableCollection()
{
    new Person(){Surname="Иванов", Name="Иван", Phone="555-65-88"},
    new Person(){Surname="Петров", Name="Петр", Phone="555-22-45"},
    new Person(){Surname="Арутров", Name="Артур", Phone="555-85-47"},
    new Person(){Surname="Голохвастов", Name="Свирид", Phone="555-36-58"}
};

lstBox.ItemsSource = persons;

Запускаем проект и видим следующую картину

Вокруг выбраного элемента синяя рамка. Чтобы её убрать, делаем следующее:

<ListBox.Resources>
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="White" />
</ListBox.Resources>

Получаем то что хотели.
Если вы хотите изменить цвет текста, то добавьте следующую строку:

<ListBox.Resources>
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Blue" />
</ListBox.Resources>

Получаем более приемлемую картину:

Вот и всё…

[download id=”21″]

2 Comments

  1. правильнее значение кисти привязать к действующему фону

Leave a Reply

Your email address will not be published. Required fields are marked *

http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_good.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif  http://csharpcoding.org/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif