React Native change Button Text color

Question

I am a beginner in React Native and I just want to write my first line of code with it. I made a button and started wondering how can I change the colour and other properties of the text in the button. <Button title="Click Me"></Button>

I was also wondering if there are some good packages that are recommended for beginners. Thanks for the help.

Answer 1

You can use a Button from react-native like this and can also pass the color prop.

Button
  onPress={onPressLearnMore}
  title="Click Me"
  color="#841584"
/>

For complex and custom buttons you can create it by your own styles using Touchables which are given by react-native you don't have to use any third-party libraries for that.

Example:

    <TouchableOpacity style={{ here you can specify custom styles for button container }} onPress={gotoDashboard}>
        <Text style={{here you can specify text styles}}>Button Text Here</Text>
  // You can add there as many components according to your designs.
      </TouchableOpacity>

Answer 2

You should use titleStyle like this:

<Button
  titleStyle={{
     color: '#00BAD4',
     fontSize: 30,
     fontStyle: 'italic',
  }}
  title="Title"
  buttonStyle={{
     backgroundColor: '#FFF',
     borderRadius: 4,
     margin: 5,
  }}
/>

Btw here's more useful information about buttons: https://reactnativeelements.com/docs/components/button