首页 > 解决方案 > React Native 按钮未对齐中心

问题描述

我在我的原生基本表单中包含了一个按钮,但它没有居中对齐。

<Form>
   ...

   <Item inlineLabel>
      <View style={styles.alignCenter}>
         <Button primary style={styles.btnUpd}><Text> Update </Text></Button>
      </View>
   </Item>
</Form>

我的风格:

const styles = StyleSheet.create({
  alignCenter: {
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center'
  },
  btnUpd: {
    height: 35,
    marginTop: 4,
    marginBottom: 4,
  }
});

我以为我只需要使用 justifyContent 和 alignItems center 来集中对象。我错过了什么?

谢谢

标签: react-nativenative-base

解决方案


使用标签将其设置为屏幕的中心,对于屏幕的左侧和<Body>右侧,您可以使用如下所示:<Left><Right>

<View>
   <Body>
      <Button>
         <Text> Update </Text>
      </Button>
   </Body>
</View>

推荐阅读