ROKU 4 :: Position problem with Roimagecanvas

Archived
1

Hi, I have a problem. I have used Roimagecanvas for the custom keyboard with a login screen. Here I’m using Roku 3 and Roku 4.
When the app loaded on the Roku 3, the positions are correct. But Roku 4 is not the same. The positions are changed.

   deviceInfo = CreateObject("roDeviceInfo")
    uiResolution = deviceInfo.GetUIResolution() 
    displaySize = deviceInfo.GetDisplaySize()
    Width = displaySize.w
    Height =  displaySize.h

From Roku 4 settings the Display type is 1080p HD TV
And I printed displaySize, then

<Component: roAssociativeArray> =
{
    h: 1080
    w: 1920
}

For keypad layer position , I have following

keypadPos = { x: int(.1*width), y: int(.287*Height), w: int(.23*width), h: int(.52*Height)}

And this is the layer.

this.canvas.SetLayer(3, { url: "pkg:/locale/default/images/KB/login/$abc3.png", TargetRect: keypadPos }

Now the problem is

In Roku 3, the positions are correct.
But, In Roku 4 , All are changed. So Roimagecanvas will effect with resolutions? How can I render the layers with respect to current Display Type (1080p or 720P) ?

2

This has to do with some funny behavior of roImageCanvas. It tops out at 1280x720, even if the UI is running FHD. I’ve seen this problem in a custom video player that was using GetCanvasRect() to set the video destination on the screen. In Roku 4 it only covered half the screen. Best thing to do is to use the width and height from GetCanvasRect() to calculate positions rather than GetDisplaySize().

For reference, here’s output from a dummy channel I have to dump all this stuff:

------ Running dev 'Display Modes Dump' main ------

----- roDeviceInfo -----
GetDisplayType = HDTV
GetDisplayMode = 1080p
GetDisplayAspectRatio = 16x9
GetDisplaySize = 
  {
    GetDisplaySize: w = 1920
    GetDisplaySize: h = 1080
  }
GetDisplayProperties = 
  {
    GetDisplayProperties: width = 41
    GetDisplayProperties: height = 23
    GetDisplayProperties: Hdr10 = false
    GetDisplayProperties: DolbyVision = false
    GetDisplayProperties: internal = false
  }
GetSupportedGraphicsResolutions = 
  [
  {
    GetSupportedGraphicsResolutions: width = 1280
    GetSupportedGraphicsResolutions: name = HD
    GetSupportedGraphicsResolutions: preferred = false
    GetSupportedGraphicsResolutions: height = 720
    GetSupportedGraphicsResolutions: ui = false
  }
  {
    GetSupportedGraphicsResolutions: width = 1920
    GetSupportedGraphicsResolutions: name = FHD
    GetSupportedGraphicsResolutions: preferred = true
    GetSupportedGraphicsResolutions: height = 1080
    GetSupportedGraphicsResolutions: ui = true
  }
  ]
GetVideoMode = 1080p
GetCanvasRect = 
  {
    GetCanvasRect: w = 1280
    GetCanvasRect: x = 0
    GetCanvasRect: y = 0
    GetCanvasRect: h = 720
  }
GetUIResolution = 
  {
    GetUIResolution: width = 1920
    GetUIResolution: name = FHD
    GetUIResolution: height = 1080
  }
------------------------
3

Hi, Thank you very much for your reply with your solution. I appreciate that. So we should hard-code the width and height like 1920:1080 or 1280:720 . right?
Actually, we are taking the position with respect to the current resolution via displaySize = deviceInfo.GetDisplaySize(). But this is not working here. should I hard-code height and width?

4

“RENJITHVR4” wrote:
Hi, Thank you very much for your reply with your solution. I appreciate that. So we should hard-code the width and height like 1920:1080 or 1280:720 . right?
Actually, we are taking the position with respect to the current resolution via displaySize = deviceInfo.GetDisplaySize(). But this is not working here. should I hard-code height and width?
No - please read attentively what Veeta said:
“Veeta” wrote:
Best thing to do is to use the width and height from GetCanvasRect() to calculate positions rather than GetDisplaySize().