Browse Source

split example FirstTabScreen

Daniel Zlotin 8 years ago
parent
commit
a027deff62

+ 125
- 0
example/src/screens/FirstTabScreen.android.js View File

@@ -0,0 +1,125 @@
1
+import React, {Component} from 'react';
2
+import {
3
+  Text,
4
+  View,
5
+  TouchableHighlight,
6
+  StyleSheet,
7
+  AlertIOS
8
+} from 'react-native';
9
+
10
+export default class FirstTabScreen extends Component {
11
+  static navigatorButtons = {
12
+    leftButtons: [{
13
+      icon: require('../../img/navicon_menu.png'),
14
+      id: 'menu'
15
+    }],
16
+    rightButtons: [
17
+      {
18
+        title: 'Edit',
19
+        id: 'edit'
20
+      },
21
+      {
22
+        icon: require('../../img/navicon_add.png'),
23
+        id: 'add'
24
+      }
25
+    ]
26
+  };
27
+  static navigatorStyle = {
28
+    drawUnderTabBar: true
29
+  };
30
+
31
+  constructor(props) {
32
+    super(props);
33
+    // if you want to listen on navigator events, set this up
34
+    this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
35
+  }
36
+
37
+  onNavigatorEvent(event) {
38
+    if (event.id === 'menu') {
39
+      this.props.navigator.toggleDrawer({
40
+        side: 'left',
41
+        animated: true
42
+      });
43
+    }
44
+    if (event.id === 'edit') {
45
+      AlertIOS.alert('NavBar', 'Edit button pressed');
46
+    }
47
+    if (event.id === 'add') {
48
+      AlertIOS.alert('NavBar', 'Add button pressed');
49
+    }
50
+  }
51
+
52
+  render() {
53
+    return (
54
+      <View style={{flex: 1, padding: 20}}>
55
+
56
+        <TouchableHighlight onPress={ this.onPushPress.bind(this) }>
57
+          <Text style={styles.button}>Push Plain Screen</Text>
58
+        </TouchableHighlight>
59
+
60
+        <TouchableHighlight onPress={ this.onPushStyledPress.bind(this) }>
61
+          <Text style={styles.button}>Push Styled Screen</Text>
62
+        </TouchableHighlight>
63
+
64
+        <TouchableHighlight onPress={ this.onModalPress.bind(this) }>
65
+          <Text style={styles.button}>Show Modal Screen</Text>
66
+        </TouchableHighlight>
67
+
68
+        <TouchableHighlight onPress={ this.onLightBoxPress.bind(this) }>
69
+          <Text style={styles.button}>Show LightBox</Text>
70
+        </TouchableHighlight>
71
+
72
+        <TouchableHighlight onPress={ this.onInAppNotificationPress.bind(this) }>
73
+          <Text style={styles.button}>Show In-App Notification</Text>
74
+        </TouchableHighlight>
75
+
76
+      </View>
77
+    );
78
+  }
79
+
80
+  onPushPress() {
81
+    this.props.navigator.push({
82
+      title: "More",
83
+      screen: "example.PushedScreen"
84
+    });
85
+  }
86
+
87
+  onPushStyledPress() {
88
+    this.props.navigator.push({
89
+      title: "Styled",
90
+      screen: "example.StyledScreen"
91
+    });
92
+  }
93
+
94
+  onModalPress() {
95
+    this.props.navigator.showModal({
96
+      title: "Modal",
97
+      screen: "example.ModalScreen"
98
+    });
99
+  }
100
+
101
+  onLightBoxPress() {
102
+    this.props.navigator.showLightBox({
103
+      screen: "example.LightBoxScreen",
104
+      style: {
105
+        backgroundBlur: "dark"
106
+      }
107
+    });
108
+  }
109
+
110
+  onInAppNotificationPress() {
111
+    this.props.navigator.showInAppNotification({
112
+      screen: "example.NotificationScreen"
113
+    });
114
+  }
115
+}
116
+
117
+const styles = StyleSheet.create({
118
+  button: {
119
+    textAlign: 'center',
120
+    fontSize: 18,
121
+    marginBottom: 10,
122
+    marginTop: 10,
123
+    color: 'blue'
124
+  }
125
+});

example/src/screens/FirstTabScreen.js → example/src/screens/FirstTabScreen.ios.js View File


+ 2
- 2
example/src/screens/index.ios.js View File

@@ -1,4 +1,4 @@
1
-import { Navigation } from 'react-native-navigation';
1
+import {Navigation} from 'react-native-navigation';
2 2
 
3 3
 import FirstTabScreen from './FirstTabScreen';
4 4
 import SecondTabScreen from './SecondTabScreen';
@@ -7,7 +7,7 @@ import PushedScreen from './PushedScreen';
7 7
 import StyledScreen from './StyledScreen';
8 8
 import ModalScreen from './ModalScreen';
9 9
 import LightBoxScreen from './LightBoxScreen';
10
-import NotificationScreen from './NotificationScreen'
10
+import NotificationScreen from './NotificationScreen';
11 11
 import SideMenu from './SideMenu';
12 12
 
13 13
 // register all screens of the app (including internal ones)