我希望使 View 在不同尺寸(适用于 Android 4+)和 dpi(240+)以及 iPhone 4+ 和 iPad 上看起来相同。当我定义尺寸时,例如。 270x65,在 640 dpi 的屏幕上看起来比在 320 dpi 的屏幕上(2560x1600 实际屏幕尺寸)相同尺寸的尺寸大一倍。
这是一个好的解决方案吗?
containerButton: {
width: calcDimension(270),
height: calcDimension(65)
}
const calcDimension = size =>
size / (screenScale() > 2 ? (screenScale() / 2) : 1);
const screenScale = () =>
(Dimensions.get('window').scale);
或者还有更好的解决方案吗?谢谢。
最佳答案
您可以在 React Native 中使用尺寸来自动计算设备高度和宽度。
首次导入尺寸
import { Dimensions, Platform, StyleSheet } from 'react-native
获取设备高度和宽度
var deviceHeight = Dimensions.get('window').height;
var deviceWidth = Dimensions.get('window').width;
现在您可以在样式中使用此全局变量。例如:
const styles = StylSheet.create({
mainContainer: {
height: deviceHeight/2;
width: deviceWidth/2;
}
});
您还可以动态计算状态栏高度和宽度标准方式:
var STATUS_BAR_HEIGHT = Platform.OS === 'ios' ? 20 : 25;
var HEADER_HEIGHT = Platform.OS === 'ios' ? 44 + STATUS_BAR_HEIGHT : 44 + STATUS_BAR_HEIGHT;
关于javascript - React Native - 如何独立设置 View 尺寸屏幕尺寸?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42174234/