Question

嘿，有没有办法设置按钮图标的大小？

<Button
  contentStyle={[accordionStyles.header__button, ]}
  icon={show === Props.value ? "chevron-up" : "chevron-down"}
  direction='rtl'
  color='black'
>
...
</Button>

但是，如果我尝试将按钮的大小设置为size={40}，则该按钮将无法正常工作。

Answer 1

您是否尝试过使用 Button labelStyle 道具？

<Button
    labelStyle={{ fontSize: 24 }}
    icon="repeat"
    mode="text"
  >
    my button
  </Button>

Answer 2

您可以通过将图标添加为儿童来实现，尽管该功能尚未开发，但它们已经提高了PR：

 import { Button, Text } from 'react-native-paper';
import Icon from 'react-native-vector-icons/FontAwesome';

<Button
  style={buttonStyle}
  mode="contained"
  contentStyle={buttonContentStyle}
>
  <Icon name="warning" size={24} color="#fff" />
  <View style={{ width: 16, height: 1 }} />
  <Text style={buttonTextStyle}>Hello World</Text>
</Button>

希望有帮助。毫无疑问

Answer 3

对于仍然被这个问题困扰的人，我发现这个解决方案有效：

<Button
          mode="outlined"
          labelStyle={{fontSize: 25}}
          onPress={() => doSomething()}
          icon="share"
          >
          <Text style={{fontSize: 16}}>My Text</Text>
        </Button>

将文本包裹在组件中并给它一个字体大小，而 labelStyle 只会增加图标的大小

Answer 4

我尝试了这个并实现了我想要的，希望这会在未来帮助某人......

  import { Button } from "react-native-paper";
import PlusIcon from "react-native-vector-icons/AntDesign";
import { View, Text, StyleSheet } from "react-native";
 <View style={styles.button}>
    <Button uppercase={false} color="#FFFFFF" style={styles.button}>
      Add New Booking
    </Button>
    <View style={{ paddingLeft: "auto", right: -75 }}>
      <PlusIcon size={32} color={"#fff"} name={"pluscircle"} />
    </View>
  </View>


 const styles = StyleSheet.create({
 
button: {
width: 208,
height: 52,
 alignItems: "center",  
justifyContent: "center",
borderRadius: 30,
backgroundColor: "#94C100",
position: "absolute",
bottom: 0,
right: 10,
  },
});

反应本机纸按钮图标大小

4 个答案: