Pārlūkot izejas kodu

adding example content

talkol 8 gadus atpakaļ
vecāks
revīzija
55b2fe1fa6

+ 3
- 2
example-redux/package.json Parādīt failu

@@ -1,11 +1,12 @@
1 1
 {
2
-  "name": "exampleRedux",
2
+  "name": "example-redux",
3 3
   "version": "0.0.1",
4 4
   "private": true,
5 5
   "scripts": {
6 6
     "start": "node node_modules/react-native/local-cli/cli.js start"
7 7
   },
8 8
   "dependencies": {
9
-    "react-native": "^0.21.0"
9
+    "react-native": "^0.21.0",
10
+    "react-native-navigation": "latest"
10 11
   }
11 12
 }

Binārs
example/img/colors.png Parādīt failu


Binārs
example/img/one@2x.png Parādīt failu


Binārs
example/img/one_selected@2x.png Parādīt failu


Binārs
example/img/three@2x.png Parādīt failu


Binārs
example/img/three_selected@2x.png Parādīt failu


Binārs
example/img/two@2x.png Parādīt failu


Binārs
example/img/two_selected@2x.png Parādīt failu


+ 1
- 52
example/index.ios.js Parādīt failu

@@ -1,52 +1 @@
1
-/**
2
- * Sample React Native App
3
- * https://github.com/facebook/react-native
4
- */
5
-'use strict';
6
-import React, {
7
-  AppRegistry,
8
-  Component,
9
-  StyleSheet,
10
-  Text,
11
-  View
12
-} from 'react-native';
13
-
14
-class example extends Component {
15
-  render() {
16
-    return (
17
-      <View style={styles.container}>
18
-        <Text style={styles.welcome}>
19
-          Welcome to React Native!
20
-        </Text>
21
-        <Text style={styles.instructions}>
22
-          To get started, edit index.ios.js
23
-        </Text>
24
-        <Text style={styles.instructions}>
25
-          Press Cmd+R to reload,{'\n'}
26
-          Cmd+D or shake for dev menu
27
-        </Text>
28
-      </View>
29
-    );
30
-  }
31
-}
32
-
33
-const styles = StyleSheet.create({
34
-  container: {
35
-    flex: 1,
36
-    justifyContent: 'center',
37
-    alignItems: 'center',
38
-    backgroundColor: '#F5FCFF',
39
-  },
40
-  welcome: {
41
-    fontSize: 20,
42
-    textAlign: 'center',
43
-    margin: 10,
44
-  },
45
-  instructions: {
46
-    textAlign: 'center',
47
-    color: '#333333',
48
-    marginBottom: 5,
49
-  },
50
-});
51
-
52
-AppRegistry.registerComponent('example', () => example);
1
+import App from './src/app';

+ 45
- 14
example/ios/example.xcodeproj/project.pbxproj Parādīt failu

@@ -22,6 +22,7 @@
22 22
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
23 23
 		146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; };
24 24
 		832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
25
+		CCCF226F1C9379C300455574 /* libReactNativeControllers.a in Frameworks */ = {isa = PBXBuildFile; fileRef = CCCF226E1C9379B000455574 /* libReactNativeControllers.a */; };
25 26
 /* End PBXBuildFile section */
26 27
 
27 28
 /* Begin PBXContainerItemProxy section */
@@ -102,20 +103,27 @@
102 103
 			remoteGlobalIDString = 58B5119B1A9E6C1200147676;
103 104
 			remoteInfo = RCTText;
104 105
 		};
106
+		CCCF226D1C9379B000455574 /* PBXContainerItemProxy */ = {
107
+			isa = PBXContainerItemProxy;
108
+			containerPortal = CCCF225F1C9379AF00455574 /* ReactNativeControllers.xcodeproj */;
109
+			proxyType = 2;
110
+			remoteGlobalIDString = D8AFADBD1BEE6F3F00A4592D;
111
+			remoteInfo = ReactNativeControllers;
112
+		};
105 113
 /* End PBXContainerItemProxy section */
106 114
 
107 115
 /* Begin PBXFileReference section */
108
-		008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; name = main.jsbundle; path = main.jsbundle; sourceTree = "<group>"; };
109
-		00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
110
-		00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
111
-		00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
112
-		00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
113
-		00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
116
+		008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = "<group>"; };
117
+		00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = "../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj"; sourceTree = "<group>"; };
118
+		00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = "../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj"; sourceTree = "<group>"; };
119
+		00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = "../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj"; sourceTree = "<group>"; };
120
+		00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = "../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj"; sourceTree = "<group>"; };
121
+		00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = "../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj"; sourceTree = "<group>"; };
114 122
 		00E356EE1AD99517003FC87E /* exampleTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = exampleTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
115 123
 		00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
116 124
 		00E356F21AD99517003FC87E /* exampleTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = exampleTests.m; sourceTree = "<group>"; };
117
-		139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
118
-		139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
125
+		139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = "../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj"; sourceTree = "<group>"; };
126
+		139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = "../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj"; sourceTree = "<group>"; };
119 127
 		13B07F961A680F5B00A75B9A /* example.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = example.app; sourceTree = BUILT_PRODUCTS_DIR; };
120 128
 		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = example/AppDelegate.h; sourceTree = "<group>"; };
121 129
 		13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = example/AppDelegate.m; sourceTree = "<group>"; };
@@ -123,9 +131,10 @@
123 131
 		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = example/Images.xcassets; sourceTree = "<group>"; };
124 132
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = example/Info.plist; sourceTree = "<group>"; };
125 133
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = example/main.m; sourceTree = "<group>"; };
126
-		146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../node_modules/react-native/React/React.xcodeproj; sourceTree = "<group>"; };
127
-		78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
128
-		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
134
+		146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = "../node_modules/react-native/React/React.xcodeproj"; sourceTree = "<group>"; };
135
+		78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = "../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj"; sourceTree = "<group>"; };
136
+		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = "../node_modules/react-native/Libraries/Text/RCTText.xcodeproj"; sourceTree = "<group>"; };
137
+		CCCF225F1C9379AF00455574 /* ReactNativeControllers.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = ReactNativeControllers.xcodeproj; path = "../node_modules/react-native-controllers/ios/ReactNativeControllers.xcodeproj"; sourceTree = "<group>"; };
129 138
 /* End PBXFileReference section */
130 139
 
131 140
 /* Begin PBXFrameworksBuildPhase section */
@@ -140,6 +149,7 @@
140 149
 			isa = PBXFrameworksBuildPhase;
141 150
 			buildActionMask = 2147483647;
142 151
 			files = (
152
+				CCCF226F1C9379C300455574 /* libReactNativeControllers.a in Frameworks */,
143 153
 				146834051AC3E58100842450 /* libReact.a in Frameworks */,
144 154
 				00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */,
145 155
 				00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */,
@@ -272,6 +282,7 @@
272 282
 				832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
273 283
 				00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
274 284
 				139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
285
+				CCCF225F1C9379AF00455574 /* ReactNativeControllers.xcodeproj */,
275 286
 			);
276 287
 			name = Libraries;
277 288
 			sourceTree = "<group>";
@@ -305,6 +316,14 @@
305 316
 			name = Products;
306 317
 			sourceTree = "<group>";
307 318
 		};
319
+		CCCF22601C9379AF00455574 /* Products */ = {
320
+			isa = PBXGroup;
321
+			children = (
322
+				CCCF226E1C9379B000455574 /* libReactNativeControllers.a */,
323
+			);
324
+			name = Products;
325
+			sourceTree = "<group>";
326
+		};
308 327
 /* End PBXGroup section */
309 328
 
310 329
 /* Begin PBXNativeTarget section */
@@ -411,6 +430,10 @@
411 430
 					ProductGroup = 146834001AC3E56700842450 /* Products */;
412 431
 					ProjectRef = 146833FF1AC3E56700842450 /* React.xcodeproj */;
413 432
 				},
433
+				{
434
+					ProductGroup = CCCF22601C9379AF00455574 /* Products */;
435
+					ProjectRef = CCCF225F1C9379AF00455574 /* ReactNativeControllers.xcodeproj */;
436
+				},
414 437
 			);
415 438
 			projectRoot = "";
416 439
 			targets = (
@@ -491,6 +514,13 @@
491 514
 			remoteRef = 832341B41AAA6A8300B99B32 /* PBXContainerItemProxy */;
492 515
 			sourceTree = BUILT_PRODUCTS_DIR;
493 516
 		};
517
+		CCCF226E1C9379B000455574 /* libReactNativeControllers.a */ = {
518
+			isa = PBXReferenceProxy;
519
+			fileType = archive.ar;
520
+			path = libReactNativeControllers.a;
521
+			remoteRef = CCCF226D1C9379B000455574 /* PBXContainerItemProxy */;
522
+			sourceTree = BUILT_PRODUCTS_DIR;
523
+		};
494 524
 /* End PBXReferenceProxy section */
495 525
 
496 526
 /* Begin PBXResourcesBuildPhase section */
@@ -526,7 +556,6 @@
526 556
 			runOnlyForDeploymentPostprocessing = 0;
527 557
 			shellPath = /bin/sh;
528 558
 			shellScript = "export NODE_BINARY=node\n../node_modules/react-native/packager/react-native-xcode.sh";
529
-			showEnvVarsInLog = 1;
530 559
 		};
531 560
 /* End PBXShellScriptBuildPhase section */
532 561
 
@@ -617,8 +646,9 @@
617 646
 					"$(inherited)",
618 647
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
619 648
 					"$(SRCROOT)/../node_modules/react-native/React/**",
649
+					"$(SRCROOT)/../node_modules/react-native-controllers/ios/**",
620 650
 				);
621
-				INFOPLIST_FILE = "example/Info.plist";
651
+				INFOPLIST_FILE = example/Info.plist;
622 652
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
623 653
 				OTHER_LDFLAGS = "-ObjC";
624 654
 				PRODUCT_NAME = example;
@@ -633,8 +663,9 @@
633 663
 					"$(inherited)",
634 664
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
635 665
 					"$(SRCROOT)/../node_modules/react-native/React/**",
666
+					"$(SRCROOT)/../node_modules/react-native-controllers/ios/**",
636 667
 				);
637
-				INFOPLIST_FILE = "example/Info.plist";
668
+				INFOPLIST_FILE = example/Info.plist;
638 669
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
639 670
 				OTHER_LDFLAGS = "-ObjC";
640 671
 				PRODUCT_NAME = example;

+ 4
- 10
example/ios/example/AppDelegate.m Parādīt failu

@@ -8,7 +8,7 @@
8 8
  */
9 9
 
10 10
 #import "AppDelegate.h"
11
-
11
+#import "RCCManager.h" // <---- NOTICE ME
12 12
 #import "RCTRootView.h"
13 13
 
14 14
 @implementation AppDelegate
@@ -41,16 +41,10 @@
41 41
 
42 42
 //   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
43 43
 
44
-  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
45
-                                                      moduleName:@"example"
46
-                                               initialProperties:nil
47
-                                                   launchOptions:launchOptions];
48
-
49 44
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
50
-  UIViewController *rootViewController = [UIViewController new];
51
-  rootViewController.view = rootView;
52
-  self.window.rootViewController = rootViewController;
53
-  [self.window makeKeyAndVisible];
45
+  self.window.backgroundColor = [UIColor whiteColor];
46
+  [[RCCManager sharedIntance] initBridgeWithBundleURL:jsCodeLocation]; //<---- NOTICE ME
47
+  
54 48
   return YES;
55 49
 }
56 50
 

+ 2
- 1
example/package.json Parādīt failu

@@ -6,6 +6,7 @@
6 6
     "start": "node node_modules/react-native/local-cli/cli.js start"
7 7
   },
8 8
   "dependencies": {
9
-    "react-native": "^0.21.0"
9
+    "react-native": "^0.21.0",
10
+    "react-native-navigation": "latest"
10 11
   }
11 12
 }

+ 36
- 0
example/src/app.js Parādīt failu

@@ -0,0 +1,36 @@
1
+import { Navigation } from 'react-native-navigation';
2
+
3
+import './screens/FirstTabScreen';
4
+import './screens/SecondTabScreen';
5
+import './screens/ThirdTabScreen';
6
+
7
+Navigation.startTabBasedApp({
8
+  tabs: [
9
+    {
10
+      title: 'One',
11
+      screen: 'example.FirstTabScreen',
12
+      icon: require('../img/one.png'),
13
+      selectedIcon: require('../img/one_selected.png'),
14
+      screenTitle: 'Screen One'
15
+    },
16
+    {
17
+      title: 'Two',
18
+      screen: 'example.SecondTabScreen',
19
+      icon: require('../img/two.png'),
20
+      selectedIcon: require('../img/two_selected.png'),
21
+      screenTitle: 'Screen Two'
22
+    },
23
+    {
24
+      title: 'Three',
25
+      screen: 'example.ThirdTabScreen',
26
+      icon: require('../img/three.png'),
27
+      selectedIcon: require('../img/three_selected.png'),
28
+      screenTitle: 'Screen Three',
29
+      navigatorStyle: {
30
+        navBarBackgroundColor: '#26ade4',
31
+        navBarTextColor: '#f0f0f0',
32
+        navBarButtonColor: '#ffffff'
33
+      }
34
+    }
35
+  ]
36
+});

+ 61
- 0
example/src/screens/FirstTabScreen.js Parādīt failu

@@ -0,0 +1,61 @@
1
+import React, {
2
+  Text,
3
+  View,
4
+  ScrollView,
5
+  TouchableOpacity,
6
+  StyleSheet
7
+} from 'react-native';
8
+
9
+// important imports, the magic is here
10
+import { Navigation, Screen } from 'react-native-navigation';
11
+
12
+// need to import every screen we push
13
+import './PushedScreen';
14
+import './StyledScreen';
15
+
16
+// instead of React.Component, we extend Screen (imported above)
17
+class FirstTabScreen extends Screen {
18
+  constructor(props) {
19
+    super(props);
20
+  }
21
+  render() {
22
+    return (
23
+      <View style={{flex: 1, padding: 20}}>
24
+
25
+        <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
26
+          <Text style={styles.button}>Push Plain Screen</Text>
27
+        </TouchableOpacity>
28
+
29
+        <TouchableOpacity onPress={ this.onPushStyledPress.bind(this) }>
30
+          <Text style={styles.button}>Push Styled Screen</Text>
31
+        </TouchableOpacity>
32
+
33
+      </View>
34
+    );
35
+  }
36
+  onPushPress() {
37
+    this.navigator.push({
38
+      title: "More",
39
+      screen: "example.PushedScreen"
40
+    });
41
+  }
42
+  onPushStyledPress() {
43
+    this.navigator.push({
44
+      title: "More",
45
+      screen: "example.StyledScreen"
46
+    });
47
+  }
48
+}
49
+
50
+const styles = StyleSheet.create({
51
+  button: {
52
+    textAlign: 'center',
53
+    fontSize: 18,
54
+    marginBottom: 10,
55
+    marginTop:10,
56
+    color: 'blue'
57
+  }
58
+});
59
+
60
+// every screen must be registered with a unique name
61
+Navigation.registerScreen('example.FirstTabScreen', () => FirstTabScreen);

+ 68
- 0
example/src/screens/PushedScreen.js Parādīt failu

@@ -0,0 +1,68 @@
1
+import React, {
2
+  Text,
3
+  View,
4
+  ScrollView,
5
+  TouchableOpacity,
6
+  StyleSheet
7
+} from 'react-native';
8
+
9
+// important imports, the magic is here
10
+import { Navigation, Screen } from 'react-native-navigation';
11
+
12
+// need to import every screen we push
13
+import './PushedScreen';
14
+import './StyledScreen';
15
+
16
+// instead of React.Component, we extend Screen (imported above)
17
+class PushedScreen extends Screen {
18
+  constructor(props) {
19
+    super(props);
20
+  }
21
+  render() {
22
+    return (
23
+      <View style={{flex: 1, padding: 20}}>
24
+
25
+        <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
26
+          <Text style={styles.button}>Push Plain Screen</Text>
27
+        </TouchableOpacity>
28
+
29
+        <TouchableOpacity onPress={ this.onPushStyledPress.bind(this) }>
30
+          <Text style={styles.button}>Push Styled Screen</Text>
31
+        </TouchableOpacity>
32
+
33
+        <TouchableOpacity onPress={ this.onPopPress.bind(this) }>
34
+          <Text style={styles.button}>Pop Screen</Text>
35
+        </TouchableOpacity>
36
+
37
+      </View>
38
+    );
39
+  }
40
+  onPushPress() {
41
+    this.navigator.push({
42
+      title: "More",
43
+      screen: "example.PushedScreen"
44
+    });
45
+  }
46
+  onPushStyledPress() {
47
+    this.navigator.push({
48
+      title: "More",
49
+      screen: "example.StyledScreen"
50
+    });
51
+  }
52
+  onPopPress() {
53
+    this.navigator.pop();
54
+  }
55
+}
56
+
57
+const styles = StyleSheet.create({
58
+  button: {
59
+    textAlign: 'center',
60
+    fontSize: 18,
61
+    marginBottom: 10,
62
+    marginTop:10,
63
+    color: 'blue'
64
+  }
65
+});
66
+
67
+// every screen must be registered with a unique name
68
+Navigation.registerScreen('example.PushedScreen', () => PushedScreen);

+ 26
- 0
example/src/screens/SecondTabScreen.js Parādīt failu

@@ -0,0 +1,26 @@
1
+import React, {
2
+  Text,
3
+  View,
4
+  ScrollView,
5
+  TouchableOpacity
6
+} from 'react-native';
7
+
8
+// important imports, the magic is here
9
+import { Navigation, Screen } from 'react-native-navigation';
10
+
11
+// instead of React.Component, we extend Screen (imported above)
12
+class SecondTabScreen extends Screen {
13
+  constructor(props) {
14
+    super(props);
15
+  }
16
+  render() {
17
+    return (
18
+      <View style={{flex: 1, padding: 20}}>
19
+        <Text>Second Tab Screen</Text>
20
+      </View>
21
+    );
22
+  }
23
+}
24
+
25
+// every screen must be registered with a unique name
26
+Navigation.registerScreen('example.SecondTabScreen', () => SecondTabScreen);

+ 79
- 0
example/src/screens/StyledScreen.js Parādīt failu

