Position all the Screens in the Safe Zone

[giolaq]

Is your feature request related to a problem? Please describe.

Some TVs are subjected to Overscan, which can cause UI elements positioned near the edges of the screen to be partially or fully cut off.

Describe the solution you'd like Position all UI screens in a Safe area

Test the implementation using the Safe Zone feature of Fire TV (https://developer.amazon.com/docs/fire-tv/developer-tools.html#safezone).

[chris-trag]

@giolaq what's the ideal format you want (mockup, code updates) Overall comp updates then I edit the props for positioning etc? I'm assuming since we're not using a standard template there's not an overall option to bump in safesones to a screen element

[giolaq]

Mockup is a good start. You can attach them here for reference. Wrapping all the UI around a 5% padding the screen seems reasonable. Still have to be tested across at least 3 platforms, Android TV/Fire TV, tvOS, web. Closing this issue when we have the PR implementing this