我有一个最初为iPhone 6 symulator编写的应用程序,其中有一个组件,其中包含以下示例值:
const styles = StyleSheet.create({
headerNav: {
width: 40,
height: 40
},
headerLogoImage: {
width: 140,
height: 140
},
footerNavText: {
padding: 15,
fontSize: 25
}
});
不幸的是,当我在iPad symulator上启动应用程序时,大小比例完全崩溃了。我知道像PixelRation这样的东西,但文档非常有限且不清楚。
任何想法/建议如何翻译这些宽度/高度/填充&使用此PixelRatio类将fontSize设置为正确的值?
答案 0 :(得分:0)
您可以执行以下操作:
footerNavText: {
padding: PixelRatio.get()*3,
fontSize: PixelRatio.get()*4
}
检查get()方法为您要使用的每个设备返回的内容并相应地设置样式。 有关详细信息,请访问https://facebook.github.io/react-native/docs/pixelratio.html
答案 1 :(得分:0)
fontSize需要除以PixelRatio.getFontScale()
。这将解释iOS和Android中不同的屏幕密度。
footerNavText: {
fontSize: 25 / PixelRatio.getFontScale()
}
https://facebook.github.io/react-native/docs/pixelratio.html