Roku Developer Program

[tifroz]

I want to use a png image with a transparency gradient as a background for text in the context of an roImageCanvas, but Roku is rendering pixels with partial transparency as 100% opaque instead of say 50% (completely transparent pixels are correctly rendered as transparent)

Does Roku support any kind of image format with partial pixel transparency? If not, is there a workaround?


Here's the PNG I tried (below)

[squirreltown]

"tifroz" wrote:


Does Roku support any kind of image format with partial pixel transparency?

Yes, absolutely. I only use roScreen so perhaps someone else can help with specific roCanvas issues.

[TheEndless]

Make sure you haven't overridden the default CompositionMode. It needs to be "Source_Over" to enable transparency.

[tifroz]

Thanks for the help - it turns out I was drawing the same gradient image multiple time in a loop (there is a small animation involved), this made semi-transparent pixel look completely opaque.

My loop was essentially doing something like

[start loop]
canvas.clearLayer(1)
canvas.setLayer(1, myContent)
[end loop]

..apparently this wasn't enough to clear the existing layers drawn on each iteration, canvas.show() needs to be called in order for the clearLayer() command to take effect.

Quick rant: the roImageCanvas apis are severely under-documented considering they behave in ways that are less than intuitive. In particular I have a number of unanswered questions related to multiple layers (they don't seem to be drawn independently of each other, aka clearing a #1 layer will also clear a #2 layer). Of course I could build a dozen of test cases to figure out answers one by one but why make it so hard/time-consuming on developers

[RokuJoel]

roImageCanvas is really not the ideal way to do graphics or animations. It works best for static screens, and is OK for slideshows. It is possible to do a UI with it but performance will rarely be better than barely adequate except on the higher end roku devices. It is recommended to use roScreen or roSGScreen if you desire something that is more responsive and functional and which supports smooth animations.

- Joel

[tifroz]

"RokuJoel" wrote:
roImageCanvas is really not the ideal way to do graphics or animations.

This certainly appears to be true, however I need to overlay images on top of a video and as I have read, roImageCanvas combined with an roVideoPlayer is the only way to achieve this. This said, I would love to hear if there is a better alternative.

For background, the animation involved is very basic - a simple progress bar when the video is buffering, so a 5fps animation will do the job...hopefully it won't flicker too much on low end devices, but if it does, so be it.

[RokuJoel]

Hi Tifroz,

"tifroz" wrote:
d, roImageCanvas combined with an roVideoPlayer is the only way to achieve this. This said, I would love to hear if there is a better alternative.

roScreen combined with an roVideoPlayer is a way to do this with much more responsive graphics. Please see this thread which includes a downloadable example:

viewtopic.php?f=34&t=51332&hilit=rovideoplayer#p348595

- Joel