diff --git a/components/Header.js b/components/Header.js index 265dd1a..79e8574 100644 --- a/components/Header.js +++ b/components/Header.js @@ -60,16 +60,8 @@ const styles = StyleSheet.create({ header: { flex: 1, flexDirection: "row", - justifyContent: "space-between" - }, - left: { - top: 40 - }, - middle: { - top: 40 - }, - right: { - top: 40 + justifyContent: "space-between", + alignItems: "center" }, textRight: { color: "#efefef", diff --git a/index.android.js b/index.android.js index 487ed6c..3d90441 100644 --- a/index.android.js +++ b/index.android.js @@ -1,53 +1,47 @@ /** - * Sample React Native App - * https://github.com/facebook/react-native - * @flow + * React Native Redux Example + * https://github.com/aaronvb/react-native-redux-example */ -import React, { Component } from 'react'; -import { - AppRegistry, - StyleSheet, - Text, - View -} from 'react-native'; +import React, { Component } from "react"; +import { Provider } from "react-redux"; +import { applyMiddleware, createStore } from "redux"; +import logger from "redux-logger"; +import { AppRegistry, StyleSheet, View, StatusBar } from "react-native"; + +import itemApp from "./reducers"; +import Header from "./components/Header"; +import ItemList from "./components/ItemList"; + +// Create store with logger. +// Use Cmd + D to open developer menu to start debugger +const store = createStore(itemApp, applyMiddleware(logger)); + +class ReduxExample extends Component { + componentDidMount() { + // Set status bar text to white + StatusBar.setHidden(false); + StatusBar.setBarStyle("light-content"); + } -export default class ReduxExample extends Component { render() { return ( - - - Welcome to React Native! - - - To get started, edit index.android.js - - - Double tap R on your keyboard to reload,{'\n'} - Shake or press menu button for dev menu - - + + +
+ + + ); } } 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, - }, + flex: 1 + } }); -AppRegistry.registerComponent('ReduxExample', () => ReduxExample); +export default ReduxExample; + +AppRegistry.registerComponent("ReduxExample", () => ReduxExample);