我正在創建一個反應原生應用程式我有一個專案 - 一個加號按鈕(如圖所示)

我希望這個到我的頁面底部到頁腳 - 
但問題是,當我將此按鈕放在底部時,position: 'absolute', bottom: 0它只會進入英雄部分的底部而不是頁腳
代碼 -
<View style={styles.main}>
<View style={styles.hero}>
<View style={styles.flex}>
<View style={styles.container}>
</View>
</View>
<View style={styles.flex2}>
</TouchableOpacity>
</View>
<View style={styles.container12}>
</View>
</View>
</View>
<TouchableOpacity>
<View style={styles.container33}>
<EntypoIcon name="plus" style={styles.icon28}></EntypoIcon>
</View>
</TouchableOpacity>
主要風格 -
main: {
width: '100%',
height: '100%',
},
hero: {
alignSelf: 'stretch',
height: 250,
backgroundColor: '#fff',
borderBottomLeftRadius: 50,
borderBottomRightRadius: 50,
},
container33: {
width: 50,
height: 50,
backgroundColor: '#1DA6FA',
// flex: 1,
borderRadius: 50,
position: 'absolute',
bottom: 0,
right: 10,
alignItems: 'center',
justifyContent: 'center'
},
uj5u.com熱心網友回復:
問題在于您將absolutecss 位置應用于View內部TouchableOpacity而不是TouchableOpacity自身。
要實作您想要做的,您應該撰寫如下內容:
<View style={styles.absoluteOpacity}>
<TouchableOpacity>
<View style={styles.container33}>
<EntypoIcon name="plus" style={styles.icon28}></EntypoIcon>
</View>
</TouchableOpacity>
</View>
然后是CSS:
container33: {
width: 50,
height: 50,
backgroundColor: '#1DA6FA',
// flex: 1,
borderRadius: 50,
right: 10,
alignItems: 'center',
justifyContent: 'center'
},
absoluteOpacity: {
position: 'absolute',
bottom: 0,
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/418816.html
標籤:
上一篇:錯誤:`FileSystem.moveAsync`需要一個`to`路徑。在本機反應(世博會)
下一篇:在C中將字串轉換為字串陣列
