Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Search instead for 
Did you mean: 
alexboyer
Level 7

Left / right navigation when ButtonGroup layoutDirection = horiz

Hello,

I'm trying to get a horizontal row of buttons to change focus when the left and right keys are pressed, but when I set layoutDirection="horiz" it still only uses up and down... I can't see what I'm doing wrong from the documentation. Any help would be appreciated!

Thanks
0 Kudos
7 Replies
alexboyer
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

I ended up using LayoutGroup instead combined with onKeyEvent and a field observer to handle the navigation.
0 Kudos
nmaves
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

Is this really the only way to do this?
0 Kudos
zachbarnes
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

Has anyone figure out how to handle this with the ButtonGroup?
0 Kudos
nmaves
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

I ended up writing my own <HorizontalButtonGroup>. 

I am sure it could be better.  Maybe I should put it out on github.

Nathan
0 Kudos
nithinks94
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

@nmaves, do you have this code documented anywhere?
0 Kudos
nmaves
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

I have not posted it anywhere but I could.  I ended up not even using the Button component from Roku.  I made my own with rectangles and text nodes as I wanted to apply different colors for the active and non-active states.
0 Kudos
csangkravat
Level 7

Re: Left / right navigation when ButtonGroup layoutDirection = horiz

Don't think too much!!, Please feel free and try 'focusButton'.
just in case, I used something like this!

//Sample Code
function onKeyEvent(key as String, press as Boolean) as Boolean
if key = "right"
         m.yourbutton.focusButton = 1
        else if key = "left"
         m.yourbutton.focusButton = 0
        end if
end function



here's the link: https://sdkdocs.roku.com/display/sdkdoc/ButtonGroup

Good Luck!
Geb
0 Kudos