Commit 089a2f8c authored by Gunasekara M.A.L.M's avatar Gunasekara M.A.L.M

implement routing

parent f6bf28f0
......@@ -6,112 +6,158 @@
* @flow strict-local
*/
import React from 'react';
import type {Node} from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
StyleSheet,
Text,
useColorScheme,
View,
} from 'react-native';
import {
Colors,
DebugInstructions,
Header,
LearnMoreLinks,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
/* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's
* LTI update could not be added via codemod */
const Section = ({children, title}): Node => {
const isDarkMode = useColorScheme() === 'dark';
return (
<View style={styles.sectionContainer}>
<Text
style={[
styles.sectionTitle,
{
color: isDarkMode ? Colors.white : Colors.black,
},
]}>
{title}
</Text>
<Text
style={[
styles.sectionDescription,
{
color: isDarkMode ? Colors.light : Colors.dark,
},
]}>
{children}
</Text>
</View>
);
};
const App: () => Node = () => {
const isDarkMode = useColorScheme() === 'dark';
const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
};
return (
<SafeAreaView style={backgroundStyle}>
<StatusBar
barStyle={isDarkMode ? 'light-content' : 'dark-content'}
backgroundColor={backgroundStyle.backgroundColor}
/>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<Header />
<View
style={{
backgroundColor: isDarkMode ? Colors.black : Colors.white,
}}>
<Section title="Step One">
Edit <Text style={styles.highlight}>App.js</Text> to change this
screen and then come back to see your edits.
</Section>
<Section title="See Your Changes">
<ReloadInstructions />
</Section>
<Section title="Debug">
<DebugInstructions />
</Section>
<Section title="Learn More">
Read the docs to discover what to do next:
</Section>
<LearnMoreLinks />
</View>
</ScrollView>
</SafeAreaView>
);
};
const styles = StyleSheet.create({
sectionContainer: {
marginTop: 32,
paddingHorizontal: 24,
},
sectionTitle: {
fontSize: 24,
fontWeight: '600',
},
sectionDescription: {
marginTop: 8,
fontSize: 18,
fontWeight: '400',
},
highlight: {
fontWeight: '700',
},
});
export default App;
import React from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
StyleSheet,
Text,
useColorScheme,
View,
} from 'react-native';
import {
Colors,
DebugInstructions,
Header,
LearnMoreLinks,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
import { Stack, Router, Scene, ActionConst } from 'react-native-router-flux';
import { widthPercentageToDP as wp, heightPercentageToDP as hp } from 'react-native-responsive-screen';
import SplashScreen from './src/screen/splash_screen/splashscreen';
import HomeScreen from './src/screen/home_screen/homescreen';
import BusListScreen from './src/screen/bus_list_screen/buslistscreen';
import MapScreen from './src/screen/map_screen/mapscreen';
import BusRoteScreen from './src/screen/bus_route_screen/busroutescreen';
const App = () => {
const isDarkMode = useColorScheme() === 'dark';
const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
};
return (
<Router>
<Stack key="root" headerLayoutPreset="center">
<Scene
key="splash"
type="replace"
component={SplashScreen}
initial
hideNavBar={true}
/>
<Scene
key="authenticated"
type="replace"
renderTitle={() => (
<View style={styles.navBarStyles}>
<View style={styles.app_logs_holder}>
{/* <Image source={{ uri: 'tabbar_icon' }} style={styles.app_logs} /> */}
</View>
</View>
)}
//hideNavBar={true}
panHandlers={null}
>
<Scene
key="dashbord"
title="Select Route And Bus off"
component={HomeScreen}
renderTitle={() => (
<View style={styles.navBarStyles}>
<View style={styles.app_logs_holder}>
{/* <Image source={{ uri: 'tabbar_icon' }} style={styles.app_logs} /> */}
<Text style={{ color: '#000' }}>Select Route And Bus off</Text>
</View>
</View>
)}
hideNavBar={true}
initial
/>
<Scene
key="busRoute"
title="Bus Details"
component={BusRoteScreen}
// renderTitle={() => (
// <View style={styles.navBarStyles}>
// <View style={styles.app_logs_holder}>
// {/* <Image source={{ uri: 'tabbar_icon' }} style={styles.app_logs} /> */}
// </View>
// </View>
// )}
hideNavBar={true}
/>
<Scene
key="busList"
title="Bus Details"
component={BusListScreen}
// renderTitle={() => (
// <View style={styles.navBarStyles}>
// <View style={styles.app_logs_holder}>
// {/* <Image source={{ uri: 'tabbar_icon' }} style={styles.app_logs} /> */}
// </View>
// </View>
// )}
hideNavBar={true}
/>
<Scene
key="mapScreen"
title="View On Map"
component={MapScreen}
// renderTitle={() => (
// <View style={styles.navBarStyles}>
// <View style={styles.app_logs_holder}>
// {/* <Image source={{ uri: 'tabbar_icon' }} style={styles.app_logs} /> */}
// </View>
// </View>
// )}
hideNavBar={true}
/>
</Scene>
</Stack>
</Router>
);
};
const styles = StyleSheet.create({
sectionContainer: {
marginTop: 32,
paddingHorizontal: 24,
},
sectionTitle: {
fontSize: 24,
fontWeight: '600',
},
sectionDescription: {
marginTop: 8,
fontSize: 18,
fontWeight: '400',
},
highlight: {
fontWeight: '700',
},
navBarStyles: {
width: "100%", //wp('100%')
height: hp('7.5%'),
alignItems: 'center',
justifyContent: 'center',
},
app_logs_holder: {
width: wp('10%'),
height: hp('5%'),
alignContent: 'center',
alignItems: 'center',
},
});
export default App;
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment