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: 

Background Image

How do I add just a background Image to my PosterScreen, I do not want the OverHang or anything else, kinda like they use the in the sample customvideoplayer app, I made the images, and tried adding the canvas parts from that app to mine but that breaks it, what is the most simplistic way to say background="pkg:images/img.png"

Thanks
0 Kudos
8 REPLIES 8
destruk
Streaming Star

Re: Background Image

You'll need to recreate the poster screen through roImageCanvas. While difficult, TheEndless did that on a few of his channels.
0 Kudos

Re: Background Image

WOW .. ok .. I think I will use the overhang for now then lol .. at least until I get more familiar with the bright script ... if TheEndless is reading the forums and wants to PM me an example I would not mind lol

Thanks Guys!
0 Kudos
stitch1z
Visitor

Re: Background Image

I'm just learning myself, but there is a custom background image on the "Custom Video Player" example in the SDK.

If you want to play around with the code....

  'Resolution-specific settings:
mode = CreateObject("roDeviceInfo").GetDisplayMode()
if mode = "720p"
this.layout = {
full: this.canvas.GetCanvasRect()
top: { x: 0, y: 0, w:1280, h: 130 }
left: { x: 249, y: 177, w: 391, h: 291 }
right: { x: 700, y: 177, w: 350, h: 291 }
bottom: { x: 249, y: 500, w: 780, h: 300 }
}
this.background = "pkg:/images/back-hd.jpg"
this.headerfont = this.fonts.get("lmroman10 caps", 50, 50, false)
else
this.layout = {
full: this.canvas.GetCanvasRect()
top: { x: 0, y: 0, w: 720, h: 80 }
left: { x: 100, y: 100, w: 280, h: 210 }
right: { x: 400, y: 100, w: 220, h: 210 }
bottom: { x: 100, y: 340, w: 520, h: 140 }
}
this.background = "pkg:/images/back-sd.jpg"
this.headerfont = this.fonts.get("lmroman10 caps", 30, 50, false)
end if
0 Kudos

Re: Background Image

Thanks stitch1z, i had seen that as well and mentioned I tried to use that in my first post, but it broke my app. I am trying to get some clarity on it. Thanks for the help though.
0 Kudos
stitch1z
Visitor

Re: Background Image

My bad. I didn't notice that when I read your OP. :oops:
0 Kudos
TheEndless
Channel Surfer

Re: Background Image

"bobbydharrell" wrote:
WOW .. ok .. I think I will use the overhang for now then lol .. at least until I get more familiar with the bright script ... if TheEndless is reading the forums and wants to PM me an example I would not mind lol

Thanks Guys!

I'm afraid I can't really provide an example. I basically rewrote the entire roPosterScreen using the roImageCanvas, and it was a nightmare (you can see it in the screenshots of my SiriusXM channel: http://roku.permanence.com/#siriusxm). I definitely would not recommend it.
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

Re: Background Image

Thanks for the response! With the person who wrote it saying run away, I think I will take your advise and be happy with my logo lol

Thanks guys
0 Kudos

Re: Background Image

I have decided to go with this method since to do a custom background would be out of my BrightScript understanding ... hopefully this will be a feature they incorporate in future versions though.

Sub initTheme()

app = CreateObject("roAppManager")
theme = CreateObject("roAssociativeArray")

theme.OverhangOffsetSD_X = "72"
theme.OverhangOffsetSD_Y = "31"
theme.OverhangSliceSD = "pkg:/images/Overhang_Background_SD.png"
theme.OverhangLogoSD = "pkg:/images/Overhang_Logo_SD.png"

theme.OverhangOffsetHD_X = "125"
theme.OverhangOffsetHD_Y = "35"
theme.OverhangSliceHD = "pkg:/images/Overhang_Background_HD.png"
theme.OverhangLogoHD = "pkg:/images/Overhang_Logo_HD.png"

theme.BackgroundColor = "#409DDE"

app.SetTheme(theme)

End Sub
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.