【注】該方法僅對RN0.50版本以后。
曾經(jīng)有一個(gè)問題一直沒有解決,當(dāng) <Text>設(shè)置好字號(hào)以后肝陪,一些客戶手機(jī)系統(tǒng)的字體更改大小,這時(shí)候刑顺,RN APP里面字體也隨之變化
Simulator Screen Shot - iPhone 6 - 2018-02-27 at 15.50.45.png
系統(tǒng)最小號(hào)字體
Simulator Screen Shot - iPhone 6 - 2018-02-27 at 15.51.12.png
系統(tǒng)最大號(hào)字體
這種情況就讓程序猿苦惱了
下面介紹解決方法
import {
Platform,
StyleSheet,
Text,
View,
SafeAreaView,
DeviceInfo,
Button,
} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
//justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
flexDirection: 'column',
justifyContent: 'space-between',
},
welcome: {
fontSize: 20*(1.0/DeviceInfo.Dimensions.screen.fontScale),
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
fontSize:20,
},
bottom: {
//justifyContent: 'flex-end',
alignItems: 'flex-end'
}
});
關(guān)鍵就在這
fontSize: 20*(1.0/DeviceInfo.Dimensions.screen.fontScale)
直接看效果吧
Simulator Screen Shot - iPhone 6 - 2018-02-27 at 15.56.19.png
字號(hào)已經(jīng)不在跟隨系統(tǒng)變化了