В основном они состоят из двух частей: сетки (гибкий вид) и списка.
Используются элементы из нативной базы.
Я также использовал <View>
, но проблема в том,все тот же.
View style={{flex: 1, flexDirection: 'row'}}>
Фрагмент кода:
<Grid>
<Col style={{ backgroundColor: '#635DB7', height: 80 }}>
<Text style={styles.head}>致電</Text>
</Col>
<Col style={{ backgroundColor: '#00CE9F', height: 80 }}>
<Text style={styles.head}>地圖</Text>
</Col>
<Col style={{ backgroundColor: '#635DB7', height: 80 }}>
<Text style={styles.head}>分享</Text>
</Col>
</Grid>
<List>
{ list.map((item, i) => (
<ListItem icon key={i} noBorder>
<Left style={styles.left}>
{ item.icon &&
<Icon type={item.type} name={item.icon} style={styles.icon} />
}
</Left>
<Body>
<Text style={{ color: item.color}}>{item.title ? item.title : "N/A"}</Text>
</Body>
</ListItem>
))
}
</List>
прикреплена проблема перекрытия: