From 5499c1b680fc5dd3fb7e9c1252f5f5d8bc287fdd Mon Sep 17 00:00:00 2001 From: Jake Howard Date: Sat, 17 Sep 2016 14:40:54 +0100 Subject: [PATCH] setup basic navigation --- .gitignore | 1 + Makefile | 5 +- android/app/build.gradle | 1 + .../main/java/com/zxcvbn/MainActivity.java | 1 + android/app/src/main/res/values/strings.xml | 1 + android/settings.gradle | 2 + ios/zxcvbn.xcodeproj/project.pbxproj | 61 +++++++++- ios/zxcvbn/Info.plist | 112 ++++++++++-------- package.json | 3 +- src/index.tsx | 79 ++++++------ src/navigation/BackButton.tsx | 44 +++++++ src/navigation/InfoButton.tsx | 39 ++++++ src/navigation/RouteMapper.tsx | 29 +++++ src/navigation/Routes.ts | 8 ++ src/navigation/Title.tsx | 30 +++++ src/settings/constants.ts | 0 src/settings/styles.ts | 0 src/types/index.ts | 6 + src/views/main.tsx | 33 ++++++ typings.json | 3 +- 20 files changed, 364 insertions(+), 94 deletions(-) create mode 100644 src/navigation/BackButton.tsx create mode 100644 src/navigation/InfoButton.tsx create mode 100644 src/navigation/RouteMapper.tsx create mode 100644 src/navigation/Routes.ts create mode 100644 src/navigation/Title.tsx create mode 100644 src/settings/constants.ts create mode 100644 src/settings/styles.ts create mode 100644 src/types/index.ts create mode 100644 src/views/main.tsx diff --git a/.gitignore b/.gitignore index 99a8402..7c23496 100644 --- a/.gitignore +++ b/.gitignore @@ -42,3 +42,4 @@ android/keystores/debug.keystore dist/ typings/ +android/app/src/main/assets/ diff --git a/Makefile b/Makefile index 0248cb3..9c08ed7 100644 --- a/Makefile +++ b/Makefile @@ -1,8 +1,7 @@ - +NODE=$(PWD)/node_modules/.bin build: - rm -rf dist/ - tsc + $(NODE)/tsc install: node_modules typings diff --git a/android/app/build.gradle b/android/app/build.gradle index 5820fc1..302eb0e 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -126,6 +126,7 @@ android { } dependencies { + compile project(':react-native-vector-icons') compile fileTree(dir: "libs", include: ["*.jar"]) compile "com.android.support:appcompat-v7:23.0.1" compile "com.facebook.react:react-native:+" // From node_modules diff --git a/android/app/src/main/java/com/zxcvbn/MainActivity.java b/android/app/src/main/java/com/zxcvbn/MainActivity.java index d976be3..116f309 100644 --- a/android/app/src/main/java/com/zxcvbn/MainActivity.java +++ b/android/app/src/main/java/com/zxcvbn/MainActivity.java @@ -1,6 +1,7 @@ package com.zxcvbn; import com.facebook.react.ReactActivity; +import com.oblador.vectoricons.VectorIconsPackage; public class MainActivity extends ReactActivity { diff --git a/android/app/src/main/res/values/strings.xml b/android/app/src/main/res/values/strings.xml index 4c4cfcd..cbb9931 100644 --- a/android/app/src/main/res/values/strings.xml +++ b/android/app/src/main/res/values/strings.xml @@ -1,3 +1,4 @@ + zxcvbn diff --git a/android/settings.gradle b/android/settings.gradle index babeeb9..6c095ea 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,3 +1,5 @@ rootProject.name = 'zxcvbn' include ':app' +include ':react-native-vector-icons' +project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') diff --git a/ios/zxcvbn.xcodeproj/project.pbxproj b/ios/zxcvbn.xcodeproj/project.pbxproj index 3dd5306..7a50b5d 100644 --- a/ios/zxcvbn.xcodeproj/project.pbxproj +++ b/ios/zxcvbn.xcodeproj/project.pbxproj @@ -5,7 +5,6 @@ }; objectVersion = 46; objects = { - /* Begin PBXBuildFile section */ 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.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 */; }; 146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.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 */ /* 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 = ""; }; 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = ""; }; 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/Libraries/Text/RCTText.xcodeproj; sourceTree = ""; }; + D87070575A5C440E9BB53EFC /* RNVectorIcons.xcodeproj */ = {isa = PBXFileReference; name = "RNVectorIcons.xcodeproj"; path = "../node_modules/react-native-vector-icons/RNVectorIcons.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; + D89C9404F60344A99A1C4BE6 /* libRNVectorIcons.a */ = {isa = PBXFileReference; name = "libRNVectorIcons.a"; path = "libRNVectorIcons.a"; sourceTree = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; }; /* End PBXFileReference section */ /* Begin PBXFrameworksBuildPhase section */ @@ -152,6 +170,7 @@ 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */, 00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */, 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */, + AC837CB69F9B4D1AB280198D /* libRNVectorIcons.a in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -274,6 +293,7 @@ 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */, 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */, 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */, + D87070575A5C440E9BB53EFC /* RNVectorIcons.xcodeproj */, ); name = Libraries; sourceTree = ""; @@ -293,6 +313,7 @@ 832341AE1AAA6A7D00B99B32 /* Libraries */, 00E356EF1AD99517003FC87E /* zxcvbnTests */, 83CBBA001A601CBA00E9B192 /* Products */, + 4685DB9781F94227B1E5E3F0 /* Resources */, ); indentWidth = 2; sourceTree = ""; @@ -307,6 +328,22 @@ name = Products; sourceTree = ""; }; + 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 = ""; + }; /* End PBXGroup section */ /* Begin PBXNativeTarget section */ @@ -352,7 +389,7 @@ 83CBB9F71A601CBA00E9B192 /* Project object */ = { isa = PBXProject; attributes = { - LastUpgradeCheck = 0610; + LastUpgradeCheck = 610; ORGANIZATIONNAME = Facebook; TargetAttributes = { 00E356ED1AD99517003FC87E = { @@ -509,6 +546,14 @@ files = ( 13B07FBF1A68108700A75B9A /* Images.xcassets 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; }; @@ -586,6 +631,10 @@ LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; PRODUCT_NAME = "$(TARGET_NAME)"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn"; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); }; name = Debug; }; @@ -599,6 +648,10 @@ LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; PRODUCT_NAME = "$(TARGET_NAME)"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/zxcvbn.app/zxcvbn"; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); }; name = Release; }; @@ -611,6 +664,7 @@ "$(inherited)", /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, "$(SRCROOT)/../node_modules/react-native/React/**", + "$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager", ); INFOPLIST_FILE = "zxcvbn/Info.plist"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; @@ -631,6 +685,7 @@ "$(inherited)", /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, "$(SRCROOT)/../node_modules/react-native/React/**", + "$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager", ); INFOPLIST_FILE = "zxcvbn/Info.plist"; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; @@ -681,6 +736,7 @@ "$(inherited)", /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, "$(SRCROOT)/../node_modules/react-native/React/**", + "$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager", ); IPHONEOS_DEPLOYMENT_TARGET = 7.0; MTL_ENABLE_DEBUG_INFO = YES; @@ -721,6 +777,7 @@ "$(inherited)", /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include, "$(SRCROOT)/../node_modules/react-native/React/**", + "$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager", ); IPHONEOS_DEPLOYMENT_TARGET = 7.0; MTL_ENABLE_DEBUG_INFO = NO; diff --git a/ios/zxcvbn/Info.plist b/ios/zxcvbn/Info.plist index e98ebb0..df50cd2 100644 --- a/ios/zxcvbn/Info.plist +++ b/ios/zxcvbn/Info.plist @@ -1,54 +1,64 @@ - - CFBundleDevelopmentRegion - en - CFBundleExecutable - $(EXECUTABLE_NAME) - CFBundleIdentifier - org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) - CFBundleInfoDictionaryVersion - 6.0 - CFBundleName - $(PRODUCT_NAME) - CFBundlePackageType - APPL - CFBundleShortVersionString - 1.0 - CFBundleSignature - ???? - CFBundleVersion - 1 - LSRequiresIPhoneOS - - UILaunchStoryboardName - LaunchScreen - UIRequiredDeviceCapabilities - - armv7 - - UISupportedInterfaceOrientations - - UIInterfaceOrientationPortrait - UIInterfaceOrientationLandscapeLeft - UIInterfaceOrientationLandscapeRight - - UIViewControllerBasedStatusBarAppearance - - NSLocationWhenInUseUsageDescription - - NSAppTransportSecurity - - - NSExceptionDomains - - localhost - - NSTemporaryExceptionAllowsInsecureHTTPLoads - - - - - - + + CFBundleDevelopmentRegion + en + CFBundleExecutable + $(EXECUTABLE_NAME) + CFBundleIdentifier + org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) + CFBundleInfoDictionaryVersion + 6.0 + CFBundleName + $(PRODUCT_NAME) + CFBundlePackageType + APPL + CFBundleShortVersionString + 1.0 + CFBundleSignature + ???? + CFBundleVersion + 1 + LSRequiresIPhoneOS + + UILaunchStoryboardName + LaunchScreen + UIRequiredDeviceCapabilities + + armv7 + + UISupportedInterfaceOrientations + + UIInterfaceOrientationPortrait + UIInterfaceOrientationLandscapeLeft + UIInterfaceOrientationLandscapeRight + + UIViewControllerBasedStatusBarAppearance + + NSLocationWhenInUseUsageDescription + + NSAppTransportSecurity + + NSExceptionDomains + + localhost + + NSTemporaryExceptionAllowsInsecureHTTPLoads + + + + + UIAppFonts + + Entypo.ttf + EvilIcons.ttf + FontAwesome.ttf + Foundation.ttf + Ionicons.ttf + MaterialIcons.ttf + Octicons.ttf + Zocial.ttf + + + \ No newline at end of file diff --git a/package.json b/package.json index ade63ae..9479744 100644 --- a/package.json +++ b/package.json @@ -4,13 +4,14 @@ "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", - "build": "rm -rf dist && tsc" + "link": "rnpm link" }, "dependencies": { "immutable": "=3.8.1", "react": "=15.3.1", "react-native": "=0.33.0", "react-native-progress-bar": "=0.1.2", + "react-native-vector-icons": "=2.1.0", "underscore": "=1.8.3", "zxcvbn": "=4.3.0" }, diff --git a/src/index.tsx b/src/index.tsx index 28f0368..b62f4fc 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,43 +1,50 @@ -// src/index.ts - import React, { Component } from 'react'; import { - StyleSheet, - Text, - View + Text, + View, + Navigator, + StyleSheet } from 'react-native'; +import Routes from './navigation/Routes'; +import RouteMapper from './navigation/RouteMapper'; +import './types'; -interface Props { - -} - -interface State { - -} - -export default class App extends Component { - render() { - return ( - - - Welcome to 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, + wrapper: { + flex: 1 + } as React.ViewStyle, + navbar: { + flexDirection: 'row', + justifyContent: 'center', + backgroundColor: '#888' + } as React.ViewStyle }); + +export default class App extends Component { + renderScene(route: any, nav : any) { + const Component = route.component; + const props = route.props || {}; + return ( + + ); + } + + render() { + return ( + + + } /> + + ); + } +} diff --git a/src/navigation/BackButton.tsx b/src/navigation/BackButton.tsx new file mode 100644 index 0000000..2724a47 --- /dev/null +++ b/src/navigation/BackButton.tsx @@ -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 { + goBack() { + this.props.nav.pop(); + } + + render() { + return ( + + + + + + ); + } +} diff --git a/src/navigation/InfoButton.tsx b/src/navigation/InfoButton.tsx new file mode 100644 index 0000000..c75e4c4 --- /dev/null +++ b/src/navigation/InfoButton.tsx @@ -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 { + render() { + return ( + + null}> + + + + ); + } +} diff --git a/src/navigation/RouteMapper.tsx b/src/navigation/RouteMapper.tsx new file mode 100644 index 0000000..bd80586 --- /dev/null +++ b/src/navigation/RouteMapper.tsx @@ -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 ( + + ); + } + return ; + }, + + RightButton: function (route: any, navigator: any, index: number, navState: any) { + return ; + }, + + Title: function (route: any, navigator: any, index: number, navState: any) { + return ; + } +} diff --git a/src/navigation/Routes.ts b/src/navigation/Routes.ts new file mode 100644 index 0000000..339419f --- /dev/null +++ b/src/navigation/Routes.ts @@ -0,0 +1,8 @@ +import Main from '../views/main'; + +export default { + main: { + id: 'main', + component: Main + } +}; diff --git a/src/navigation/Title.tsx b/src/navigation/Title.tsx new file mode 100644 index 0000000..f3c3d2a --- /dev/null +++ b/src/navigation/Title.tsx @@ -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> + ); + } +} diff --git a/src/settings/constants.ts b/src/settings/constants.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/settings/styles.ts b/src/settings/styles.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/types/index.ts b/src/types/index.ts new file mode 100644 index 0000000..7f1c6d5 --- /dev/null +++ b/src/types/index.ts @@ -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; +} diff --git a/src/views/main.tsx b/src/views/main.tsx new file mode 100644 index 0000000..3e1dffd --- /dev/null +++ b/src/views/main.tsx @@ -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> + ); + } +}; diff --git a/typings.json b/typings.json index 2c63e04..2e83b1a 100644 --- a/typings.json +++ b/typings.json @@ -5,6 +5,7 @@ }, "globalDependencies": { "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" } }