Roku Developer Program

[skitdev]

Hey everyone,

I'm trying to play video (using roVideoPlayer) and display an overlay for it (using roImageCanvas). I can draw shapes and images to the canvas while video plays, but my attempts to hide the elements have been largely unsuccessful. I've had limited success with calling canvas.setLayer( layerNum, invalid), but canvas.clear() and canvas.clearLayer(layerNum) haven't worked. Am I doing something wrong?

I can provide some code samples if needed

Thanks for the help!

[NewManLiving]

its been awhile since I've used the canvas ( prefer roScreen ), but as I recall doing the same thing, you can set layer to a negative number -1 and it should hide that layer
behind everything else
also your transparent area over the videoplayer can also be on a so-called layer and you can move top layers behind that one ( I think I did that in an example on here somewhere ).

[skitdev]

Thanks, NewManLiving. An example would be super awesome, but I don't wnat to make you go digging. I'll give your suggests a try and let you know how it goes.

Thanks so much!

[NewManLiving]

Try setting the layer z order to -1 first than should do it, I do recall that is how I hid layers

[skitdev]

I tried it, but I'm not sure I'm doing it things correctly. Here's my code. I tried setting them to -1, I tried swapping with negative layers, and I tried moving the video up several layers. I don't think the video is getting added to the roImageCanvas. The layers seem to swap successfully (tried mixing them up), but they stay visible because the video seems to just be visible behind the roImageCanvas and not actually added to a layer.

Would you mind taking a look?

Library "v30/bslCore.brs"
Function main( ) as void
    'prep for input
    codes = bslUniversalControlEventCodes()
    port = CreateObject("roMessagePort")

    canvas = CreateObject("roImageCanvas")
    canvas.SetMessagePort(port)
    canvas.show()

    player = CreateObject("roVideoPlayer")
    player.SetMessagePort(port)
    player.SetPositionNotificationPeriod(1)
    player.SetContentList([
      {
          Stream : { url :"http://video.ted.com/talks/podcast/DavidKelley_2002_480.mp4" }
          StreamFormat : "mp4"
      }
    ])

    player.SetDestinationRect(canvas.GetCanvasRect())
    player.Play()
    canvas.setLayer( 1, player )

    yPos = 50
    bgHeight = 61 
    bgWidth = 214
    stringOffset = 31

    imageBox = { Color: "#ff183542", TargetRect: {x: (1280-bgWidth), y: yPos , w: bgWidth, h: bgHeight} }
    imageText = { Text: "asdf", TextAttrs: { font: "large", color: "#ffffffff" }, TargetRect: {x: (1280-bgWidth-stringOffset), y: yPos , w: bgWidth-stringOffset, h: bgHeight} }

    while(true)
        msg = wait(1000, port)
        if( msg <> invalid )
            if (msg.isRemoteKeyPressed())
                print "button press!"
                code = msg.GetIndex()
                if(code = 6)'OK

                canvas.allowUpdates(false)
                else if(code = 3) 'Down
                    print "down!, swap to negs"
                    canvas.SwapLayers(3,-4)
                    canvas.SwapLayers(4,-3)
                else if(code = 5) 'Right
                    print "right, render!"

                    canvas.SetLayer(3, imageBox)
                    canvas.SetLayer(4, imageText)
                else if(code = 4) 'Left
                    print "left, set to -1!"

                    canvas.SetLayer(-1, imageText)
                    canvas.SetLayer(-1, imageBox)
                else if(code = 2) 'Up
                    print "up, swap video!"
                    canvas.SwapLayers(1,100)
                endif
                canvas.allowUpdates(true)
                canvas.show()
            endif
        end if

    end while 

End Function

[NewManLiving]

I really don't like the imagecanvas (sigh), but off-hand looks like your canvas.allowUpdates(false)
gets set only if code = 6. Also what if you get other 'codes' then allowupdates true and show will be called for everything. I Can't say that's your problem but your logic seems a bit off. But then I've been plowing away every spare minute to perfect my own projects. So I'm pretty tired myself

[TheEndless]

ifImageCanvas.ClearLayer() is the correct way to hide a layer. I don't see that anywhere in your code. I've never used negative z-orders, so no idea if that works.

[skitdev]

"NewManLiving" wrote:
I really don't like the imagecanvas (sigh), but off-hand looks like your canvas.allowUpdates(false)
gets set only if code = 6. Also what if you get other 'codes' then allowupdates true and show will be called for everything. I Can't say that's your problem but your logic seems a bit off. But then I've been plowing away every spare minute to perfect my own projects. So I'm pretty tired myself

Thanks for the feedback. Sorry to keep you up!

code 6: that wasn't intentional.

allowUpdates(): The documentation says that surrounding large changes with allowUpdates(false) and allowUpdates(true) can speed it up. Perhaps I didn't use these properly?

show(): the documentation says that you need to call this to get changes to render. I figured I needed to call this even after hiding elements.

I tried looking through your post history for an roImageCanvas example but I didn't see it.

[skitdev]

"TheEndless" wrote:
ifImageCanvas.ClearLayer() is the correct way to hide a layer. I don't see that anywhere in your code. I've never used negative z-orders, so no idea if that works.

I was trying it earlier, but it wasn't working. I dropped it back in, and now it did work. Must be something else in there that I'm missing... I'll dig a bit and report back. Probably just a dumb mistake somewhere.

Thanks!

[skitdev]

I think I found the issue. Looks like what I needed to do was add

    canvas.ClearLayer(0)
    canvas.SetLayer(0, { Color: "#00000000", CompositionMode: "Source" })

at the beginning so that my canvas set up code looks like

    canvas = CreateObject("roImageCanvas")
    canvas.SetMessagePort(port)
    canvas.ClearLayer(0)
    canvas.SetLayer(0, { Color: "#00000000", CompositionMode: "Source" })
    canvas.show()

I'm not sure why it was necessary, but it appears to be the culprit. I can set layers to invalid or use clearLayer to clear them away.