diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..71dbc86 --- /dev/null +++ b/.babelrc @@ -0,0 +1,8 @@ +{ + "presets": [ + "react-native" // this is required for debugging with react-native/packager/transformer + ], + "plugins": [], + "sourceMaps": true // must be true react-native/packager/transformer using with node-module-debug + // because of some bugs from vscode-node-debug & vscode-react-native, "sourceMaps" cannot be "inline" or "both" +} \ No newline at end of file diff --git a/android/app/build.gradle b/android/app/build.gradle index 5bc7d3e..c6b8175 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -82,6 +82,13 @@ def enableSeparateBuildPerCPUArchitecture = false */ def enableProguardInReleaseBuilds = false + +/** + * React Native Icons build-time support + * https://github.com/oblador/react-native-vector-icons + */ +apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" + android { compileSdkVersion 23 buildToolsVersion "23.0.1" @@ -129,6 +136,7 @@ dependencies { compile fileTree(dir: "libs", include: ["*.jar"]) compile "com.android.support:appcompat-v7:23.0.1" compile "com.facebook.react:react-native:+" // From node_modules + compile project(':react-native-vector-icons') // From node_modules } // Run this once to be able to run the application with BUCK diff --git a/android/app/src/main/java/com/aretherecookies/MainApplication.java b/android/app/src/main/java/com/aretherecookies/MainApplication.java index 3c93cc8..ab661ff 100644 --- a/android/app/src/main/java/com/aretherecookies/MainApplication.java +++ b/android/app/src/main/java/com/aretherecookies/MainApplication.java @@ -13,6 +13,8 @@ import com.facebook.soloader.SoLoader; import java.util.Arrays; import java.util.List; +import com.oblador.vectoricons.VectorIconsPackage; + public class MainApplication extends Application implements ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { @@ -24,7 +26,8 @@ public class MainApplication extends Application implements ReactApplication { @Override protected List getPackages() { return Arrays.asList( - new MainReactPackage() + new MainReactPackage(), + new VectorIconsPackage() ); } }; diff --git a/android/settings.gradle b/android/settings.gradle index f3e27d6..eeaf547 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,3 +1,7 @@ rootProject.name = 'AreThereCookies' include ':app' + +include ':react-native-vector-icons' + +project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') \ No newline at end of file diff --git a/index.android.js b/index.android.js index 2301ec6..f5e9a29 100644 --- a/index.android.js +++ b/index.android.js @@ -5,39 +5,28 @@ */ import React, { Component } from "react"; -import { AppRegistry, StyleSheet, Text, View, Navigator } from "react-native"; +import { AppRegistry, Navigator, Text, View } from "react-native"; +import TopBar from "./js/components/top_bar"; -class WelcomeView extends Component { - props: { title: string }; - - render() { - return ( - - - {this.props.title} - - - ); - } -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: "center", - alignItems: "center", - backgroundColor: "#F5FCFF" - }, - welcome: { fontSize: 20, textAlign: "center", margin: 10 }, - instructions: { textAlign: "center", color: "#333333", marginBottom: 5 } -}); +const appContainerStyle = { + flex: 1, + flexDirection: "column", + backgroundColor: "white" +}; export default class AreThereCookies extends Component { render() { return ( } + renderScene={(route, navigator) => ( + + + + Scene content will go here... + + + )} /> ); } diff --git a/js/components/top_bar.js b/js/components/top_bar.js new file mode 100644 index 0000000..546a550 --- /dev/null +++ b/js/components/top_bar.js @@ -0,0 +1,35 @@ +//@flow +import React, { Component } from "react"; +import { Text, View } from "react-native"; +import EntypoIcon from "react-native-vector-icons/Entypo"; + +const barStyle = { + flexDirection: "row", + height: 50, + backgroundColor: "whitesmoke" +}; + +const titleTextStyle = { + flex: 3, + textAlign: "center", + fontSize: 18, + height: 50, + textAlignVertical: "center", + fontFamily: "sans-serif", + fontWeight: "bold" +}; + +export default class TopBar extends Component { + props: { active: boolean, title: string, toggleMenu: Function }; + render() { + return ( + + + + Are There Cookies? + + + + ); + } +} diff --git a/package.json b/package.json index c6c442e..ddc7246 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,8 @@ }, "dependencies": { "react": "^15.4.2", - "react-native": "^0.40.0" + "react-native": "^0.40.0", + "react-native-vector-icons": "^4.0.0" }, "devDependencies": { "babel-eslint": "^7.1.1", diff --git a/yarn.lock b/yarn.lock index 75ece3d..1955a34 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3424,6 +3424,13 @@ react-deep-force-update@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.0.1.tgz#f911b5be1d2a6fe387507dd6e9a767aa2924b4c7" +react-native-vector-icons@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.0.0.tgz#6a2f8f4c6ace613aed7748cd530809283e5b1538" + dependencies: + lodash "^4.0.0" + yargs "^6.3.0" + react-native@^0.40.0: version "0.40.0" resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.40.0.tgz#ca7b86a8e8fbc7653634ad47ca2ffd69fdf18ad5"