From e8074135e787f3a1c9635d69b6c1fd09dd12e71e Mon Sep 17 00:00:00 2001
From: konchanSS <b1447864@planet.kanazawa-it.ac.jp>
Date: Mon, 5 Feb 2018 16:46:32 +0900
Subject: [PATCH 1/2] Handling Touches lesson 1

---
 App.js | 64 +++++++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 52 insertions(+), 12 deletions(-)

diff --git a/App.js b/App.js
index 224d7db..e3beb18 100644
--- a/App.js
+++ b/App.js
@@ -1,16 +1,56 @@
 import React, { Component } from 'react';
-import { AppRegistry, Text, View } from 'react-native';
+import { Alert, AppRegistry, Button, StyleSheet,View } from 'react-native';
 
-export default class App extends Component {
-  render() {
-    return (
-      <View>
-        <Text>Open up App.js to start working on your app!</Text>
-        <Text>Changes you make will automatically reload.</Text>
-        <Text>Shake your phone to open the developer menu.</Text>
-      </View>
-    );
-  }
+export default class ButtonBasics extends Component {
+    _onPressButton() {
+        Alert.alert('You tapped the button!')
+    }
+
+    render() {
+        return (
+            <View style={styles.container}>
+                <View style={styles.buttonContainer}>
+                    <Button
+                        onPress={this._onPressButton}
+                        title="Press Me"
+                    />
+                </View>
+                <View style={styles.buttonContainer}>
+                    <Button
+                        onPress={this._onPressButton}
+                        title="Press Me"
+                        color="#841584"
+                    />
+                </View>
+                <View style={styles.alternativeLayoutButtonContainer}>
+                    <Button
+                        onPress={this._onPressButton}
+                        title="This looks grea!"
+                    />
+                    <Button
+                        onPress={this._onPressButton}
+                        title="OK!"
+                        color="#841584"
+                    />
+                </View>
+            </View>
+        );
+    }
 }
 
-AppRegistry.registerComponent('react-native-tutorial', () => App);
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        justifyContent: 'center',
+    },
+    buttonContainer : {
+        margin: 20
+    },
+    alternativeLayoutButtonContainer: {
+        margin: 20,
+        flexDirection: 'row',
+        justifyContent: 'space-between'
+    }
+})
+
+AppRegistry.registerComponent('react-native-tutorial', () => ButtonBasics);

From c5e2e83194eec6f54ad0dc22b63c677aeb6cf984 Mon Sep 17 00:00:00 2001
From: konchanSS <b1447864@planet.kanazawa-it.ac.jp>
Date: Fri, 9 Feb 2018 15:36:56 +0900
Subject: [PATCH 2/2] Handling Touches lesson 2

---
 App.js | 87 +++++++++++++++++++++++++++++++++++-----------------------
 1 file changed, 52 insertions(+), 35 deletions(-)

diff --git a/App.js b/App.js
index e3beb18..871a289 100644
--- a/App.js
+++ b/App.js
@@ -1,56 +1,73 @@
 import React, { Component } from 'react';
-import { Alert, AppRegistry, Button, StyleSheet,View } from 'react-native';
+import { Alert, AppRegistry, Platform, Button, Text, StyleSheet,View, TouchableHighlight, TouchableOpacity, TouchableNativeFeedback, TouchableWithoutFeedback} from 'react-native';
 
-export default class ButtonBasics extends Component {
+export default class Touchables extends Component {
     _onPressButton() {
         Alert.alert('You tapped the button!')
     }
 
+    _onLongPressButton() {
+        Alert.alert('Long Touch')
+    }
+
     render() {
         return (
             <View style={styles.container}>
-                <View style={styles.buttonContainer}>
-                    <Button
-                        onPress={this._onPressButton}
-                        title="Press Me"
-                    />
-                </View>
-                <View style={styles.buttonContainer}>
-                    <Button
-                        onPress={this._onPressButton}
-                        title="Press Me"
-                        color="#841584"
-                    />
-                </View>
-                <View style={styles.alternativeLayoutButtonContainer}>
-                    <Button
-                        onPress={this._onPressButton}
-                        title="This looks grea!"
-                    />
-                    <Button
-                        onPress={this._onPressButton}
-                        title="OK!"
-                        color="#841584"
-                    />
-                </View>
+                <TouchableHighlight onPress={this._onPressButton} underlayColor="white">
+                    <View style={styles.button}>
+                        <Text style={styles.buttonText}>TouchbleHeighlight</Text>
+                    </View>
+                </TouchableHighlight>
+                <TouchableOpacity onPress={this._onPressButton}>
+                    <View style={styles.button}>
+                        <Text style={styles.buttonText}>TouchableOpacity</Text>
+                    </View>
+                </TouchableOpacity>
+                <TouchableNativeFeedback
+                    onPress={this._onPressButton}
+                    background={Platform.OS === 'android' ?
+                        TouchableNativeFeedback.SelectableBackground() : ''
+                    }
+                >
+                    <View style={styles.button}>
+                        <Text style={styles.buttonText}>TouchableNativeFeedback</Text>
+                    </View>
+                </TouchableNativeFeedback>
+                <TouchableWithoutFeedback onPress={this._onPressButton}>
+                    <View style={styles.button}>
+                        <Text style={styles.buttonText}>TouchableWithoutFeedback</Text>
+                    </View>
+                </TouchableWithoutFeedback>
+                <TouchableHighlight
+                    onPress={this._onPressButton}
+                    onLongPress={this._onLongPressButton}
+                    underlayColor="white"
+                >
+                    <View style={styles.button}>
+                        <Text style={styles.buttonText}>Touchable with Long Press</Text>
+                    </View>
+                </TouchableHighlight>
             </View>
+
         );
     }
 }
 
 const styles = StyleSheet.create({
     container: {
-        flex: 1,
-        justifyContent: 'center',
+        paddingTop: 60,
+        alignItems: 'center'
     },
-    buttonContainer : {
-        margin: 20
+    button: {
+        marginBottom: 30,
+        width: 260,
+        alignItems: 'center',
+        backgroundColor: '#2196F3'
     },
-    alternativeLayoutButtonContainer: {
-        margin: 20,
-        flexDirection: 'row',
-        justifyContent: 'space-between'
+    buttonText: {
+        padding: 20,
+        color: 'white'
     }
 })
 
-AppRegistry.registerComponent('react-native-tutorial', () => ButtonBasics);
+AppRegistry.registerComponent('react-native-tutorial', () => Touchables);