@@ -0,0 +1,79 @@
1
+import React, {
2
+  Text,
3
+  View,
4
+  ScrollView,
5
+  TouchableOpacity,
6
+  Image,
7
+  StyleSheet
8
+} from 'react-native';
9
+
10
+// important imports, the magic is here
11
+import { Navigation, Screen } from 'react-native-navigation';
12
+
13
+// need to import every screen we push
14
+import './PushedScreen';
15
+import './StyledScreen';
16
+
17
+// instead of React.Component, we extend Screen (imported above)
18
+class StyledScreen extends Screen {
19
+  static navigatorStyle = {
20
+    drawUnderNavBar: true,
21
+    drawUnderTabBar: true
22
+  };
23
+  constructor(props) {
24
+    super(props);
25
+  }
26
+  render() {
27
+    return (
28
+      <ScrollView style={{flex: 1}}>
29
+
30
+        <Image style={{width: undefined, height: 100}} source={require('../../img/colors.png')} />
31
+
32
+        <View style={{padding: 20}}>
33
+
34
+          <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
35
+            <Text style={styles.button}>Push Plain Screen</Text>
36
+          </TouchableOpacity>
37
+
38
+          <TouchableOpacity onPress={ this.onPushStyledPress.bind(this) }>
39
+            <Text style={styles.button}>Push Styled Screen</Text>
40
+          </TouchableOpacity>
41
+
42
+          <TouchableOpacity onPress={ this.onPopPress.bind(this) }>
43
+            <Text style={styles.button}>Pop Screen</Text>
44
+          </TouchableOpacity>
45
+
46
+        </View>
47
+
48
+      </ScrollView>
49
+    );
50
+  }
51
+  onPushPress() {
52
+    this.navigator.push({
53
+      title: "More",
54
+      screen: "example.PushedScreen"
55
+    });
56
+  }
57
+  onPushStyledPress() {
58
+    this.navigator.push({
59
+      title: "More",
60
+      screen: "example.StyledScreen"
61
+    });
62
+  }
63
+  onPopPress() {
64
+    this.navigator.pop();
65
+  }
66
+}
67
+
68
+const styles = StyleSheet.create({
69
+  button: {
70
+    textAlign: 'center',
71
+    fontSize: 18,
72
+    marginBottom: 10,
73
+    marginTop:10,
74
+    color: 'blue'
75
+  }
76
+});
77
+
78
+// every screen must be registered with a unique name
79
+Navigation.registerScreen('example.StyledScreen', () => StyledScreen);

+ 26
- 0
example/src/screens/ThirdTabScreen.js Parādīt failu

@@ -0,0 +1,26 @@
1
+import React, {
2
+  Text,
3
+  View,
4
+  ScrollView,
5
+  TouchableOpacity
6
+} from 'react-native';
7
+
8
+// important imports, the magic is here
9
+import { Navigation, Screen } from 'react-native-navigation';
10
+
11
+// instead of React.Component, we extend Screen (imported above)
12
+class ThirdTabScreen extends Screen {
13
+  constructor(props) {
14
+    super(props);
15
+  }
16
+  render() {
17
+    return (
18
+      <View style={{flex: 1, padding: 20}}>
19
+        <Text>Third Tab Screen</Text>
20
+      </View>
21
+    );
22
+  }
23
+}
24
+
25
+// every screen must be registered with a unique name
26
+Navigation.registerScreen('example.ThirdTabScreen', () => ThirdTabScreen);

+ 8
- 0
src/platformSpecific.ios.js Parādīt failu

@@ -22,6 +22,10 @@ function startTabBasedApp(params) {
22 22
         {
23 23
           params.tabs.map(function(tab, index) {
24 24
             const navigatorID = appID + '_nav' + index;
25
+            if (!tab.screen) {
26
+              console.error('startTabBasedApp(params): every tab must include a screen property, take a look at tab#' + (index+1));
27
+              return;
28
+            }
25 29
             const screenClass = Navigation.getRegisteredScreen(tab.screen);
26 30
             if (!screenClass) {
27 31
               console.error('Cannot create screen ' + tab.screen + '. Are you it was registered with Navigation.registerScreen?');
@@ -62,6 +66,10 @@ function startSingleScreenApp(params) {
62 66
     render: function() {
63 67
       const screen = params.screen;
64 68
       const navigatorID = appID + '_nav';
69
+      if (!screen.screen) {
70
+        console.error('startSingleScreenApp(params): screen must include a screen property');
71
+        return;
72
+      }
65 73
       const screenClass = Navigation.getRegisteredScreen(screen.screen);
66 74
       if (!screenClass) {
67 75
         console.error('Cannot create screen ' + screen.screen + '. Are you it was registered with Navigation.registerScreen?');