Image的border(x)Radius不生效(在iOS下出現(xiàn))
borderTopRightRadius
borderTopLeftRadius
borderBottomRightRadius
borderTopLeftRadius
某些時候我們需要設(shè)置圖片在某個方向上的圓角谭期,然而碎罚,我發(fā)現(xiàn)在iOS下悯姊,這四個style的屬性是不生效的稚疹,但是對于View是生效的镇饮。解決辦法是給Image加一個View莫杈,給View設(shè)置overflow: 'hidden'
亭珍。
再等等4志!可能你的還是沒有生效娱两,比如下面這位童鞋的:
2017-06-09_121304.jpg
這個時候莺匠,試著把
border(x)Radius
設(shè)置的大一點,我不知道為什么在某個數(shù)值范圍下十兢,你是看不到圓角效果的趣竣,但是確實已經(jīng)生效了摇庙,先將數(shù)值設(shè)置的大一點,確定生效遥缕,再慢慢改到你需要的值就好了卫袒。
作為背景圖的Image的borderRadius屬性不生效(在Andorid和iOS下出現(xiàn))
最開始我也沒有發(fā)現(xiàn)這個問題,給Image設(shè)置borderRadius效果就是那么明顯啊单匣,然而夕凝,當我把Image作為背景圖使用比如:
<Image source={require('test.png')}>
<Text>hello</Text>
</Image>
就發(fā)現(xiàn)這個屬性怎么也不起作用了,沒什么解決辦法户秤,如果這張圖片的圓角效果很重要码秉,那就不要作為背景圖了,只能將要放在圖片上的內(nèi)容設(shè)置為絕對定位了鸡号,position: 'absolute'
泡徙。
View的shadow屬性(在Andorid下不生效)
這個其實人家官網(wǎng)也說啦,我們這個屬性確實只針對iOS平臺膜蠢,Android平臺也有一個屬性可以用堪藐,但是你無法設(shè)置什么陰影顏色,陰影偏移挑围,只能設(shè)置一個陰影數(shù)值礁竞,針對一般的情況也勉強夠用的,所以我們的樣式可以寫成:
{
elevation: 3,
shadowColor: Colors.lightgrey,
shadowOffset: {width: 1, height: 1},
shadowOpacity: 0.5,
shadowRadius: 3,
}
若想在Android下使用比較好的陰影效果就用插件吧:https://www.npmjs.com/package/react-native-shadow 這個插件也說啦:我們建議您在iOS平臺下使用原生的陰影杉辙。