Skip to content

Instantly share code, notes, and snippets.

streetsmartdev

View GitHub Profile
View RN-HL-3-HorizontalFlatList.js
import React, { Component } from "react";
import { FlatList, Text } from "react-native";
import { Card } from "react-native-elements";
const data = [
{
imageUrl: "http://via.placeholder.com/160x160",
title: "something"
},
{
View RN-HL-2-FlatList.js
import React, { Component } from "react";
import { FlatList, Text } from "react-native";
import { Card } from "react-native-elements";
const data = [
{
imageUrl: "http://via.placeholder.com/160x160",
title: "something"
},
{
View RN-HL-1-Card.js
import React, { Component } from "react";
import { Text } from "react-native";
import { Card } from "react-native-elements";
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
data: data
};
@streetsmartdev
streetsmartdev / RN-RNav-10-RootNavigatorUpdate.js
Created Sep 3, 2017
RN-RNav - 10 - Updating RootNavigator
View RN-RNav-10-RootNavigatorUpdate.js
import React from "react";
import {StackNavigator} from "react-navigation";
import LoginScreen from "./external/Login";
import Internal from "./internal";
export default StackNavigator(
{
External: {screen: LoginScreen},
Internal: {screen: Internal}
},
View RN-RNav-9-ResetOnLogin.js
...
import {NavigationActions} from "react-navigation";
class LoginScreen extends React.Component {
render() {
const reset = NavigationActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: "Internal" })]
});
return (
@streetsmartdev
streetsmartdev / RN-RNav-8-NavigationHelper.js
Created Sep 3, 2017
RN-RNav- 8 - Implement navigationOptions and call them in individual screens
View RN-RNav-8-NavigationHelper.js
// NavigationHelper.js -----------------------------------------------
import React from "react";
import {Platform} from "react-native";
import {Ionicons} from '@expo/vector-icons';
export const getNavigationOption = (title, icon) => ({
title,
...Platform.select({
ios: {
tabBarIcon: ({tintColor}) => (
@streetsmartdev
streetsmartdev / RN-RNav-7-DrawerNavigator.js
Created Sep 3, 2017
RN-RNav- 7 - Implementing DrawerNavigator for Android
View RN-RNav-7-DrawerNavigator.js
import React from "react";
import {Text, TouchableOpacity} from "react-native";
import {DrawerNavigator} from "react-navigation";
import HomeScreen from "./Home";
import AboutScreen from "./About";
import {Ionicons} from '@expo/vector-icons';
const Internal = DrawerNavigator(
{
Home: {screen: HomeScreen},
@streetsmartdev
streetsmartdev / RN-Rnav-6-TabNavigator.js
Created Sep 2, 2017
RN-Rnav- 6 - index for iOS implementing TabNavigator
View RN-Rnav-6-TabNavigator.js
import React from "react";
import {TabNavigator} from "react-navigation";
import HomeScreen from "./Home";
import AboutScreen from "./About";
export default TabNavigator(
{
Home: {screen: HomeScreen},
About: {screen: AboutScreen}
},
@streetsmartdev
streetsmartdev / RN-RNav-5-AboutScreen.js
Created Sep 2, 2017
RN-RNav- 5 - AboutScreen implementation
View RN-RNav-5-AboutScreen.js
import React from "react";
import {StyleSheet, Text, View} from "react-native";
class AboutScreen extends React.Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.title}>React navigator - About</Text>
</View>
);
@streetsmartdev
streetsmartdev / RN-Rnav-4-App.js
Created Sep 2, 2017
RN-Rnav- 4 - Updating App.js to reflect our changes
View RN-Rnav-4-App.js
import React from "react";
import RootNavigator from "./src/routes/RootNavigator";
export default class App extends React.Component {
render() {
return <RootNavigator />;
}
}
You can’t perform that action at this time.