CODEWITHSUNDEEP
wpflistbox
hjyanghj
hjyanghj

Reputation: 338

How to keep highlighting selected item of listbox even listbox lost focus?

I have a ListBox with ItemsSource binding to an ObservableCollection<Item>.

Item has two string properties Name and Description.

DataTemplate for Item is StackPanel with Children: TextBlock with Text Bind to Name, TextBox with Text bind to Description.

What I have now: 1. When cursor is in TextBox corresponding to Description of an item, the corresponding ListBoxItem is highlighted. 2. I can use Tab to navigate among item's Textbox 3. If I move cursor to another named TextBox(theTextBox in code below) outside of listbox, the selected item do not highlight any more. That is my problem.

The png at https://drive.google.com/file/d/1tyxaBLnnjFUCJRTsHbwBwSvdU_X_L1fn/view?usp=sharing help explains my problem.

<DockPanel>
        <ListBox ItemsSource="{Binding Items}" DockPanel.Dock="Top" Height="100" KeyboardNavigation.TabNavigation="Cycle">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <Setter Property="IsTabStop" Value="False"/>
                    <Setter Property="Focusable" Value="False"/>
                    <Style.Triggers>
                        <Trigger Property="IsKeyboardFocusWithin" Value="True">
                            <Setter Property="Background" Value="LightGreen" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ListBox.ItemContainerStyle>
            <ListBox.ItemTemplate>
                <ItemContainerTemplate >
                    <StackPanel Orientation="Vertical">
                        <TextBlock Text="{Binding Name}"/>
                        <TextBox Text="{Binding Description}"/>
                    </StackPanel>
                </ItemContainerTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <TextBox Name-"theTextBox" AcceptsReturn="True" />
    </DockPanel>

Upvotes: 1

Views: 2040

Answers (2)

Andy
Andy

Reputation: 12276

The background when not focussed is different because it uses a different brush.

If this is something you want to apply to everything and you don't care whether they're focussed or not then you could over-ride the system colour. In a resource dictionary merged by app.xaml add:

<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}"
 Color={x:Static SystemColors.HighlightColor}"/>

Upvotes: 3

Peregrine
Peregrine

Reputation: 4546

This is the style that I use globally for ListBoxItems that includes keeping the selected item highlighted even when the control loses focus.

<Style TargetType="{x:Type ListBoxItem}">
    <Setter Property="Template">
        <!--  Revert to the "Windows 7" style template that used "SystemColors.HighlightBrushKey" etc  -->
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListBoxItem}">
                <Border
                    x:Name="ItemBorder"
                    Padding="{TemplateBinding Padding}"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Border>

                <ControlTemplate.Triggers>
                    <!--  Use the same colours for selected items, whether or not the control has focus  -->
                    <Trigger Property="IsSelected" Value="true">
                        <Setter TargetName="ItemBorder" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" />
                    </Trigger>

                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 1

Related Questions