Forums | NoesisGUI

Posted: **17 Jan 2025, 22:13**

Hi team at Noesis,

We use a listbox element derived from your tutorial sample here: https://github.com/Noesis/Tutorials/tre ... RadialMenu
We also use a gamepad for the navigation of our game UI but we're having trouble when it comes to navigating/sending focus to listbox items.
Our main two issues are:
1- We are struggling to navigate to the elements within the radial menu
2- We are not able to use XYFocus to send the focus to specific elements in the listbox since they don't have x:Name property since they are dynamically created from a list in the VM.

We tried many things but we keep bumping into the same issue, which is that our listbox items don't have x:Name property to use XYFocus.
We were however able to use other noesis properties on the main listbox element to send the focus inside the element, however it only sent the focus to the first element and wouldn't go to the others.

Is there a way that you can think of that would allow us to navigate inside the listbox, especially since it's the form of a radial menu, it is important that the navigation goes into the right direction?
Also is there maybe a way to use or modify XYFocus to use a tag or another property other than x:Name so that it could be used with dynamic elements?

Thank you for your time,
Hugo D.

Posted: **21 Jan 2025, 10:29**

Hello,

How would you decide which element should get focus when using directional navigation? It is entirely based on the viewmodel items?
In that case I'm thinking that you would need to define a behavior that you can attach to the ListBoxItems (you can set it in the ListBox.ItemContainerStyle). It will expose 4 properties (one for each of the XY directions) that will be bound to your item viewmodel.

<ListBox ...>
  <ListBox.ItemContainerStyle>
    <Style TargetType="ListBoxItem" BasedOn="{StaticResource YourListBoxItemStyle}">
      <Setter Property="noesis:StyleInteraction.Behaviors">
        <Setter.Value>
          <noesis:StyleBehaviorCollection>
              <b:XYNavigationBehavior
                NavigateLeft="{Binding LeftItem}" NavigateRight="{Binding RightItem}"
                NavigateTop="{Binding TopItem}" NavigateBottom="{Binding BottomItem}"/>
           </noesis:StyleBehaviorCollection>
         </Setter.Value>
       </Setter>
     </Style>
   <ListBox.ItemContainerStyle>
</ListBox>

The behavior will then manually set the XYFocus properties by finding the corresponding ListBoxItems that hold the specified items (it can use the ListBox ItemContainerGenerator.ContainerFromItem for that purpose).

Could that work for you?

Forums | NoesisGUI

Navigation and XYFocus with ListBox items

Navigation and XYFocus with ListBox items

Re: Navigation and XYFocus with ListBox items