In this article we will cover on how to implement change a button color by using onpress on react native. you can understand a concept of change color of button on click react native. you'll learn react native button press effect. if you have question about how to change color of button on press in react native then I will give simple example with solution. follow bellow step for change background color on click in react native.

In this example,We will change button style on press in react native.you can easy and simply prees then color change in react native.you can store button value prees then condition add to color component.The complete example below shows you how to do that.

In the first step run the following command to create a project.

expo init ExampleApp

In this step, You will open the App.js file and put the code.

import React,{useState} from 'react';
import { StyleSheet, Text, View, Button} from 'react-native';

export default function App() {

    const [isActive, setIsActive] = useState(false);

    const onPressLearnMore = () =>{
      setIsActive(true);
    }

    return (
      <View style={styles.container}>

        <Button
        onPress={onPressLearnMore}
        color={ isActive ? "#841584" : "red"}
        title="Press me"
        />

      </View>
    );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },

});

In the last step run your project using the below command.

expo start

You can QR code scan in Expo Go Application on mobile.

Output:

It will help you...