React Native 本机基图标位于按钮的开头，文本居中

w8f9ii69 于 2023-03-31 发布在 React

关注(0)|答案(1)|浏览(97)

大家好，我正在尝试创建按钮，我会在我的截图下面显示.我的第一个截图是我现在有什么，我的第二个是我想要的.尝试了几个小时，把我的图标在开始.发现我可以使用弹性启动我的按钮，但然后我不能居中我的文本任何提示？（我使用本机库）

<Button variant="outline" size="lg" justifyContent="center">
    <View style={{ flexDirection: "row", alignItems: "center" }}>
            <Icon as={MailIcon} />
            <Text size="sm">Sign Up With Email</Text>
    </View>
</Button>

我需要它是响应，因为我们有不同分辨率的多个电话设备。

react-native

来源：https://stackoverflow.com/questions/75832099/native-base-icon-at-the-start-of-the-button-and-text-centered

1条答案

按热度按时间

m4pnthwp1#

我已经使用TouchableOpacity，但你可以使用它的按钮。
在这里我分享我的代码和风格下面，这将解决您的问题：

<View style={styles.btn_view}>
            <TouchableOpacity[![enter image description here][1]][1]
              style={styles.button}
                <Icon size={30} name='time'/>
              <Text style={styles.text_inside_btn}>Set Seconds</Text>
            </TouchableOpacity>
          </View>

btn_view: {
    width: '60%',
    alignSelf: 'center',
    marginHorizontal: 15,
    height: 50,
    flexDirection: 'row',
  },
  button: {
    alignItems: 'center',
    flexDirection: 'row',
    padding: 10,
    justifyContent: 'space-around',
  },
  text_inside_btn: {
    width: '90%',
    textAlign: 'center',
  },

赞(0）回复(0）举报 2023-03-31

我来回答

React Native 本机基图标位于按钮的开头，文本居中

1条答案

相关问题

热门标签

最新问答