diff --git a/packages/example/package.json b/packages/example/package.json index 9b0cf374..9f742edb 100644 --- a/packages/example/package.json +++ b/packages/example/package.json @@ -29,6 +29,7 @@ "react": "18.2.0", "react-native": "npm:react-native-tvos@0.73.2-0", "react-native-keyevent": "^0.3.2", + "react-native-pixel-perfect": "^1.0.2", "react-native-safe-area-context": "^4.8.2", "react-native-screens": "^3.29.0", "react-native-svg": "^14.1.0", diff --git a/packages/example/src/design-system/helpers/scaledPixels.ts b/packages/example/src/design-system/helpers/scaledPixels.ts index 55f1545d..d84d1164 100644 --- a/packages/example/src/design-system/helpers/scaledPixels.ts +++ b/packages/example/src/design-system/helpers/scaledPixels.ts @@ -1,13 +1,8 @@ -import { Dimensions } from 'react-native'; +import { create } from 'react-native-pixel-perfect'; -export const screen = Dimensions.get('window'); -const scale = (screen.width || 1920) / 1920; +const designResolution = { + width: 1920, + height: 1080, +}; -/** - * Unfortunately, AndroidTV handles pixels in a strange manner - * PixelRatio does not seem to solve the problem properly on web. - * So we just scale the pixels manually. - * - * https://github.com/react-native-tvos/react-native-tvos/issues/57 - */ -export const scaledPixels = (pixels: number) => pixels * scale; +export const scaledPixels = create(designResolution);