Set Focus to Checkbox in ComboBox in order to get keyboard control

Question

I have a ComboBox which has CheckBoxes as items:

<ComboBox ItemsSource="{Binding SomeCollectionProperty}">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <CheckBox IsChecked="{Binding SomeBoolProperty}" Width="20" />
                <TextBlock Text="{Binding Name}" Width="140" />
            </StackPanel>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

If the ComboBox gets keyboard focus, I can select an item with the up and down arrow keys. I can then switch focus to the CheckBox with tab and am able to switch the CheckBox's IsChecked state by pressing space.
I'm looking for a solution that allows me to do the same but without manually switching focus to the CheckBox. My desired behavior would be:

Choose item with arrow keys
Choose state with space

I tried to do it with EventTrigger and InputBinding and by fiddling around with the Focusable property but with no luck.
I would prefer a solution in xaml but a code-behind solution would still be appreciated.

score 1 · Accepted Answer · edited May 23 '17 at 12:06

1

take a look at this Q&A (answer provided by Sheridan)

the idea is to set CheckBox as FocusManager.FocusedElement

the difference here is that CheckBox is a part of DataTemplate and it is necessary to check IsFocused property of ComboBox

<CheckBox.Style>
    <Style TargetType="CheckBox">
        <Style.Triggers>
            <DataTrigger Binding="{Binding IsFocused, RelativeSource={RelativeSource AncestorType=ComboBox}}" Value="True">
                <Setter Property="FocusManager.FocusedElement" Value="{Binding RelativeSource={RelativeSource Self}}" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</CheckBox.Style>

edited May 23 '17 at 12:06

Community

1
1

answered Oct 20 '16 at 08:59

ASh

34,632
9
60
82

It works but I'm not quite sure why. From just looking at it, it appears as if every `CeckBox` will try to get focus whenever the `ComboBox` is focused. However only the selected one will actually get the focus. Is this because all the other `CheckBox`es are `Collapsed` and therefore cannot draw focus? – Tim Pohlmann Oct 20 '16 at 09:59

score 0 · Answer 2 · answered Oct 20 '16 at 08:42

I tried the following:

<ComboBoxItem GotFocus="ComboBoxItem_GotFocus">
        <StackPanel Orientation="Horizontal">
            <CheckBox Name="test" Width="20" Height="20" />
            <TextBlock  Width="140" />
        </StackPanel>
</ComboBoxItem>

The C#:

private void ComboBoxItem_GotFocus(object sender, RoutedEventArgs e)
{
    test.Focus();
}

This worked for me. Now I understand that this probably won't work in your situation because If I see it right, you're trying to use an MVVM pattern. What you can do though, is using a RelayCommand (good tutorial here) in your ViewModel that gets triggered when you get focus. Then when you get focus, you can set the new focus on your checkbox from your ViewModel. Correct me if I'm wrong since I'm pretty new to WPF, but hope that helps!

I don't have a specific `ComboBoxItem` because I'm using a `DataTemplate`. — Tim Pohlmann, Oct 20 '16 at 08:45
Yeah I already said that the example probably won't work, but it might give you an idea of how to solve it using MVVM and databinding. If you have a ViewModel with these two items then you can bind the gotfocus command to your ViewModel and play around with it — Markinson, Oct 20 '16 at 08:50

Set Focus to Checkbox in ComboBox in order to get keyboard control

2 Answers2