How to customize button of react native

Question

I am trying to make my application button in react-native like below

I am using inbuilt Button view of react native where I see that it does not allow to change the height also. I want to change the height as well rounded like expected image.

This is how my button is looking :

  <Button
    title="CONTINUE"
    color="#FE434C"
    onPress={() => navigate("EnableNotification")}
  />

Answer 1

So this is what I usually do:

<TouchableOpacity onPress={() => {/* do this */}}>
  <View style={{
      backgroundColor: 'red',
      alignItems: 'center', 
      justifyContent: 'center',
      borderRadius: 15
    }}
  >
    <Text style={{ color: 'white' }}>Button</Text>
  </View>
</TouchableOpacity>

I find using this method makes buttons much more customisable, but if you do some digging there could be a library which implements something similar (I never really found the need to search for it).

NOTE: Obviously you will have to adjust the height/width of the button to your flavor.

EDIT: My mistake... I had put the onPress prop in the view, woops.