Add Implementation Example

[alejomendoza]

Hi James,

So I tried implementing the tab bar very similar to how it is explained on https://facebook.github.io/react-native/docs/tabbarios.html#content but I get errors. I enabled the babel options. An example of how to implement this component would be sweet. I tried the following code:

render(){
        return(
            <View style={styles.appContainer}>
                <TabBar selectedTab={this.state.selectedTab} barTintColor="rgba(74,74,74,0.8)" tintColor="white" >
                    <TabBar.Item
                        selected={this.state.selectedTab === 'home'}
                        icon={require('image!home-tab-icon-white')}
                        onPress={()=>{
                        this.setState({
                        selectedTab:'home'
                    });
                    }} style={styles.tab}>
                        <Home/>
                    </TabBar.Item>
                    <TabBar.Item
                        selected={this.state.selectedTab === 'search'}
                        icon={require('image!search-tab-icon-white')}
                        onPress={()=>{
                        this.setState({
                            selectedTab:'search'
                        });
                    }} style={styles.tab}>
                        <Search/>
                    </TabBar.Item>
                    <TabBar.Item
                        selected={this.state.selectedTab === 'lists'}
                        icon={require('image!profile-tab-icon-white')}
                        style={styles.tab}>
                        <Lists />
                    </TabBar.Item>
                    <TabBar.Item
                        selected={this.state.selectedTab === 'profile'}
                        icon={require('image!profile-tab-icon-white')}
                        onPress={()=>{
                        this.setState({
                            selectedTab:'profile'
                        });
                    }} style={styles.tab}>
                        <Profile/>
                    </TabBar.Item>
                    <TabBar.Item
                        selected={this.state.selectedTab === 'settings'}
                        icon={require('image!settings-tab-icon-white')}
                        onPress={()=>{
                        this.setState({
                            selectedTab:'settings'
                        });
                    }} style={styles.tab}>
                        <Settings/>
                    </TabBar.Item>
                </TabBar>
            </View>
        )
    }

Thank you!

[alejomendoza]

Any news on this one? @ide @brentvatne

[alejomendoza]

Sweet!!!! :smiley: you are the best!