migmigmig
Visitor
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-25-2011
05:22 PM
What are the required sizes for theme images?
So I'm now going through the theme options.
There's *lots* of images that can be specified, but nowhere does it suggest what the correct sizes are supposed to be (if I guess at them, I'll put it in parentheses):
OverhangSliceSD (720x480)
OverhangPrimaryLogoSD (Any)
OverhangSecondaryLogoSD (Any)
OverhangSliceHD (1280x720)
OverhangPrimaryLogoHD (Any)
OverhangSecondaryLogoHD (Any)
FilterBannerSliceSD (720xAny)
FilterBannerActiveSD (???xAny)
FilterBannerInactiveSD (???xAny)
FilterBannerSliceSD (1280xAny)
FilterBannerActiveSD (???xAny)
FilterBannerInactiveSD (???xAny)
etc...
(There's plenty of GridScreen images, too, but I'm too lazy to type them out here)
There's *lots* of images that can be specified, but nowhere does it suggest what the correct sizes are supposed to be (if I guess at them, I'll put it in parentheses):
OverhangSliceSD (720x480)
OverhangPrimaryLogoSD (Any)
OverhangSecondaryLogoSD (Any)
OverhangSliceHD (1280x720)
OverhangPrimaryLogoHD (Any)
OverhangSecondaryLogoHD (Any)
FilterBannerSliceSD (720xAny)
FilterBannerActiveSD (???xAny)
FilterBannerInactiveSD (???xAny)
FilterBannerSliceSD (1280xAny)
FilterBannerActiveSD (???xAny)
FilterBannerInactiveSD (???xAny)
etc...
(There's plenty of GridScreen images, too, but I'm too lazy to type them out here)
9 REPLIES 9
destruk
Streaming Star
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-25-2011
07:51 PM
Re: What are the required sizes for theme images?
migmigmig
Visitor
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-25-2011
08:16 PM
Re: What are the required sizes for theme images?
Thanks for the link, but that's not really what I need.
Mostly that's talking about all the various disparate thumbnail image sizes --
What I REALLY need is the "FilterBannerXXXXXX" image sizes, specifically the HD and SD widths for the active and inactive buttons (I took a guess and it's obviously wrong and equally obviously looking for a specific width).
Mostly that's talking about all the various disparate thumbnail image sizes --
What I REALLY need is the "FilterBannerXXXXXX" image sizes, specifically the HD and SD widths for the active and inactive buttons (I took a guess and it's obviously wrong and equally obviously looking for a specific width).
destruk
Streaming Star
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-25-2011
08:53 PM
Re: What are the required sizes for theme images?
It mentions overhang sizes and filter sizing as well as telling you about notes to keep them within the boundaries for SD and HD so they can be seen. I'm sorry it didn't give you what you are requesting.
Overhang Art: (The stripe at the top of all your screens in your channel)
Note that Overhangs are designed in two different ways. Some channels
will have their logos part of the Overhang slice image and not have separate
logos displayed over the slice backround. Other channels will use the
primary and/or secondary logos and their offsets to display logos on top of
the background slice. The first option gives the artist complete control of
the layout. The second option requires the developer to code offsets in the
script but gives the flexibility of programatically displaying different
icons over the background slice.
OverhangSliceSD
Overhang width SD: 720
suggested maximum Overhang height SD: 83
enforced maximum Overhang height SD: 92
OverhangSliceHD
Overhang width HD: 1280
suggested maximum Overhang height HD: 124
enforced maximum Overhang height HD: 138
Between the suggested maximum height and the enforced maximum height
is a transition area in which graphic artists should alpha blend their
overhang art into the screen background. The transition area will
be overlayed by the Filter Banner, Modal Dialogs, and other native
UI widgets. Therefore the transition area of the overhang will not
always be visible. Note that the Overhang width pattern will be
repeated if it is not full width.
A solid Overhang can be created with a width of 1 pixel and the same
pixel will be extended to 720 or 1280 width depending on SD or HD.
OverhangPrimaryLogoSD
OverhangSecondaryLogoSD
OverhangPrimaryLogoHD
OverhangSecondaryLogoHD
If you've chosen to use these logos, they must fit nicely
in the Overhang enforced max dimensions.
Overhang Art: (The stripe at the top of all your screens in your channel)
Note that Overhangs are designed in two different ways. Some channels
will have their logos part of the Overhang slice image and not have separate
logos displayed over the slice backround. Other channels will use the
primary and/or secondary logos and their offsets to display logos on top of
the background slice. The first option gives the artist complete control of
the layout. The second option requires the developer to code offsets in the
script but gives the flexibility of programatically displaying different
icons over the background slice.
OverhangSliceSD
Overhang width SD: 720
suggested maximum Overhang height SD: 83
enforced maximum Overhang height SD: 92
OverhangSliceHD
Overhang width HD: 1280
suggested maximum Overhang height HD: 124
enforced maximum Overhang height HD: 138
Between the suggested maximum height and the enforced maximum height
is a transition area in which graphic artists should alpha blend their
overhang art into the screen background. The transition area will
be overlayed by the Filter Banner, Modal Dialogs, and other native
UI widgets. Therefore the transition area of the overhang will not
always be visible. Note that the Overhang width pattern will be
repeated if it is not full width.
A solid Overhang can be created with a width of 1 pixel and the same
pixel will be extended to 720 or 1280 width depending on SD or HD.
OverhangPrimaryLogoSD
OverhangSecondaryLogoSD
OverhangPrimaryLogoHD
OverhangSecondaryLogoHD
If you've chosen to use these logos, they must fit nicely
in the Overhang enforced max dimensions.

TheEndless
Channel Surfer
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-25-2011
08:56 PM
Re: What are the required sizes for theme images?
Not definitive, but I use the following for the filter banner...
filter banner slice HD: 1x70
filter button HD: 375x54
filter banner slice SD: 1x47
filter button SD: 210x37
filter banner slice HD: 1x70
filter button HD: 375x54
filter banner slice SD: 1x47
filter button SD: 210x37
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)
Instant Watch Browser (NetflixIWB), Aquarium Screensaver (AQUARIUM), Clever Clocks Screensaver (CLEVERCLOCKS), iTunes Podcasts (ITPC), My Channels (MYCHANNELS)
migmigmig
Visitor
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-26-2011
12:00 AM
Re: What are the required sizes for theme images?
Thanks, I'll try that!
ionatan
Roku Guru
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-04-2011
09:11 AM
Re: What are the required sizes for theme images?
Related to this:
Is it possible to change logo when "page" is changed. Let's say a user is in main page of the channel, and then he goes in a specific category. Can I display there another logo?
And where I can use Overhang Secondary Logo?
"destruk" wrote:
....The second option requires the developer to code offsets in the
script but gives the flexibility of programatically displaying different
icons over the background slice.
Is it possible to change logo when "page" is changed. Let's say a user is in main page of the channel, and then he goes in a specific category. Can I display there another logo?
And where I can use Overhang Secondary Logo?
destruk
Streaming Star
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-04-2011
10:11 AM
Re: What are the required sizes for theme images?
You could, however then you need to set up an array to track which screens have which logo, so when a screen closes you can change the logos back to what they were prior, and whenever the logos are changed, it flickers the default blue theme until it can display the logo you want. To avoid that I suppose you could use a single roImageCanvas for all 'screens' and manually program the logo graphics, positioning, background, and item displays. Or just ignore the changeover sequence.
Maybe some day Roku will have the capability of having more than a single user-defined theme. You can use the overhang secondary logo wherever you like. Just if one is set, it'll be displayed. So if you define the primary logo AND the secondary logo, both will be drawn on the screen. If you just have the secondary defined, then the secondary will be displayed - if you follow.
What we've done before is monitor the close event for the screen on top, when the screen is closed it refers to the array and subtracts 1 from the array index and resets the theme with the saved logo name. When a new screen opens we grab the new logo name from the xml, push the name into the array (to increase it by one), and reset the theme again. There might be a better way, but that worked for our purposes.
Maybe some day Roku will have the capability of having more than a single user-defined theme. You can use the overhang secondary logo wherever you like. Just if one is set, it'll be displayed. So if you define the primary logo AND the secondary logo, both will be drawn on the screen. If you just have the secondary defined, then the secondary will be displayed - if you follow.
What we've done before is monitor the close event for the screen on top, when the screen is closed it refers to the array and subtracts 1 from the array index and resets the theme with the saved logo name. When a new screen opens we grab the new logo name from the xml, push the name into the array (to increase it by one), and reset the theme again. There might be a better way, but that worked for our purposes.
roquoonewbie
Visitor
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
01-05-2012
09:02 PM
Re: What are the required sizes for theme images?
Is there some trick for getting the secondary overhang logo to show? I can't for the life of me get it to appear. Very simple function is below. Primary shows. Secondary does not.
Sub initTheme()
app = CreateObject("roAppManager")
theme = CreateObject("roAssociativeArray")
theme.OverhangPrimaryLogoOffsetHD_X = "123"
theme.OverhangPrimaryLogoOffsetHD_Y = "48"
theme.OverhangPrimaryLogoHD = "pkg:/images/Logo_Overhang_Roku_SDK_HD.png"
theme.OverhangSecondaryLogoOffsetHD_X = "373"
theme.OverhangSecondaryLogoOffsetHD_Y = "48"
theme.OverhangSecondaryLogoHD = "pkg:/images/my_logo_hd.png"
app.SetTheme(theme)
End Sub
Sub initTheme()
app = CreateObject("roAppManager")
theme = CreateObject("roAssociativeArray")
theme.OverhangPrimaryLogoOffsetHD_X = "123"
theme.OverhangPrimaryLogoOffsetHD_Y = "48"
theme.OverhangPrimaryLogoHD = "pkg:/images/Logo_Overhang_Roku_SDK_HD.png"
theme.OverhangSecondaryLogoOffsetHD_X = "373"
theme.OverhangSecondaryLogoOffsetHD_Y = "48"
theme.OverhangSecondaryLogoHD = "pkg:/images/my_logo_hd.png"
app.SetTheme(theme)
End Sub
roquoonewbie
Visitor
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
01-07-2012
05:59 PM
Re: What are the required sizes for theme images?
Does anyone have an example of an initThem() function that displays a secondary logo?