Skip to content

Instantly share code, notes, and snippets.

@khalid32
Last active June 19, 2017 18:34
Show Gist options
  • Select an option

  • Save khalid32/69d1860a3f935ad920c4a7ba23f813c5 to your computer and use it in GitHub Desktop.

Select an option

Save khalid32/69d1860a3f935ad920c4a7ba23f813c5 to your computer and use it in GitHub Desktop.
new native based react-navigation component for smooth navigation....
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, View, Button } from 'react-native';
import { TabNavigator } from 'react-navigation';
class HomeScreen extends React.Component {
render() {
return (
<View style={styles.container}>
<View style={[styles.adjust, {flex: 2, backgroundColor: '#68bc43'}]}>
<Text>Hello, Navigation!</Text>
</View>
</View>
);
}
}
class ChatScreen extends React.Component {
render() {
return (
<View style={styles.container}>
<View style={[styles.adjust, {flex: 2, backgroundColor: '#c1bf38'}]}>
<Text>Chat with Noone!</Text>
</View>
</View>
);
}
}
const SelfNavigator = TabNavigator({
Home: { screen: HomeScreen },
Chat: { screen: ChatScreen },
});
const styles = StyleSheet.create({
container:{
flex: 1,
},
adjust: {
justifyContent: 'center',
alignItems: 'center',
}
});
AppRegistry.registerComponent('SelfNavigator', () => SelfNavigator);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment