Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Highlighted
Roku Employee
Roku Employee

roGridScreen and 2.8

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.
0 Kudos
28 Replies
TheEndless
Level 7

Re: roGridScreen and 2.8

Great information! Thanks, Chris!
Any information on recommended image sizes for the different grid styles? Also, is it still limited to JPGs?
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
evilmax17
Level 7

Re: roGridScreen and 2.8

Thanks for the update!
"RokuChris" wrote:
SetGridStyle() accepts the following parameter values:
  • "flat-portrait" (default)

  • "flat-landscape"

  • "flat-square"

Would you happen to have any pictures of what these three styles would look like?
My Roku Channels:
Viddler - viddler.com
Tested Fan - tested.com | Jamie & Adam
This is my next - theverge.com
1080p Showcase - RIP
Whiskey Media - RIP
======================
http://www.binarymoustache.com
0 Kudos
Roku Employee
Roku Employee

Re: roGridScreen and 2.8

"TheEndless" wrote:
Great information! Thanks, Chris!
Any information on recommended image sizes for the different grid styles? Also, is it still limited to JPGs?


2.8 adds PNG support to roGridScreen

flat-portrait: SD(110x140) HD(210x300)
flat-landscape: SD(140x94) HD(210x158)
flat-square: SD(96x86) HD(132x132)

"evilmax17" wrote:
Would you happen to have any pictures of what these three styles would look like?


The new Koldcast channel uses flat-landscape and PodTV uses flat-square. Netflix, of course uses flat-portrait.
0 Kudos
evilmax17
Level 7

Re: roGridScreen and 2.8

"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.
My Roku Channels:
Viddler - viddler.com
Tested Fan - tested.com | Jamie & Adam
This is my next - theverge.com
1080p Showcase - RIP
Whiskey Media - RIP
======================
http://www.binarymoustache.com
0 Kudos
renojim
Level 12

Re: roGridScreen and 2.8

"RokuChris" wrote:
2.8 adds PNG support to roGridScreen

Is there any reason GIFs were left out?

-JT
0 Kudos
Roku Employee
Roku Employee

Re: roGridScreen and 2.8

"evilmax17" wrote:
"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.
0 Kudos
renojim
Level 12

Re: roGridScreen and 2.8

"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.

-JT
0 Kudos
evilmax17
Level 7

Re: roGridScreen and 2.8

"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.

Any thoughts?
My Roku Channels:
Viddler - viddler.com
Tested Fan - tested.com | Jamie & Adam
This is my next - theverge.com
1080p Showcase - RIP
Whiskey Media - RIP
======================
http://www.binarymoustache.com
0 Kudos
renojim
Level 12

Re: roGridScreen and 2.8

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.

-JT
0 Kudos