0

基本上由两部分构成:grid(flex view)和listview。

使用的元素来自原生基础。

我也用过<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>

附上重叠问题: 在此处输入图像描述

4

1 回答 1

0

我通过添加一个包裹它们的滚动视图来修复它

于 2019-10-05T04:48:33.213 回答