-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
72 lines (71 loc) · 2.54 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
import React from 'react';
import { StyleSheet} from 'react-native';
import {Container, Header, Tab, Tabs, ScrollableTab,Left,Body,Title,Right,Subtitle} from 'native-base';
import * as Font from 'expo-font';
import { Ionicons } from '@expo/vector-icons';
import General from './Screens/General';
import Technology from './Screens/Technology';
import Business from './Screens/Business';
import Sports from './Screens/Sports';
import TechCrunch from './Screens/TechCrunch';
import About from './Screens/About';
export default class App extends React.Component{
state = {
fontLoaded: false,
}
async componentDidMount() {
await Font.loadAsync({
'Roboto': require('native-base/Fonts/Roboto.ttf'),
'Roboto_medium': require('native-base/Fonts/Roboto_medium.ttf'),
...Ionicons.font,
});
this.setState({fontLoaded:true})
}
render(){
return(
<Container>
{ this.state.fontLoaded ? (
<Container>
<Header hasTabs style={{backgroundColor:'#004D40'}} span>
<Left/>
<Body>
<Title style={{textAlign:'center',marginLeft:70,marginTop:30}}>NewsGo</Title>
</Body>
<Right>
</Right>
</Header>
<Tabs renderTabBar={()=> <ScrollableTab />}>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="General">
<General />
</Tab>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="Technology">
<Technology />
</Tab>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="Business">
<Business />
</Tab>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="Sports">
<Sports />
</Tab>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="TechCrunch">
<TechCrunch />
</Tab>
<Tab tabStyle={{backgroundColor:'#004D40'}} activeTabStyle={{backgroundColor:'#004D40'}} heading="About">
<About />
</Tab>
</Tabs>
</Container>
):null
}
</Container>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});