button color react native code example

Example 1: react native button

<Button
title="Press button"
onPress={() => {function}} //change "function" with your function for the button pressing
/>

Example 2: change button color react native

The react Button component renders the native button on each platform it uses. Because of this, it does not respond to the style prop. It has its own set of props.

The correct way to use it would have been

<Button color="#ff5c5c" title="I'm a button!" />

You can see the documentation at https://facebook.github.io/react-native/docs/button.html

Now, say you do want to make super customizable button, for that you'll have to use views and touchable opacity. Something along the lines of this.

<TouchableOpacity onPress={...}>
  {... button markup}
</TouchableOpacity>
You'll wrap that up in your own button component and use it.

Example 3: react native create button

import { Button } from 'react-native-elements';
import Icon from 'react-native-vector-icons/FontAwesome';

<View style={styles.buttonContainer}>
<Button title='update state' onPress={do something}/>
</View>

or

<Button
  title="Solid Button"
/>

<Button
  title="Outline button"
  type="outline"
/>

<Button
  title="Clear button"
  type="clear"
/>

<Button
  icon={
    <Icon
      name="arrow-right"
      size={15}
      color="white"
    />
  }
  title="Button with icon component"
/>

<Button
  icon={{
    name: "arrow-right",
    size: 15,
    color: "white"
  }}
  title="Button with icon object"
/>

<Button
  icon={
    <Icon
      name="arrow-right"
      size={15}
      color="white"
    />
  }
  iconRight
  title="Button with right icon"
/>

<Button
  title="Loading button"
  loading
/>
    
Source:
https://reactnativeelements.com/docs/button/