React原生視圖在iPhone Plus上顯示扭曲像素

反應原生視圖顯示iPhone Plus版本中的扭曲像素，而同一視圖在iPhone 5,6或7版本上顯示得非常優雅。某些時候的視圖看起來更加糟糕，那麼下面的圖片就是iPhone的加號版本。代碼如下，React原生視圖在iPhone Plus上顯示扭曲像素

<View style={[styles.headerRow, { paddingHorizontal: 5 }]} > 
    <View style={{ flex: 3, borderColor: theme.color.gray.light, borderRightWidth: .5, alignSelf: 'center' }}> 
     <Text style={[skin.text.smaller, skin.text.bold, { textAlign: 'center', padding: 8 }]}>{'TITLE'}</Text> 
    </View> 
    <View style={{ flex: 2, alignItems: 'center', borderColor: theme.color.gray.light, borderRightWidth: .5, alignSelf: 'center' }}> 
     <Text style={[skin.text.smaller, skin.text.bold, { textAlign: 'center', padding: 8 }]}>{'BUCKIT'}</Text> 
    </View> 
    <View style={{ flex: 2.8, alignItems: 'center' }}> 
     <Text style={[skin.text.smaller, skin.text.bold, { textAlign: 'center', padding: 8 }]}>{'YOUR AVERAGE'}</Text> 
    </View> 
</View>

使用屏幕寬度DIVID柱代替撓性也不會有幫助。

來源

2017-12-02 Eltaf

SOLUTION：

我發現一種解決方案，iOS不喜歡設定邊框寬度小於1，從而既可以使用1或更大值或反應天然提供稱爲hairlineWidth StylesSheet變量，其具有設定爲0.3的默認值。您可以通過在組件的構造函數中設置StyleSheet.hairlineWidth = 0.5來更改該值。

<View style={{borderWidth: StyleSheet.hairlineWidth}}> ... </View>

來源

2017-12-02 19:25:19 Eltaf

React原生視圖在iPhone Plus上顯示扭曲像素

回答

相關問題