setup basic navigation

This commit is contained in:
Jake Howard 2016-09-17 14:40:54 +01:00
parent 9d1a4a0510
commit 5499c1b680
Signed by: jake
GPG key ID: 57AFB45680EDD477
20 changed files with 364 additions and 94 deletions

1
.gitignore vendored
View file

@ -42,3 +42,4 @@ android/keystores/debug.keystore
dist/ dist/
typings/ typings/
android/app/src/main/assets/

View file

@ -1,8 +1,7 @@
NODE=$(PWD)/node_modules/.bin
build: build:
rm -rf dist/ $(NODE)/tsc
tsc
install: node_modules typings install: node_modules typings

View file

@ -126,6 +126,7 @@ android {
} }
dependencies { dependencies {
compile project(':react-native-vector-icons')
compile fileTree(dir: "libs", include: ["*.jar"]) compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:23.0.1" compile "com.android.support:appcompat-v7:23.0.1"
compile "com.facebook.react:react-native:+" // From node_modules compile "com.facebook.react:react-native:+" // From node_modules

View file

@ -1,6 +1,7 @@
package com.zxcvbn; package com.zxcvbn;
import com.facebook.react.ReactActivity; import com.facebook.react.ReactActivity;
import com.oblador.vectoricons.VectorIconsPackage;
public class MainActivity extends ReactActivity { public class MainActivity extends ReactActivity {

View file

@ -1,3 +1,4 @@
<resources> <resources>
<string name="app_name">zxcvbn</string> <string name="app_name">zxcvbn</string>
</resources> </resources>

View file

@ -1,3 +1,5 @@
rootProject.name = 'zxcvbn' rootProject.name = 'zxcvbn'
include ':app' include ':app'
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

View file

@ -5,7 +5,6 @@
}; };
objectVersion = 46; objectVersion = 46;
objects = { objects = {
/* Begin PBXBuildFile section */ /* Begin PBXBuildFile section */
00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; }; 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; };
00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; }; 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; };
@ -23,6 +22,15 @@
140ED2AC1D01E1AD002B40FF /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; }; 140ED2AC1D01E1AD002B40FF /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; };
146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; }; 146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; };
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; }; 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
AC837CB69F9B4D1AB280198D /* libRNVectorIcons.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D89C9404F60344A99A1C4BE6 /* libRNVectorIcons.a */; };
0A6B304B72B5403D86F9A2EA /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4DA10A292EF743D9BEFB5089 /* Entypo.ttf */; };
464ADB5B08DE42F0B75555B8 /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = C730D9BC523D4A7CB1B55C43 /* EvilIcons.ttf */; };
9CDA3D34C8D6406D9E22BCE0 /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 59C25E7A51DB4149AB1A0F42 /* FontAwesome.ttf */; };
90913271F7DF4CA0BEE69064 /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 83CF2B4CEFB149F5A9114456 /* Foundation.ttf */; };
B6B125C8BF7C4589B7D2DBCC /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 654E6742B6884FE180D2F554 /* Ionicons.ttf */; };
1CFE37C350A04E9BBF55B3A5 /* MaterialIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 047F108934FD4D12AAB8E18C /* MaterialIcons.ttf */; };
DAC3600BCC604ADB9482C6EC /* Octicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 6FB75B872E784A2891511B59 /* Octicons.ttf */; };
4611E18C9A0345AAB60AD922 /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 706F4CE4421149CB90C3F0CA /* Zocial.ttf */; };
/* End PBXBuildFile section */ /* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */ /* Begin PBXContainerItemProxy section */
@ -127,6 +135,16 @@
146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../node_modules/react-native/React/React.xcodeproj; sourceTree = "<group>"; }; 146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../node_modules/react-native/React/React.xcodeproj; sourceTree = "<group>"; };
78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; }; 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; }; 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
D87070575A5C440E9BB53EFC /* RNVectorIcons.xcodeproj */ = {isa = PBXFileReference; name = "RNVectorIcons.xcodeproj"; path = "../node_modules/react-native-vector-icons/RNVectorIcons.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
D89C9404F60344A99A1C4BE6 /* libRNVectorIcons.a */ = {isa = PBXFileReference; name = "libRNVectorIcons.a"; path = "libRNVectorIcons.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
4DA10A292EF743D9BEFB5089 /* Entypo.ttf */ = {isa = PBXFileReference; name = "Entypo.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Entypo.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
C730D9BC523D4A7CB1B55C43 /* EvilIcons.ttf */ = {isa = PBXFileReference; name = "EvilIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
59C25E7A51DB4149AB1A0F42 /* FontAwesome.ttf */ = {isa = PBXFileReference; name = "FontAwesome.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
83CF2B4CEFB149F5A9114456 /* Foundation.ttf */ = {isa = PBXFileReference; name = "Foundation.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Foundation.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
654E6742B6884FE180D2F554 /* Ionicons.ttf */ = {isa = PBXFileReference; name = "Ionicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Ionicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
047F108934FD4D12AAB8E18C /* MaterialIcons.ttf */ = {isa = PBXFileReference; name = "MaterialIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
6FB75B872E784A2891511B59 /* Octicons.ttf */ = {isa = PBXFileReference; name = "Octicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Octicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
706F4CE4421149CB90C3F0CA /* Zocial.ttf */ = {isa = PBXFileReference; name = "Zocial.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Zocial.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
/* End PBXFileReference section */ /* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */ /* Begin PBXFrameworksBuildPhase section */
@ -152,6 +170,7 @@
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */, 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */, 00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */,
139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */, 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
AC837CB69F9B4D1AB280198D /* libRNVectorIcons.a in Frameworks */,
); );
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
}; };
@ -274,6 +293,7 @@
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */, 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */, 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */, 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
D87070575A5C440E9BB53EFC /* RNVectorIcons.xcodeproj */,
); );
name = Libraries; name = Libraries;
sourceTree = "<group>"; sourceTree = "<group>";
@ -293,6 +313,7 @@
832341AE1AAA6A7D00B99B32 /* Libraries */, 832341AE1AAA6A7D00B99B32 /* Libraries */,
00E356EF1AD99517003FC87E /* zxcvbnTests */, 00E356EF1AD99517003FC87E /* zxcvbnTests */,
83CBBA001A601CBA00E9B192 /* Products */, 83CBBA001A601CBA00E9B192 /* Products */,
4685DB9781F94227B1E5E3F0 /* Resources */,
); );
indentWidth = 2; indentWidth = 2;
sourceTree = "<group>"; sourceTree = "<group>";
@ -307,6 +328,22 @@
name = Products; name = Products;
sourceTree = "<group>"; sourceTree = "<group>";
}; };
4685DB9781F94227B1E5E3F0 /* Resources */ = {
isa = PBXGroup;
children = (
4DA10A292EF743D9BEFB5089 /* Entypo.ttf */,
C730D9BC523D4A7CB1B55C43 /* EvilIcons.ttf */,
59C25E7A51DB4149AB1A0F42 /* FontAwesome.ttf */,
83CF2B4CEFB149F5A9114456 /* Foundation.ttf */,
654E6742B6884FE180D2F554 /* Ionicons.ttf */,
047F108934FD4D12AAB8E18C /* MaterialIcons.ttf */,
6FB75B872E784A2891511B59 /* Octicons.ttf */,
706F4CE4421149CB90C3F0CA /* Zocial.ttf */,
);
name = Resources;
path = "";
sourceTree = "<group>";
};
/* End PBXGroup section */ /* End PBXGroup section */
/* Begin PBXNativeTarget section */ /* Begin PBXNativeTarget section */
@ -352,7 +389,7 @@
83CBB9F71A601CBA00E9B192 /* Project object */ = { 83CBB9F71A601CBA00E9B192 /* Project object */ = {
isa = PBXProject; isa = PBXProject;
attributes = { attributes = {
LastUpgradeCheck = 0610; LastUpgradeCheck = 610;
ORGANIZATIONNAME = Facebook; ORGANIZATIONNAME = Facebook;
TargetAttributes = { TargetAttributes = {
00E356ED1AD99517003FC87E = { 00E356ED1AD99517003FC87E = {
@ -509,6 +546,14 @@
files = ( files = (
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */, 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */, 13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,
0A6B304B72B5403D86F9A2EA /* Entypo.ttf in Resources */,
464ADB5B08DE42F0B75555B8 /* EvilIcons.ttf in Resources */,
9CDA3D34C8D6406D9E22BCE0 /* FontAwesome.ttf in Resources */,
90913271F7DF4CA0BEE69064 /* Foundation.ttf in Resources */,
B6B125C8BF7C4589B7D2DBCC /* Ionicons.ttf in Resources */,
1CFE37C350A04E9BBF55B3A5 /* MaterialIcons.ttf in Resources */,
DAC3600BCC604ADB9482C6EC /* Octicons.ttf in Resources */,
4611E18C9A0345AAB60AD922 /* Zocial.ttf in Resources */,
); );
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
}; };
@ -586,6 +631,10 @@
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
PRODUCT_NAME = "$(TARGET_NAME)"; PRODUCT_NAME = "$(TARGET_NAME)";
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
}; };
name = Debug; name = Debug;
}; };
@ -599,6 +648,10 @@
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
PRODUCT_NAME = "$(TARGET_NAME)"; PRODUCT_NAME = "$(TARGET_NAME)";
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
}; };
name = Release; name = Release;
}; };
@ -611,6 +664,7 @@
"$(inherited)", "$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**", "$(SRCROOT)/../node_modules/react-native/React/**",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
); );
INFOPLIST_FILE = "zxcvbn/Info.plist"; INFOPLIST_FILE = "zxcvbn/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@ -631,6 +685,7 @@
"$(inherited)", "$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**", "$(SRCROOT)/../node_modules/react-native/React/**",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
); );
INFOPLIST_FILE = "zxcvbn/Info.plist"; INFOPLIST_FILE = "zxcvbn/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@ -681,6 +736,7 @@
"$(inherited)", "$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**", "$(SRCROOT)/../node_modules/react-native/React/**",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
); );
IPHONEOS_DEPLOYMENT_TARGET = 7.0; IPHONEOS_DEPLOYMENT_TARGET = 7.0;
MTL_ENABLE_DEBUG_INFO = YES; MTL_ENABLE_DEBUG_INFO = YES;
@ -721,6 +777,7 @@
"$(inherited)", "$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**", "$(SRCROOT)/../node_modules/react-native/React/**",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
); );
IPHONEOS_DEPLOYMENT_TARGET = 7.0; IPHONEOS_DEPLOYMENT_TARGET = 7.0;
MTL_ENABLE_DEBUG_INFO = NO; MTL_ENABLE_DEBUG_INFO = NO;

