Forum Discussion

TShelton41's avatar
TShelton41
Visitor
14 years ago

Menu on roImageCanvas

Hello all,

I'm trying to create a menu on top of a roImageCanvas. I have the menu being populated from xml and it is being put on the ImageCanvas using the setLayer function.
example i know this isn't right i have the code at home working but I'm at work and don't have it in front of me.

textArr{
text: "this is my text"
}

My question here is how do I make it into a menu where I can select it for options. I have the while loop for the events but the roImageCanvas doesn't let me set the list as focus and there is no msg.isListItemSelected() option. So basically what I want is when the screen loads the first item is selected and you can use the remote to move up and down. Any code suggestions would be welcomed or code snippets.

Thank you in advanced.
T
Roku Developer Program

3 Replies

  • RokuJoel's avatar
    RokuJoel
    Binge Watcher
    14 years ago
    Off the top of my head, here is one approach:

    you would probably want to have an array of associative arrays:

    buttonarray=[{text:"button 1",index:0,selected:true,screenposx:100,screenposy:100}
                          {text:"button 2",index:1,selected:false,screenposx:100,screenposy:140}
                          {text:"button3",index:2,selected:falsescreenposx:100,screenposy:180}]


    then you would iterate over the list of buttons and set the highlight based on which button is marked true:

    for each button in buttonarray
    if button.selected then
              drawselectedbutton(screen,button.text,button.screenposx,button.screenposy)
              focusedbutton=button.index
         else
              drawunselectedbutton(screen,button.text,button.screenposx,button.screenposy)
         end if

    end for


    where your drawselected/unselected are functions you create to update the buttons with a highlight.

    then you would listen for wahtever keypress tells you that the user is moving the focus, and you would iterate through all buttons again to change the selected to false for the others and the selected to true for the newly selected button.

    if the select / ok button on the remote is pressed, you would get the index of the selected button and use that in an if/then to determine what function you want to execute.

    - Joel
    (post edited to correct a syntax error)
  • RokuChris's avatar
    RokuChris
    Roku Employee
    14 years ago
    roImageCanvas also supports the built in menu mechanism like other screens using AddButton(). Of course you have no control over the positioning of the buttons with that solution.
  • TShelton41's avatar
    TShelton41
    Visitor
    14 years ago
    Thanks RokuJoel that is exactly what I was looking for. I will try it tonight and see if I can get it working. I have been trying for 3 days and couldn't figure it out.

    I may have a question about how to highlight it but I will try to figure it out first.

    I tried that RokuChris but didn't like the overall look of the button.