Skip to content

Instantly share code, notes, and snippets.

View ridgeO's full-sized avatar

Ridge ridgeO

2 followers · 1 following
View GitHub Profile
@ridgeO
ridgeO / createNestedNavStack.js
Created May 30, 2017 05:08
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
const NestedNav = StackNavigator(
{
Landing: { screen: GreenScreen },
Drawer: { screen: DrawerNavigator() }
},
{ headerMode: 'none' }
)
@ridgeO
ridgeO / addDrawerOpenButtons.js
Created May 30, 2017 04:54
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
class GreenScreen extends Component {
render() {
return(
....
<TouchableHighlight
style={styles.button}
onPress={() => this.props.navigation.navigate('DrawerOpen')}
@ridgeO
ridgeO / addDrawerNavToApp.js
Created May 30, 2017 04:44
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
class ReactNav extends Component {
render() {
return (
<DrawerNav/>
);
}
}
@ridgeO
ridgeO / createDrawerNav.js
Created May 30, 2017 04:43
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
const DrawerNav = DrawerNavigator({
Green: { screen: GreenScreen },
Red: { screen: RedScreen },
Blue: { screen: BlueScreen },
Purple: { screen: PurpleScreen }
})
...
@ridgeO
ridgeO / importDrawerNavigator.js
Created May 30, 2017 04:42
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
import { StackNavigator, TabNavigator, DrawerNavigator } from 'react-navigation';
...
@ridgeO
ridgeO / addTabNavToApp.js
Created May 30, 2017 04:35
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
class ReactNav extends Component {
render() {
return (
<TabNav/>
);
}
}
@ridgeO
ridgeO / createTabNav.js
Created May 30, 2017 04:32
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
const TabNav = TabNavigator(
{
Green: { screen: GreenScreen },
Red: { screen: RedScreen },
Blue: { screen: BlueScreen },
Purple: { screen: PurpleScreen }
},
@ridgeO
ridgeO / importTabNavigator.js
Created May 30, 2017 04:30
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
import { StackNavigator, TabNavigator } from 'react-navigation';
...
@ridgeO
ridgeO / importButton.js
Created May 30, 2017 04:22
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
import {
...
Button
} from 'react-native';
...
@ridgeO
ridgeO / redScreenNavOptions.js
Last active May 30, 2017 05:35
Code snippet from ReactNav application as featured in http://platypus.is/posts/4
# App.js
...
RedScreen.navigationOptions = props => {
const { navigation } = props;
return {
headerTitle: 'Red',
headerRight: (<Button title='Purple' onPress={() => navigation.navigate('Purple')}/>),
headerLeft: (<Button title='Blue' onPress={() => navigation.navigate('Blue')}/>)
}