Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Search instead for 
Did you mean: 
bcoding
Level 7

roImageCanvas and roScreen

Hi,
Can I use roImageCanvas and roScreen together in an application. Basically, I am creating an app that will have a welcome screen then it will guide the user to another page to enter their username and pass. Then next page the app will display some information in the screen and so on.
I have developed the app using roImageCanvas and it runs fine. However, I am curious if I can create some of the pages in roScreen like the username and password page where I can create my own cutomized keyboard using roscreen and have other pages in roImageCanvas.
Is it possible??

Thanks in advance.
0 Kudos
8 Replies
NewManLiving
Level 7

Re: roImageCanvas and roScreen

While never having tried it, theoretically and according to documentation as I understand it, if you open your channel with an imagecanvas on the bottom and then open a roScreen on top you should be OK. I do this with a paragraph screen and an rovideoscreen. I don't Think there will be any difference with an imagecanvas, may be. The only thing is once the roScreen is open you have to get rid of it by setting the variable to invalid to get back to your imagecanvas. There is no close. And you cannot open an imagecanvas or anything else non-roScreen over it. So in your case for a keyboard it should be ok
My Channels: 2D API Framework Presentation: https://owner.roku.com/add/2M9LCVC
Updated: 11-11-2015 - Completed Keyboard interface
The Joel Channel ( Final Beta )
0 Kudos
bcoding
Level 7

Re: roImageCanvas and roScreen

"NewManLiving" wrote:
While never having tried it, theoretically and according to documentation as I understand it, if you open your channel with an imagecanvas on the bottom and then open a roScreen on top you should be OK. I do this with a paragraph screen and an rovideoscreen. I don't Think there will be any difference with an imagecanvas, may be. The only thing is once the roScreen is open you have to get rid of it by setting the variable to invalid to get back to your imagecanvas. There is no close. And you cannot open an imagecanvas or anything else non-roScreen over it. So in your case for a keyboard it should be ok



Thank you for the response. The reason why I am asking this is because in documentation it says " Other screen components cannot be intermixed with roScreens as the roScreen display stack is maintained independently from the main screen component display stack."
0 Kudos
NewManLiving
Level 7

Re: roImageCanvas and roScreen

It believe it means that once created you cannot mix the two and once closed you can begin to use the other components. There are only two screen stacks roScreen and everything else. If I can open a roScreen over an roParagraph then there is no reason that you cannot do the same with an image canvas. However you can't create anything else on top of the roScreen but another roScreen and you cannot resume using the image canvas until you close your roScreen. Just give it a try. You don't have to put anything on the screens. Just open an roimagecanvas in one color then sleep a second, open a roScreen and clear it in another color don't forget to call swapbuffers or finish depending on the type of roScreen, and sleep a second then invalidate the roScreen which should return you to your image canvas
My Channels: 2D API Framework Presentation: https://owner.roku.com/add/2M9LCVC
Updated: 11-11-2015 - Completed Keyboard interface
The Joel Channel ( Final Beta )
0 Kudos
bcoding
Level 7

Re: roImageCanvas and roScreen

"NewManLiving" wrote:
It believe it means that once created you cannot mix the two and once closed you can begin to use the other components. There are only two screen stacks roScreen and everything else. If I can open a roScreen over an roParagraph then there is no reason that you cannot do the same with an image canvas. However you can't create anything else on top of the roScreen but another roScreen and you cannot resume using the image canvas until you close your roScreen. Just give it a try. You don't have to put anything on the screens. Just open an roimagecanvas in one color then sleep a second, open a roScreen and clear it in another color don't forget to call swapbuffers or finish depending on the type of roScreen, and sleep a second then invalidate the roScreen which should return you to your image canvas



thanks a lot for these information. I will give it a try.
0 Kudos
NewManLiving
Level 7

Re: roImageCanvas and roScreen

Here is a sample that shows it is possible, you need to deal with the transition-flash. I use a transition fade for one application where the client wanted to retain the roVideoScreen. It looks seamless if done properly

Sub Main() 

backL = 0
helloL = 1
back = { Color:"#262626", CompositionMode: "Source" }

hello = {
Text:"Press Ok To show a blue roScreen for 2 seconds, Back To Exit"
TextAttrs:{Color:"#FFFFFFFF", Font:"Medium",
HAlign:"HCenter", VAlign:"VCenter",
Direction:"LeftToRight"}
TargetRect:{x:0,y:0,w:1280,h:720}
}


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

canvas.SetLayer( backL , back )
canvas.SetLayer( helloL, hello )
canvas.Show()

roScreen = Invalid

while(true)
msg = wait(0,port)
if type(msg) = "roImageCanvasEvent" then
if (msg.isRemoteKeyPressed()) then
i = msg.GetIndex()

if (i = 0) then
canvas.close()
else if i = 6 and roScreen = Invalid
roScreen = CreateObject( "roScreen", True, 1280, 720 )
roScreen.Clear( &h15247CFF )
roScreen.SwapBuffers()
sleep( 2000 )
roScreen = Invalid
end if
else if (msg.isScreenClosed()) then
return
end if
end if
end while
End Sub
My Channels: 2D API Framework Presentation: https://owner.roku.com/add/2M9LCVC
Updated: 11-11-2015 - Completed Keyboard interface
The Joel Channel ( Final Beta )
0 Kudos
bcoding
Level 7

Re: roImageCanvas and roScreen

Awesome. Thanks a lot for these detailed information.

I used your code and played around with the code by replacing the color with background image. In image canvas, the background image is full while in the roScreen the background image is kinda zoomed in. I have changed the display size of the roScreen, it doesn't affect anything.

The image that I am using is 1920 x 1200 .

I modified the code in the following way:

Library "v30/bslDefender.brs"

Sub Main()

backL = 0
helloL = 1

back = { url:"pkg:/locale/default/images/background1.jpg", CompositionMode: "Source" }

hello = {
Text:"Press Ok To show a blue roScreen for 2 seconds, Back To Exit"
TextAttrs:{Color:"#FFFFFFFF", Font:"Medium",
HAlign:"HCenter", VAlign:"VCenter",
Direction:"LeftToRight"}
TargetRect:{x:0,y:0,w:1280,h:720}
}


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

canvas.SetLayer( backL , back )
canvas.SetLayer( helloL, hello )
canvas.Show()
info= canvas.GetCanvasRect()


roScreen = Invalid

while(true)
msg = wait(0,port)
if type(msg) = "roImageCanvasEvent" then
if (msg.isRemoteKeyPressed()) then
i = msg.GetIndex()

if (i = 0) then
canvas.close()
else if i = 6 and roScreen = Invalid
roScreen = CreateObject( "roScreen", True, 1920, 1200 )
roScreen.Clear( &h15247CFF )

img= createObject("roBitmap","pkg:/locale/default/images/background2.jpg")
roScreen.drawObject(0,0,img)
roScreen.SwapBuffers()
sleep( 4000 )
roScreen = Invalid
end if
else if (msg.isScreenClosed()) then
return
end if
end if
end while
End Sub
0 Kudos
NewManLiving
Level 7

Re: roImageCanvas and roScreen

Why are you using that resolution. It adds nothing and takes up a lot more memory. Why can't you scale your images to the correct size. The params you are using are not supported the last time I checked. But who knows what has changed with 7 ----Possibly imagecanvas is scaling down I don't know. But if you put a bitmap that size at 0,0 with the default roScreen resolution and your bitmap is larger it should just be clipped. You cannot fit that size bitmap without scaling it down. The nice thing about roScreen is that it will scale based upon the creation parameters and resolution of the display, but generally if you know you are dealing with a 1280 x720 and you want a full screen background then you create a 1280 x 720 bitmap. Usually anything larger may be used with a region to scroll certain sections of the bitmap in and out of the display area
My Channels: 2D API Framework Presentation: https://owner.roku.com/add/2M9LCVC
Updated: 11-11-2015 - Completed Keyboard interface
The Joel Channel ( Final Beta )
0 Kudos
bcoding
Level 7

Re: roImageCanvas and roScreen

Yup scaled the image to 1280 * 720 and worked perfectly. Thanks.
0 Kudos