在React Native開發(fā)中宠叼，尺寸的默認(rèn)單位為dp(android設(shè)備下160dpi劫拢，dp與px為1:1)搓幌，加上跨平臺及各種設(shè)備的屏幕尺寸不同、分辨率不同，導(dǎo)致在不同設(shè)備下顯示不一致的問題侨歉。所以我們需要在樣式中做一些適配屋摇。
以下是一個(gè)簡單封裝的React Native 適配工具類，已添加d.ts文件幽邓，支持TypeScript引入炮温。
適配前后對比
GETTING STARTED
1.安裝
$ npm i react-native-scale-size --save
或者
$ yarn add react-native-scale-size
2.導(dǎo)入
import{??
? ? ?ScaleSize,??
? ? ?ScaleText
}from'react-native-scale-size';
EXAMPLE
conststyles = StyleSheet.create({
? content: {? ??
? ? ? ? ?width: ScaleSize(100),?
? ? ? ? ?fontSize: ScaleText(18)?
? ? }
})
注意
ScaleText在Android設(shè)備下，會根據(jù)系統(tǒng)設(shè)置字體大小作調(diào)整牵舵，如不需要柒啤，可全面使用ScaleSize
如對您有幫助，請給個(gè)star棋枕，謝謝
