顶部的本机基本图标按钮

Question

Native base确实是一个很好的样式化react / react-native样式库。我仅对图标按钮有一个问题，我希望顶部的图标和底部的文本不能对齐。我尝试alignSelf:'center'输入图标和文字，但是不起作用。有人可以帮忙吗？非常感谢。

<Button transparent style={styles.capturebtn}>
    <Icon name="camera" type="MaterialCommunityIcons" style={styles.capturebtnicon}/>
    <Text style={styles.capturebtntxt} uppercase={false}>Open Camera</Text>
</Button>   

  capturebtntxt:{
    alignSelf:'center',
    fontSize:15,
    fontFamily:'Gotham-Medium',
    color:'#AAAAAA'
  },
  capturebtnicon:{
    alignSelf:'center',
    color:'#E3E3E3',
    fontSize:35
  },
  capturebtn:{
    elevation:0,
    borderColor:'#e5e5e5',
    borderWidth:1,
    borderRadius:7,
    justifyContent:'center',
    alignItems:'center',
    width:((Dimensions.get('window').width - 150 - 60) / 2) - 10
  },

Answer 1

我发现flexDirection: 'column'的按钮已解决。 =）

Answer 2

或者您可以使用vertical

vertical-true-boolean-使用此道具垂直对齐页脚元素 如图标和文字

示例