Handling focus problem/help

cpasjuste · 17 Nov 2022, 11:22

Hi,

First I'm sorry if this is not the right place for this, I guess this is a very "newbie" question and I'm not sure it's related to noesis at all...

I'm having some difficulties to handle focus in my simple application. I have a "main view" with a listbox ("ItemView") which is set as "Cycle" navigation and a viewbox ("LeftMenu") which start collapsed. I have added a "KeyTrigger" to the "main view" so it change my "LeftMenu" visibility, and this works fine.

However, I'm unable to "send" the focus to the "LeftMenu" when it become visible, i tried different actions (MoveFocusAction for example) without success and i think i would need a little help/direction with this....

NB: I'm using only directional keys for this as the app should be used with a gamepad (using tabulation does work for changing focus). I would also like to fix this in xaml, without using specific code.

Here is the xaml code :

<Window x:Class="HelloWorld.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
        xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions"
        FontFamily="./#American Captain" FontSize="36"
        Background="#FF2F2F2F"
        Title="NoesisGUI - Hello, World!" Width="640" Height="480">

    <Grid x:Name="LayoutRoot">
        <Grid x:Name="MainView" Margin="10">
            <b:Interaction.Triggers>
                <b:KeyTrigger FiredOn="KeyDown" Key="Left">
                    <b:ChangePropertyAction TargetName="LeftMenu" PropertyName="Visibility" Value="Visible"/>
                </b:KeyTrigger>
            </b:Interaction.Triggers>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*" />
                <ColumnDefinition Width="1*" />
            </Grid.ColumnDefinitions>
            <Border Background="#FF252525" BorderThickness="2" BorderBrush="#FF0864A1" CornerRadius="10, 10, 10, 10">
                <ListBox x:Name="ItemView" FontSize="20" noesis:Text.Stroke="#FF0864A1" noesis:Text.StrokeThickness="1"
                     KeyboardNavigation.DirectionalNavigation="Cycle" UseLayoutRounding="True"
                     ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                    <ListBox.ItemContainerStyle>
                        <Style TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource {x:Type ListBoxItem}}">
                            <Setter Property="Padding" Value="4, 1"/>
                            <Setter Property="Margin" Value="0"/>
                            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <b:Interaction.Triggers>
                        <b:EventTrigger EventName="Loaded">
                            <noesis:SetFocusAction/>
                        </b:EventTrigger>
                    </b:Interaction.Triggers>
                    <ListBoxItem>ITEM0</ListBoxItem>
                    <ListBoxItem>ITEM1</ListBoxItem>
                </ListBox>
            </Border>
        </Grid>

        <Viewbox x:Name="LeftMenu" Height="300" HorizontalAlignment="Left" Visibility="Collapsed" Margin="-2,0,0,0">
            <b:Interaction.Triggers>
                <b:KeyTrigger FiredOn="KeyDown" Key="Right">
                    <b:ChangePropertyAction TargetName="LeftMenu" PropertyName="Visibility" Value="Collapsed" />
                </b:KeyTrigger>
            </b:Interaction.Triggers>
            <Border Background="#FF252525" BorderThickness="2" BorderBrush="Red" CornerRadius="0, 10, 10, 0">
                <Grid KeyboardNavigation.DirectionalNavigation="Cycle">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50*"/>
                        <RowDefinition Height="50*"/>
                        <RowDefinition Height="50*"/>
                        <RowDefinition Height="50*"/>
                    </Grid.RowDefinitions>
                    <Button Grid.Row="0" Content="MENU0" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
                    <Button Grid.Row="1" Content="MENU1" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
                    <Button Grid.Row="2" Content="MENU2" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
                    <Button Grid.Row="3" Content="MENU3" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
                </Grid>
            </Border>
        </Viewbox>
    </Grid>
</Window>

Many thanks in advance for any help,
cpasjuste

23 Nov 2022, 12:20

Hello,

Could you try adding a noesis:SetFocusAction when you show the left menu, something like this:

    <Grid x:Name="LayoutRoot">
        <Grid x:Name="MainView" Margin="10">
            <b:Interaction.Triggers>
                <b:KeyTrigger FiredOn="KeyDown" Key="Left">
                    <b:ChangePropertyAction TargetName="LeftMenu" PropertyName="Visibility" Value="Visible"/>
                    <noesis:SetFocusAction TargetName="LeftMenuButton"/>
                </b:KeyTrigger>
            </b:Interaction.Triggers>
            ...
            <Viewbox x:Name="LeftMenu" Height="300" HorizontalAlignment="Left" Visibility="Collapsed" Margin="-2,0,0,0">
              ...
              <Button x:Name="LeftMenuButton" Grid.Row="0" Content="MENU0" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
              <Button Grid.Row="1" Content="MENU1" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
              <Button Grid.Row="2" Content="MENU2" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>
              <Button Grid.Row="3" Content="MENU3" HorizontalAlignment="Left" Background="{x:Null}" Foreground="White"/>

Please let me know if that works for you.

cpasjuste · 29 Nov 2022, 11:22

Hi,

Yes it works. Not sure how I missed the "TargetName" property...

Thanks again!

Handling focus problem/help Topic is solved

Handling focus problem/help

Re: Handling focus problem/help

Re: Handling focus problem/help

Who is online