如何在React Native中更改按钮的fontSize？

Question

如何更改以下按钮的字体大小？将style属性与fontSize一起使用不起作用。什么给？

   <Button
       style={{fontSize: 32}}
       uppercase={false}
       mode="contained">
     Some text
   </Button>

Answer 1

React Native Button的功能非常有限，请参见； https://facebook.github.io/react-native/docs/button

它没有样式道具，并且您没有设置fontSize。

如果要对外观进行更多控制，则应使用诸如TouchableOpacity之类的TouchableXXXX'组件之一，它们真的很容易使用:-)我为你做了一个按钮。希望对您有用

<TouchableOpacity style={{height:50,backgroundColor:"skyblue",alignItems:'center',justifyContent:'center'}}>
     <Text style={{fontSize:32,}}>Some Text</Text>
</TouchableOpacity>

Answer 2

您可以使用titleStyle设置fontSize。

import {Input, Button} from 'react-native-elements';

<Button
   titleStyle={{
       color: "white",
       fontSize: 16,
   }}
   buttonStyle={{
       backgroundColor: "white",
       borderRadius: 60,
       flex: 1,  
   }}

   title="Click here"
/>

Answer 3

我为每个按钮使用TouchableXXX内的Text组件，它更加灵活并且可以正常工作，您也可以尝试使自己的按钮组件和传递要控制的道具（字体大小，颜色...）：

 <TouchableHighlight onPress={handelPress} style={styles.buttonStyle}>
     <Text style={styles.buttonTextStyle}>Click here</Text>
 </TouchableHighlight>

Answer 4

将值放在双引号中，如下所示：

<Button
       style={{fontSize: "32px"}}
       uppercase={false}
       mode="contained">
     Some text
 </Button>