step02_touch_handler

Step 2: Adding Touch Handler

Goal

Learn how to handle tap events.

---

Video: Step2

---

Before getting started

If you are building your app from scratch: Step 1 needs to be completed.

OR

If you just want to practice this step: you can start editing Step 1 components in this repo and run

npm run step1

---

1. In your favorite IDE

Open app/index.js file in your favorite IDE

2. Import TouchableOpacity component

import React, {
  Text,
  View,
  TouchableOpacity // <- This line is added
} from 'react-native';

3. Add handlePress method before render method in your component

  handlePress(){
    alert('Pressed!');
  },

3. Wrap Text component with TouchableOpacity in your component render function

  <TouchableOpacity onPress={this.handlePress}>
    <Text style={styles.text}>Let's start coding!!</Text>
  </TouchableOpacity>

---

Expected Result:

Tap on 'Let's start coding!!' text:

---

Next Step:

Let's add Navigator component

Step 3: Adding Navigator