Search code examples
c#xamlsilverlightcombobox

How can I lose focus from a ComboBox after selecting a value from the dropdown?


I am trying to prevent the directional keys being used in a combobox after selecting the value in the combobox. The functionality of the combobox is that when a value is selected then it can no longer be clicked on, but after the dropdown closes the directional keys can then select a value already being used. I want to 'lose focus' of the combobox or prevent the directional keys from being used.

XAML

<Grid Grid.Row="1" Margin="20 10 20 0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="40" />
        <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
    <Grid.Resources>
        <Style TargetType="ComboBoxItem">
            <Setter Property="FontFamily" Value="Segoe UI"/>
            <Setter Property="Background" Value="#242424"/>
            <Setter Property="Foreground" Value="#FFFFFF" />
            <Setter Property="MinHeight" Value="20"/>
            <Setter Property="FontSize" Value="14"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="IsEnabled" Value="{Binding IsAvailable}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ComboBoxItem">
                        <Grid Background="{TemplateBinding Background}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="HighlightVisual">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                       <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Content">
                                               <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.33"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="SelectionStates">
                                    <VisualState x:Name="Unselected"/>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="HighlightVisual2">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                    <VisualState x:Name="Unfocused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid>
                                <Border x:Name="HighlightVisual" Width="{TemplateBinding Width}" BorderBrush="#88FFFFFF" Margin="1" BorderThickness="1" Background="#33FFFFFF" CornerRadius="1" Visibility="Collapsed"/>
                                <Border x:Name="HighlightVisual2" Width="{TemplateBinding Width}" Background="#33FFFFFF" Visibility="Collapsed"/>
                                <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Margin="5 0 5 0" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>

    <TextBlock Text="{Binding Path=StringLibrary.LM_Priority, Source={StaticResource Strings}}" FontFamily="Segoe UI" Foreground="#FFFFFF" FontSize="12" VerticalAlignment="Center" />

    <ComboBox Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Center" Width="200" Margin="10 0 0 0" ItemsSource="{Binding Priorities}" SelectedValuePath="PriorityNumber" SelectedValue="{Binding SelectedPriority, Mode=TwoWay}">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid>
                        <TextBlock Text="{Binding PriorityNumber}" FontFamily="Segoe UI Semibold" Foreground="#FFFFFF" FontSize="12" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="4 0 0 0" />

                        <TextBlock Text="{Binding CurrentList}" FontFamily="Segoe UI" FontStyle="Italic" MaxWidth="150" Foreground="#FFFFFF" FontSize="12" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="0 0 4 0" />
                    </Grid>
                </Grid>
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>

Solution

  • Thanks for the comments. Nighthawk441's advice would have worked fine, but Helix 88 reminded me of just using a shortcut to lose focus of the ComboBox. I just created a 'dummy' TextBox and set the focus to that after the DropDown is closed. I added

    DropDownClosed="ComboBox_DropDownClosed"
    

    to the ComboBox Here are the changes I made for those interested. Thanks again.

    <!--DROPDOWN-->
    <ComboBox Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Center" Width="200" Margin="10 0 0 0" ItemsSource="{Binding Priorities}" SelectedValuePath="PriorityNumber" SelectedValue="{Binding SelectedPriority, Mode=TwoWay}" DropDownClosed="ComboBox_DropDownClosed">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid>
                        <!--PRIORITY NUMBER-->
                        <TextBlock Text="{Binding PriorityNumber}" FontFamily="Segoe UI Semibold" Foreground="#FFFFFF" FontSize="12" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="4 0 0 0" />
    
                        <!--CURRENT LIST-->
                        <TextBlock Text="{Binding CurrentList}" FontFamily="Segoe UI" FontStyle="Italic" MaxWidth="150" Foreground="#FFFFFF" FontSize="12" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="0 0 4 0" />
                    </Grid>
                </Grid>
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>
    

    The 'dummy' textbox

    <!--used to lose focus when dropdown is closed-->
        <TextBox x:Name="dummyTB" Width="0" Height="0" Opacity="0" VerticalAlignment="Top" HorizontalAlignment="Right" />
    

    And the Code-Behind

    private void ComboBox_DropDownClosed(object sender, EventArgs e)
        {
            dummyTB.Focus();
        }