I have a ListBox using a DataTemplate (Grid with 2 TextBlock and 1 TextBox)
<ListBox Name="lbHistory" HorizontalContentAlignment="Stretch" MouseDoubleClick="LbHistory_MouseDoubleClick" Margin="10,0,0,0" ItemContainerStyle="{DynamicResource _ListBoxItemStyle}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="130"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<TextBlock VerticalAlignment="Center" Grid.Column="0" Text="{Binding Direction}"/>
<TextBlock VerticalAlignment="Center" Grid.Column="1" Text="{Binding TimeStamp, StringFormat=s}"/>
<TextBox VerticalContentAlignment="Center" Grid.Column="2" Text="{Binding Message}" IsReadOnly="True" IsReadOnlyCaretVisible="True" BorderThickness="0"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
...
Styles to make selected item bold
<Window.Resources>
<Style x:Key="_ListBoxItemStyle" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border Name="_Border"
Padding="2"
SnapsToDevicePixels="true">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<!-- This removes the blue selection around the item which looks ugly with the white text box
Also sets the selected item to bold -->
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="_Border" Property="Background" Value="Transparent"/>
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
<!-- This ensures that a clicked textbox passes the selection event through -->
<!-- Deselects the row. Better solution see below -->
<!--<Trigger Property="IsKeyboardFocusWithin" Value="true">
<Setter Property="IsSelected" Value="true" />
</Trigger>-->
<!-- This ensures that a clicked textbox passes the selection event through -->
<!-- https://stackoverflow.com/questions/15366806/wpf-setting-isselected-for-listbox-when-textbox-has-focus-without-losing-selec/15383435#15383435 -->
<EventTrigger RoutedEvent="PreviewGotKeyboardFocus">
<BeginStoryboard>
<Storyboard>
<BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="(ListBoxItem.IsSelected)">
<DiscreteBooleanKeyFrame KeyTime="0" Value="True"/>
</BooleanAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
The TextBox can be larger than the ListBox. The ListBox then shows a scrollbar. This works fine.
When I click into the TextBox and select the text via mouse (Click and hold LMB, move mouse to the right), the ListBox automatically scrolls to the right so that the end of the selected text is visible.
How can I achieve the same behavior using keyboard's curser keys (with or without holding shift key to select)?
Due to DataTemplate, TextBox can not be assigned to a member variable (Name="myTextBox" does not create a member variable)
Using TextBox's SelectionChanged and ListBox.ScrollIntoView(sender) does not work as the TextBox is already in the view