Roku Developer Program

Join our online forum to talk to Roku developers and fellow channel creators. Ask questions, share tips with the community, and find helpful resources.
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
scaper12123
Visitor

How to make buttons usable?

EDIT: Never mind, I just had forgotten quotes and it was interfearing with the onKeyEvent prompt.

EDIT: I was told that I needed to implement onKeyEvent() but, when I did, I didn't get the expected result. Am I missing something here?

I have a particular circumstance with a set of buttons I've made, where the arrangement is made using a layout group with a button node and two separate buttonGroup nodes. Upon running the code, none of the buttons can be selected and I am not sure how to make it so a button can be selected. (It may also be worth noting that only one button appears to be made in each node group, as far as I can tell.) Note that I am aware of the focusButton parameter in buttonGroups, but the button I want to initially have selected is the one created by the button node rather than either of the buttonGroups.

Also note that I am aware that, in order to make actual use of the buttons, I have to create a listening object which executes a function upon the user selecting any of the buttons. I am reasonably confident I will be able to figure that part out. It's the actual functionality of the menu I've created that I'm having difficulty with.

This is the code I've written. Any help would be appreciated.
[spoiler=code:3sq2vlnh]
sub init()
'we can add a background here
'm.top.backgroundURI= some image url
m.top.setFocus(true)

layoutgroup = m.top.findNode("MainScreenGroup")

devInfo = createObject("roDeviceInfo")
UIResolution = devInfo.getUIResolution()

lgr = layoutgroup.boundingRect()
lglr = layoutgroup.localBoundingRect()

x = -lgr.x + (UIResolution.width - lglr.width) / 2
y = -lgr.y + (UIResolution.height - lglr.height) / 2

layoutgroup.translation = [x, y]

end sub


<?xml version="1.0" encoding="utf-8"?>
<component name="MainScreen" extends="Scene">

<script type="text/brightscript" uri="pkg:/components/MainScreen.brs" />

<children>

<Group id ="MainScreenGroup">

<LayoutGroup
layoutDirection ="vert"
vertAlignment="center"
itemSpacings="[10]"
addItemSpacingAfterChild="true" >

<Button
text="Watch live service"
minWidth="1010"
height ="200"
showFocusFootprint="true"
/>

<LayoutGroup
layoutDirection ="horiz"
itemSpacings="10"
addItemSpacingAfterChild="true" >

<ButtonGroup id="buttonPairLeft"
rightJustify ="false"
minWidth ="500"
buttonHeight ="150"
buttons='["test1", "test2"]'
/>

<ButtonGroup id="buttonPairRight"
rightJustify ="false"
minWidth ="500"
buttonHeight ="150"
buttons='["test3", "test4"]'
/>

</LayoutGroup>

</LayoutGroup>

</Group>

</children>

</component>
[/spoiler:3sq2vlnh]
I AM THE ARCHMAGE... who is also rather new to Brightscript so forgive me for seeming inept at times.
0 Kudos
5 REPLIES 5
Veeta
Visitor

Re: How to make buttons usable?

Use setFocus on the Button to put the focus there (not on m.top), then implement onKeyEvent() in MainScreen.brs that listens to a "down" button press and calls setFocus on the next ButtonGroup. This should simulate the movement downward seamlessly across the Button/Groups.
0 Kudos
scaper12123
Visitor

Re: How to make buttons usable?

"Veeta" wrote:
Use setFocus on the Button to put the focus there (not on m.top), then implement onKeyEvent() in MainScreen.brs that listens to a "down" button press and calls setFocus on the next ButtonGroup. This should simulate the movement downward seamlessly across the Button/Groups.


that helps a lot! thank you
I AM THE ARCHMAGE... who is also rather new to Brightscript so forgive me for seeming inept at times.
0 Kudos
scaper12123
Visitor

Re: How to make buttons usable?

"Veeta" wrote:
Use setFocus on the Button to put the focus there (not on m.top), then implement onKeyEvent() in MainScreen.brs that listens to a "down" button press and calls setFocus on the next ButtonGroup. This should simulate the movement downward seamlessly across the Button/Groups.


ok so I implemented what you suggested and nothing seems to happen when I press any of the buttons, even though I implemented an action for each directional button. Have I done something wrong here?
[spoiler=code:ro010n6k]
	m.front = m.top.findNode("front")		'top most button
m.left = m.top.findNode("buttonPairLeft") 'left pair of buttons
m.right = m.top.findNode("buttonPairRight") 'right pair of buttons
m.front.setFocus(true) '(should) set focus on the top button

function onKeyEvent(key as string, press as boolean) as boolean
handled = false
if press
if key=back
handled = false
else
if key="down"
m.left.setFocus(true)
else if key="up"
m.front.setFocus(true)
else if key="left"
m.left.setFocus(true)
else if key="right"
m.right.setFocus(true)
end if
handled = true
end if
end if
return handled
end function
[/spoiler:ro010n6k]
I AM THE ARCHMAGE... who is also rather new to Brightscript so forgive me for seeming inept at times.
0 Kudos
TheEndless
Channel Surfer

Re: How to make buttons usable?

Your code is probably crashing on this line:
if key=back

"back" should be in quotes.
My Channels: http://roku.permanence.com - Twitter: @TheEndlessDev
Instant Watch Browser (NetflixIWB), Aquarium Screensaver (AQUARIUM), Clever Clocks Screensaver (CLEVERCLOCKS), iTunes Podcasts (ITPC), My Channels (MYCHANNELS)
0 Kudos
scaper12123
Visitor

Re: How to make buttons usable?

"TheEndless" wrote:
Your code is probably crashing on this line:
if key=back

"back" should be in quotes.


yeah, I swiftly discovered that was my problem. it's working exactly as intended now!
I AM THE ARCHMAGE... who is also rather new to Brightscript so forgive me for seeming inept at times.
0 Kudos
Need Assistance?
Welcome to the Roku Community! Feel free to search our Community for answers or post your question to get help.

Become a Roku Streaming Expert!

Share your expertise, help fellow streamers, and unlock exclusive rewards as part of the Roku Community. Learn more.