相关疑难解决方法(0)

我正在尝试使用flexbox将我的图标对齐到按钮视图的左侧,将文本对齐到中心.目前它们都与中心对齐,但我不确定如何在按钮的最左边缘设置我的图标,同时保持文本在视图中居中

现在我的按钮看起来像这样:

我使用https://github.com/APSL/react-native-button作为按钮,使用 https://github.com/oblador/react-native-vector-icons作为图标

以下是我的一些代码:

    <Button style={signupStyles.facebookButton}>
      <View style={signupStyles.nestedButtonView}>
        <Icon
          name="facebook"
          size={30}
          color={'white'}

        />
        <Text style={signupStyles.buttonText}>Continue with Facebook</Text>
      </View>
    </Button>

    var signupStyles = StyleSheet.create({
    buttonText: {
      color: 'white',
      fontWeight: 'bold',
      textAlign: 'center',
    },

    facebookButton: {
      backgroundColor: styleConstants.facebookColor,
      borderColor: styleConstants.facebookColor,
      borderWidth: 2,
      borderRadius: 22,
    },

    nestedButtonView: {
     flexDirection: 'row',
     alignItems: 'center',
    },

  });