The roGridScreen component was introduced with the 2.7 SDK and I know at least a few of you have been experimenting with it. Now that 2.8 has been released to the public, this may be a good time to tell you about some enhancements to roGridScreen available with the new firmware and run down a few general concepts that make using roGridScreen different than using other screen types.
New in 2.8
The 2.7 roGridScreen only allows portrait style poster art, similar to the Netflix grid. Starting with 2.8, roGridScreen has a SetGridStyle() function that allows you to change the aspect ratio of the posters on your grid. SetGridStyle() accepts the following parameter values:
“flat-portrait” (default)
“flat-landscape”
“flat-square”
“flat-16x9”
Also beginning with 2.8, roGridScreen supports two additional theme attributes that allow you to adjust the height of the overhang area on your grid screen. These attributes should be assigned as strings, just like other numeric theme attributes. They are:
gridScreenOverhangHeightSD (default: “49”)
gridScreenOverhangHeightHD (default: “69”)
Event Handling
This has been mentioned before, but it’s worth repeating. The 2.7 documentation for roGridScreen events is not correct. You should ignore the isListFocused() event as it never fires. In order to accomplish what you would expect isListFocused() to do, you should catch the isListItemFocused() event, whose GetIndex() function will return the index of the focused list (row) and whose GetData() function will return the index of the focused item (column).
The “Stack of Cards” paradigm
Because roGridScreen uses the video plane, trying to play video content while a roGridScreen is open in your channel can have weird results. For that reason, roGridScreen does not fit into the “stack of cards” paradigm most channels are built on. It is good practice not to open new screens from within a roGridScreen’s event loop. In general terms, when the user selects an item from a roGridScreen, you should save that selection, close the roGridScreen, and then process the selection.
“TheEndless” wrote:
Great information! Thanks, Chris!
Any information on recommended image sizes for the different grid styles? Also, is it still limited to JPGs?
“RokuChris” wrote:
The new Koldcast channel uses flat-landscape and PodTV uses flat-square. Netflix, of course uses flat-portrait.
Ah cool, just checked all three.
Mini feature request: a “flat-16x9” grid style would be swell.
“RokuChris” wrote:
The new Koldcast channel uses flat-landscape and PodTV uses flat-square. Netflix, of course uses flat-portrait.
Ah cool, just checked all three.
Mini feature request: a “flat-16x9” grid style would be swell.
Dunno if you tried it already, but I just looked and “flat-16x9” is a valid style.
“RokuChris” wrote:
trying to play video content while a roGridScreen is open in your channel can have weird results.
It looks like trying to play audio content has some pretty weird results as well.
“RokuChris” wrote:
Dunno if you tried it already, but I just looked and “flat-16x9” is a valid style.
I hadn’t, but I’m playing with it now. Awesome!
The 2.8 documentation says that isRemoteKeyPressed() is an roGridScreenEvent, but it doesn’t seem like it fires.
I ask because I want to use roGridScreen, but it wouldn’t be at the root of my screen stack. This isn’t a problem for people with the new remote, but users with an old remote (sans back button) would need a way to close the grid screen. My plan was to catch remoteKeyUp and close the screen if the user was on the top row.
I don’t think you can do it. Like a lot of components, the isRemoteKeyPressed event doesn’t fire for remote buttons that are handled by the component. You bring up a good point that I’ve been struggling with as well - how do you support users with the old remote?
isRemoteKeyPressed does fire for the Info button, although it makes that ‘clunk’ sound like something’s wrong. I haven’t tried the Back button yet to see how it’s handled.
The 9-button remote does not have a free button… All buttons are handled by roGridScreen directly and the only 9-button way out of the roGridScreen is the “home” button.
“RokuChris” wrote:
2.8 adds PNG support to roGridScreen
Is there any reason GIFs were left out?
I just downloaded the 2.8 SDK and it states that PNGs and GIFs are now supported, but GIFs are not working for me (PNGs do).
“RokuKevin” wrote:
The 9-button remote does not have a free button… All buttons are handled by roGridScreen directly and the only 9-button way out of the roGridScreen is the “home” button.
Dang. I’d really love to use roGridScreen, but that’s a pretty big roadblock for me.
Enhancement request: If you guys could figure out a solution to this for the next SDK release, I’d definitely utilize it.
“renojim” wrote:
It may be a bit of a kludge, but you could add a poster to your Grid that when clicked on exits the screen.
I think I’ll stick with good ol’ roPosterScreen for now, and hope that they address it in the future. Good thinking though.
“RokuKevin” wrote:
The 9-button remote does not have a free button… All buttons are handled by roGridScreen directly and the only 9-button way out of the roGridScreen is the “home” button.
Dang. I’d really love to use roGridScreen, but that’s a pretty big roadblock for me.
Enhancement request: If you guys could figure out a solution to this for the next SDK release, I’d definitely utilize it.
Since the roGridScreen doesn’t allow for wrapping around from the top to the bottom, or vice versa, I don’t see why they couldn’t allow exiting when up is pressed on the top row. I assume they prevented it initially, because of the smooth scrolling and didn’t want folks to accidentally exit the screen, but I would think they could detect a press and hold vs. a single press… If they made it an option that’s off by default, then current channels wouldn’t be affected.
“RokuKevin” wrote:
The 9-button remote does not have a free button… All buttons are handled by roGridScreen directly and the only 9-button way out of the roGridScreen is the “home” button.
Dang. I’d really love to use roGridScreen, but that’s a pretty big roadblock for me.
Hmm, now you’ve got me wondering what kind of navigation model you’re planning that has you going from some other screen, into a gridscreen, and then needing to come back out again.
Not that I’ve done anything with the gridscreen yet, but couldn’t you just make the top row a single icon (or set of icons for more functions) to close the gridscreen? Depending on your layout and content it may or may not look hokey, but it might work.
“kbenson” wrote:
Hmm, now you’ve got me wondering what kind of navigation model you’re planning that has you going from some other screen, into a gridscreen, and then needing to come back out again.
Not that I’ve done anything with the gridscreen yet, but couldn’t you just make the top row a single icon (or set of icons for more functions) to close the gridscreen? Depending on your layout and content it may or may not look hokey, but it might work.
I don’t know if it’s the case with what evilmax is trying to do, but I’ve got a situation where I’d like to display a list of top level genres, each with a series of sub-genres. While the sub-genres would make sense in a grid screen, the top level genres do not, so my home screen would ideally be a more traditional single line poster screen that opens a grid screen when one is selected. Even if I made the home screen a grid with a single line on it, there’s no intuitive way to return to that from the sub-genre grid screen.
I don’t know if it’s the case with what evilmax is trying to do, but I’ve got a situation where I’d like to display a list of top level genres, each with a series of sub-genres. While the sub-genres would make sense in a grid screen, the top level genres do not, so my home screen would ideally be a more traditional single line poster screen that opens a grid screen when one is selected. Even if I made the home screen a grid with a single line on it, there’s no intuitive way to return to that from the sub-genre grid screen.
I haven’t used the roGridScreen yet (man, I HATE trying to weigh in on a discussion with limited knowledge of the facts, but there’s thoughts I want to get out), but if you can modify the screen itself while it’s displayed, or redisplay without having to reload portions that haven’t changed, possibly each element of the first row could be the the top level category, and as you selected one, it could add and auto-populate the next row down in the GridScreen, repeat as needed?
“kbenson” wrote:
I haven’t used the roGridScreen yet (man, I HATE trying to weigh in on a discussion with limited knowledge of the facts, but there’s thoughts I want to get out), but if you can modify the screen itself while it’s displayed, or redisplay without having to reload portions that haven’t changed, possibly each element of the first row could be the the top level category, and as you selected one, it could add and auto-populate the next row down in the GridScreen, repeat as needed?
Great minds..
That’s actually one of the routes I was considering heading down (and I almost described in my last thread). The problem I see with that is that it won’t be familiar to the end user. That’s a pretty significant change to what people have become used to with the Roku UI, and I imagine it would result in A LOT of support requests. There’s also no way to differentiate between rows in the grid (i.e., have a different background color for a “genre” row) aside from the row title, so making the grid somewhat intuitive visually would be difficult, too.
That’s actually one of the routes I was considering heading down (and I almost described in my last thread). The problem I see with that is that it won’t be familiar to the end user. That’s a pretty significant change to what people have become used to with the Roku UI, and I imagine it would result in A LOT of support requests. There’s also no way to differentiate between rows in the grid (i.e., have a different background color for a “genre” row) aside from the row title, so making the grid somewhat intuitive visually would be difficult, too.
I imagine if it’s mostly empty when first loaded until someone selects an item, it will be fairly obvious from that point on. Images that indicate it expands into a new row might help, if they can be simple and intuitive.
