den/index.ios.js at master · react-native-dev/den · GitHub

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
73
'use strict';

var React = require('react-native');
var {
	AppRegistry,
	StyleSheet,
	Text,
	View,
	NavigatorIOS,
	TabBarIOS,
	PixelRatio,
} = React;

var Dimensions = require('Dimensions');
var {width, height} = Dimensions.get('window');

var ScreenNavigator = require('./ScreenNavigator.js');

var SearchScreen = require('./SearchScreen.js');
var SavedScreen = require('./SavedScreen.js');
var TabBarButton = require('./components/TabBarButton.js');

var globalVariables = require('./globalVariables.js');

var Den = React.createClass({

	getInitialState: function() {
		return {
			tab: 'search',
		};
	},

	render: function() {
		var screenElement;

		if (this.state.tab == 'saved') screenElement = (<ScreenNavigator title='Saved' component={SavedScreen} key='saved' />);
		else screenElement = (<ScreenNavigator title='Search' component={SearchScreen} key='search' />);

		return (
			<View style={styles.app}>
				{screenElement}
				<View style={styles.tabbar}>
					<TabBarButton tab='search' label='Homes' selected={this.state.tab} onChange={this.handleSelect} />
					<TabBarButton tab='saved' label='Saved' selected={this.state.tab} onChange={this.handleSelect} />
				</View>
			</View>
		);
	},


	handleSelect: function(tab) {
		this.setState({
			tab: tab,
		});
	},
});

var styles = StyleSheet.create({
	app: { width, height },

	tabbar: {
		width: width,
		height: 49,
		shadowColor: 'black',
 		shadowOffset: { height: -2, width: 0 },
 		shadowOpacity: 0.05,
 		shadowRadius: 3,
		flexDirection: 'row',
		justifyContent: 'center'
	}
});

AppRegistry.registerComponent('Den', () => Den);