Skip to content

All topics  /  General

React Native onpress Event Example

General ·

When “React Native onpress Event Example” moves through design, development and browser testing, this operations example can clarify hand-offs and time spent on revisions while leaving code quality, accessibility and released behaviour as the real measures of success.

For API changes, browser support and current usage patterns, compare the snippet with the official React website before adopting it in production.

Hi Guys,

In this blog, I will explain you how to use onPress function example in react native. You can easily use onPress function in react native. First i will define class with extends component and use _onPressButton()


function, after I will alert using onPress function in react native.

Here, I will give you full example for simply display alert using onPress function in react native as bellow.

Step 1 - Create project

In the first step Run the following command for create project.

expo init OnPress

Step 2 - App.js

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

import React, { Component } from 'react';
import { Button, StyleSheet, View } from 'react-native';
export default class ButtonBasics extends Component {
  _onPressButton() {
    alert('You tapped on the button!')
  }
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.buttonContainer}>
          <Button
            onPress={this._onPressButton}
            title="Press Me"
            color="#1e90ff"
          />
        </View>
        <View style={styles.buttonContainer}>
          <Button
            onPress={this._onPressButton}
            title="Press Me"
            color="#20b2aa"
          />
        </View>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
   flex: 1,
   justifyContent: 'center',
  },
  buttonContainer: {
    margin: 80
  }
});

Step 3 - Run project

In the last step run your project using bellow command.

npm start

Output

It will help you...

# React Native