react-native-normalize响应式尺寸适配工具
屏幕尺寸的适配问题,在 React Native 里一直挺让人头大。react-native-normalize这个小包,算是个比较省心的方案,功能简单明了,用起来也不复杂。
normalize 的核心功能就是:你传个数值进去,它会根据设备的宽高给你按比例“调整”一下。比如在 iPhone 8 上 normalize(100)
输出就是 100,但在 iPhone 5s 上就是 86,自动帮你做适配。
你可以拿它来设置 width
、height
、fontSize
、borderRadius
这些属性,响应也快,代码也简单。不用每个屏幕都自己算一遍尺寸,省事不少。
它的 API 干净:默认按宽度算,要是你想按高度,可以这么写:normalize(50, 'height')
,用起来就是那么顺手。
想做响应式布局又不想引入什么复杂工具?react-native-normalize真的可以试试,尤其适合刚上手 RN 项目的时候打基础用。
如果你想深入了解屏幕适配的更多方法,可以看看这篇屏幕尺寸适配示例,也蛮有参考价值的。
334.88KB
文件大小:
评论区