如何在 React Native 中处理不同的屏幕尺寸?
我正在开发一个关于 react-native 的应用程序.我制作了一个在 iPhone 6 上运行良好但在 iPhone 5 或更低版本上运行良好的 UI.我应该如何解决这个问题?
I am developing an application on react-native. I have made a UI which works fine on iPhone 6 but not working fine on iPhone 5 or lower versions. How should I fix this ?
您是否使用固定宽度和高度设计了应用程序?您绝对应该使用 flexbox 的功能,并尽量避免设置固定大小.flex 属性可用于定义多少空间<View/>
应该使用与其他人相关的,并且该页面上的其他属性可用于以灵活的方式布置元素,从而在一系列不同的屏幕上提供所需的结果尺寸.
Have you designed the app using fixed widths and heights? You should definitely use the capabilities of flexbox and try to avoid settings fixed sizes as much as possible. The flex property can be used to define how much space a <View />
should use releative to others, and the other properties on that page can be used to lay out elements in a flexible way that should give the desired results on a range of different screen sizes.
有时,您可能还需要一个 <ScrollView/>
.
Sometimes, you may also need a <ScrollView />
.
当您确实需要固定尺寸时,您可以使用 Dimensions.get('window')
.
When you do need fixed sizes, you could use Dimensions.get('window')
.