View file

@ -37,9 +37,8 @@
<key>UIViewControllerBasedStatusBarAppearance</key> <key>UIViewControllerBasedStatusBarAppearance</key>
<false/> <false/>
<key>NSLocationWhenInUseUsageDescription</key> <key>NSLocationWhenInUseUsageDescription</key>
<string></string> <string/>
<key>NSAppTransportSecurity</key> <key>NSAppTransportSecurity</key>
<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
<dict> <dict>
<key>NSExceptionDomains</key> <key>NSExceptionDomains</key>
<dict> <dict>
@ -50,5 +49,16 @@
</dict> </dict>
</dict> </dict>
</dict> </dict>
<key>UIAppFonts</key>
<array>
<string>Entypo.ttf</string>
<string>EvilIcons.ttf</string>
<string>FontAwesome.ttf</string>
<string>Foundation.ttf</string>
<string>Ionicons.ttf</string>
<string>MaterialIcons.ttf</string>
<string>Octicons.ttf</string>
<string>Zocial.ttf</string>
</array>
</dict> </dict>
</plist> </plist>

View file

@ -4,13 +4,14 @@
"private": true, "private": true,
"scripts": { "scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start", "start": "node node_modules/react-native/local-cli/cli.js start",
"build": "rm -rf dist && tsc" "link": "rnpm link"
}, },
"dependencies": { "dependencies": {
"immutable": "=3.8.1", "immutable": "=3.8.1",
"react": "=15.3.1", "react": "=15.3.1",
"react-native": "=0.33.0", "react-native": "=0.33.0",
"react-native-progress-bar": "=0.1.2", "react-native-progress-bar": "=0.1.2",
"react-native-vector-icons": "=2.1.0",
"underscore": "=1.8.3", "underscore": "=1.8.3",
"zxcvbn": "=4.3.0" "zxcvbn": "=4.3.0"
}, },

View file

@ -1,43 +1,50 @@
// src/index.ts
import React, { Component } from 'react'; import React, { Component } from 'react';
import { import {
StyleSheet,
Text, Text,
View View,
Navigator,
StyleSheet
} from 'react-native'; } from 'react-native';
import Routes from './navigation/Routes';
import RouteMapper from './navigation/RouteMapper';
import './types';
interface Props {
const styles = StyleSheet.create({
wrapper: {
flex: 1
} as React.ViewStyle,
navbar: {
flexDirection: 'row',
justifyContent: 'center',
backgroundColor: '#888'
} as React.ViewStyle
});
export default class App extends Component<any, any> {
renderScene(route: any, nav : any) {
const Component = route.component;
const props = route.props || {};
return (
<Component
nav={nav}
currentRoute={route}
{...props} />
);
} }
interface State {
}
export default class App extends Component<Props, State> {
render() { render() {
return ( return (
<View style={styles.container}> <View style={styles.wrapper}>
<Text style={styles.text}> <Navigator
Welcome to React Native! renderScene={this.renderScene}
</Text> initialRoute={Routes.main}
navigationBar={
<Navigator.NavigationBar
style={styles.navbar}
routeMapper={RouteMapper} />
} />
</View> </View>
); );
} }
} }
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
} as React.ViewStyle,
text: {
fontSize: 20,
textAlign: 'center',
margin: 10,
} as React.TextStyle,
});

View file

@ -0,0 +1,44 @@
import React, { Component } from 'react';
import Icon from 'react-native-vector-icons/FontAwesome';
import {
StyleSheet,
TouchableHighlight,
View,
Text
} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
} as React.ViewStyle,
toolbarButton: {
paddingHorizontal: 15,
} as React.ViewStyle,
text: {
color: '#000',
paddingHorizontal: 10
} as React.TextStyle
});
export default class BackButton extends Component<any, any> {
goBack() {
this.props.nav.pop();
}
render() {
return (
<View style={styles.container}>
<TouchableHighlight
style={styles.toolbarButton}
underlayColor="transparent"
onPress={this.goBack.bind(this)}>
<Text style={styles.text}><Icon name="chevron-left" size={20} /></Text>
</TouchableHighlight>
</View>
);
}
}

View file

@ -0,0 +1,39 @@
import React, { Component } from 'react';
import Icon from 'react-native-vector-icons/FontAwesome';
import {
StyleSheet,
TouchableHighlight,
View,
Text
} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
} as React.ViewStyle,
toolbarButton: {
paddingHorizontal: 15,
} as React.ViewStyle,
text: {
color: '#FFF',
fontSize: 18,
} as React.TextStyle
});
export default class InfoButton extends Component<any, any> {
render() {
return (
<View style={styles.container}>
<TouchableHighlight
style={styles.toolbarButton}
underlayColor="transparent"
onPress={() => null}>
<Icon name="info" style={styles.text} />
</TouchableHighlight>
</View>
);
}
}

View file

@ -0,0 +1,29 @@
import React from 'react';
import {
Text,
View
} from 'react-native';
import BackButton from './BackButton';
import InfoButton from './InfoButton';
import Title from './Title'
export default {
LeftButton: function (route: any, navigator: any, index: number, navState: any) {
if (index >= 1) {
return (
<BackButton nav={navigator} />
);
}
return <View />;
},
RightButton: function (route: any, navigator: any, index: number, navState: any) {
return <InfoButton nav={navigator} />;
},
Title: function (route: any, navigator: any, index: number, navState: any) {
return <Title route={route} />;
}
}

8
src/navigation/Routes.ts Normal file
View file

@ -0,0 +1,8 @@
import Main from '../views/main';
export default {
main: {
id: 'main',
component: Main
}
};

30
src/navigation/Title.tsx Normal file
View file

@ -0,0 +1,30 @@
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View,
} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
} as React.ViewStyle,
title: {
fontSize: 20,
textAlign: 'center',
color: '#FFF'
} as React.TextStyle
});
export default class Title extends Component<any, any> {
render() {
const title = this.props.route.title || 'zxcvbn';
return (
<View style={styles.container}>
<Text style={styles.title}>{ title }</Text>
</View>
);
}
}

View file

0
src/settings/styles.ts Normal file
View file

6
src/types/index.ts Normal file
View file

@ -0,0 +1,6 @@
// Define extra types to keep typescript happy!
declare module "react-native-vector-icons/FontAwesome" {
var noTypeInfoYet: any; // any var name here really
export = noTypeInfoYet;
}

33
src/views/main.tsx Normal file
View file

@ -0,0 +1,33 @@
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View
} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
} as React.ViewStyle,
text: {
fontSize: 20,
textAlign: 'center',
margin: 10,
} as React.TextStyle,
});
export default class App extends Component<any, any> {
render() {
return (
<View style={styles.container}>
<Text style={styles.text}>
Welcome to React Native!
</Text>
</View>
);
}
};

View file

@ -5,6 +5,7 @@
}, },
"globalDependencies": { "globalDependencies": {
"react": "registry:dt/react#0.14.0+20160829191040", "react": "registry:dt/react#0.14.0+20160829191040",
"react-native": "registry:dt/react-native#0.29.0+20160830141535" "react-native": "registry:dt/react-native#0.29.0+20160830141535",
"underscore": "registry:dt/underscore#1.8.3+20160908111004"
} }
} }