Roku Developer Program

[OG_OTT]

So before you tear into me =P, I did search the forums and Google for different ways to handle focus, but nothing jumped out at me.  But, even with that preamble, I have to believe that this has been asked a million times...hoping one of you can point me in the right direction.

In QT and Tk and Wx and WinForms, and various other languages/frameworks I've worked with in the past, they all had some sort of "grouping" mechanism that joined widgets/components into a some sort of common collection.  Yes, I have found the many groups like MarkupGrid, MarkupList, ButtonGroup, GridPanel, etc etc... but there is more I am after.  I was hoping to be able to wrap all my RSG base components + Custom components/widgets in a way that the "container" would handle the Focus() without having me to know screen/component state/current_focus().  The idea being that if I wanted to make a calculator with 3 columns and 3 rows (just making it simple), I could wrap my custom components in a 3 horizontal containers, and 1 vertical container, and every time the horizontal container didn't handle the focus, the vertical container would handle it.  

Basically, I'm really allergic to writing a massive OnKeyEvent() handler to juggle a multi-component screen focus.  

What did I miss in the tutorials or SDK that would allow me to accomplish this?  It looked like MarkupGrid with ContentNodes would give me 'something' of what I wanted... or I was really hoping LayoutGrid was going to handle Focus, but in the end these all APPEARED to fall short in reading the SDK that it wouldn't do what I wanted.

Any ideas?

[NB_]

i am not sure i follow, do you mean something different than this?
https://sdkdocs.roku.com/display/sdkdoc ... rol+Events

[OG_OTT]

Maybe?  I'm not positive (thus my question).  Below is some pseudo code that might (hopefully) explain what I am trying to accomplish.

<horizontalContainer>

   <CustomWidget01 randomAttribute01="data" />
   <verticalContainer>
       <CustomWidget02 randomAttribute02="data2" />
       <Button id="button01" text="My Button" translation="[0, 0]" />
   </verticalContainer>
   <TickerTapeWidget id="bottomTickerTapeWidget" />
</horizontalContainer>

The idea here would be that when I came into the scene/screen the focus would be first handled by the `horizontalWidget` and pressing up/down probably (maybe?) wouldn't do anything, but left and right would be handled.  But... in pressing right twice I'd get to the `verticalContainer` and thus at that point up and down would be handled.  Pressing up on the 0-th child-element in the `verticalContainer` would give focus back to the `horizontalWidget`, but pressing down would let me traverse to `CustomWidget02` and the Button.  once I got to the bottom of the `verticalContainer` it would pass back to the `horizontalContainer`, but pick up where it left off 2-nd element (aka `TickerTapeWidget`).  

(not unlike this:  https://wxpython.org/Phoenix/docs/html/sizers_overview.html
or this... https://srinikom.github.io/pyside-docs/PySide/QtGui/QVBoxLayout.html)

The idea being that I can nest as many vert or horizontal or "grid" type containers that automatically handle focus for any widget that is `focusable` and by reaching the boundaries of said-container it hands off to the next node/parent.

My ask is not unlike the link you provided, but what I am trying to avoid is writing a very complicated/stateful `OnKeyEvent` handler.  What's the closest analog in SDK2 (RSG) that might fit this ends?

Thanks again!

[NB_]

i am still not sure i understand but i'll improvise - say i am faced with problem of implementing calc keyboard from scratch. Assuming i'll use buttons and then focus would have to move in 4 directions, vertical and horizontal containers may help structurally but not re control. Instead i will task the panel parent with switching focus and buttons will handle only OK press. So each button will have a handler that cares about OK button press and consumes that (returns true for OK and false for all others, so it bubbles up to the panel). Panel then will handle left/right/up/down based on what key it receives and from which button, something like

movement = {left: [-1,0], right: [+1,0], up: [0, -1], down: [0, +1]} 
coord_to_id = [
    ["7", "8", "9"]
    ["4", "5", "6"], 
    ["1", "2", "3"], 
    ["0", "0", "0"], 
]
id_to_coord = {} ' reverse engineer from above table '
for y = 0 to coord_to_id.count() - 1
    for x = 0 to coord_to_id[y].count() - 1
        id_to_coord[coord_to_id[y][x]] = [x, y] 
    next 
next 
coords = id_to_coord[current_button] 
change = movement[key_pressed]
new_x = (coords[0] + change[0] + 3) mod 3 ' sorry for the hardcoded brutality normalizing wrap-around '
new_y = (coords[1] + change[1] + 4) mod 4 
new_button_id = coord_to_id[new_y][new_x]

this is just typed, not tried (includes a free bug)

[norcaljohnny]

It may be too late in the evening to think well but would a simple approach like this work..
leaving a couple of keyPress events and itemSelected functions to be handled.

<group> => <layoutGroup layoutDirection="vert or horiz"> => <node focusable=true>

[OG_OTT]

You may be on to something norcaljohnny.  

I haven't done that pattern before, but that's kind of what I would expect to see based on my previous experiences in other frameworks....
Does what you propose work?  If so, can you provide non-pseudo code (aka real code example) to showcase how it's all put together?

If I understood you correctly, you are putting a layoutGroup in a Group, then making child nodes, under layoutGroup, focusable...?  If they are focusable already/by default do I still need to set focusable=True?  (I'm wondering what's magically, if anything, about your suggested code)? =P

Also, did I miss this in the SDK?  If so, can you point me in the right direction so I can read up on the full design pattern/recommendations?

Thanks!

[norcaljohnny]

Hey did you ever figure this out, i was away for a bit and did not see your reply. But if you still want to see some working code please feel free to ask.

In short though I always use conditional statements, as I am use to that with php.

So for instance, I initially set up a setFocus on an item and use the focusable=true/false because it elements the chance of focusing an item which should never gain focus.

But when assigned as focusable it will by default jump to the the next focusable item/button with the directional pad.

Make sense?