Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android TV / tvOS scaling display inconsistency #19690

Closed
ryanvanderpol opened this issue Jun 13, 2018 · 5 comments
Closed

Android TV / tvOS scaling display inconsistency #19690

ryanvanderpol opened this issue Jun 13, 2018 · 5 comments
Labels
Platform: Android Android applications. Platform: tvOS tvOS applications. Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@ryanvanderpol
Copy link

ryanvanderpol commented Jun 13, 2018

Environment

Amazon Fire TV Stick (Fire OS 5.2.6.3 / Android 5.1.1 Lollipop - 1080p @ 60Hz)
Apple TV (4th gen - tvOS 11.4 - 1080p @ 60Hz)

Environment:
OS: macOS Sierra 10.12.6
Node: 8.1.2
Yarn: 1.7.0
npm: 5.6.0
Watchman: Not Found
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.4 => 0.55.4

Description

I've been following #16500 and finally had a chance to try it out. I built a pretty barebones app following these instructions and deployed to both an Apple TV and a Fire TV Stick. Below you can see photos of how my app looks on both devices.

Steps to Reproduce

Follow the instructions in #16500 and the React Native docs. Build and deploy to Apple TV and Fire TV Stick.

Expected Behavior

Both devices, when running at the same resolution (1080p @ 60Hz) should display the same.

Actual Behavior

On the Apple TV, everything looks perfect, but on the Fire TV Stick it looks like everything is super zoomed in and squished.

Apple TV:
2018-06-13 09 06 36

Android TV / Fire TV:
2018-06-13 09 08 01

Side Note: I followed the instructions from the docs and found one thing missing that was required for Amazon's Appstore to allow me to select a Fire TV as a target device. The following line needs to be added to your AndroidManifest.xml:

    <uses-feature android:name="android.hardware.touchscreen" android:required="false" />

You can find the relevant instructions in Amazon's documentation.

@react-native-bot

This comment has been minimized.

@ryanvanderpol
Copy link
Author

I've discovered, per the Fire TV docs here and here that the "Display Resolution" is 960x540. I have confirmed this on my device by looking at Dimensions.get('window').

I'm not exactly sure how the React Native core project should handle this.

My question, however, is as an app developer, how do I go about handling this inconsistency?

@ruen89
Copy link

ruen89 commented Aug 30, 2018

I was having this "issue". But I found out that it's because Apple tvOS as a pixel density of 2 and Amazon fire has a pixel density of 1.

Meaning your font sizes will be double the size on Amazon fire

@stale
Copy link

stale bot commented Nov 28, 2018

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Nov 28, 2018
@stale
Copy link

stale bot commented Dec 5, 2018

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

@stale stale bot closed this as completed Dec 5, 2018
@facebook facebook locked as resolved and limited conversation to collaborators Dec 6, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Platform: Android Android applications. Platform: tvOS tvOS applications. Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

4 participants