gistfile1.js

var yolo = React.createClass({
 
  _renderContentWithNavigation(component, title, rightButtonTitle) {
    return (
      <Navigator
        style={styles.yoloContainer}
        renderScene={this.renderScene}
        initialRoute={{
          title: 'YOLO',
          component: component,
          rightButtonTitle: rightButtonTitle,
          onRightButtonPress: rightButtonPressed,
          navigationBar: <NavigationBar customeTitle={<Logo/>}/>
        }}
        tintColor='#008888' />
    );
  },
  renderScene(route, navigator) {
    var Component = route.component;
    var navBar = route.navigationBar;

    if (navBar) {
      navBar = React.addons.cloneWithProps(navBar, { navigator, route });
    }

    return (
      <View style={styles.navigator}>
        {navBar}
        <Component navigator={navigator} route={route} />
      </View>
    );
  },
  render() {
      // <View style={{flex: 0, height: require('Dimensions').get('window').height}}>
    return (
      <SMXTabBarIOS>
        <SMXTabBarItemIOS
          title='Categories'
          // iconName={'ion|android-list'}
          iconName={'fontawesome|barcode'}
          iconSize={24}
          selected={this.state.selectedTab === 1}
          onPress={() => {
            this.setState({
              selectedTab: 1,
              presses: this.state.presses + 1,
            });
          }}>
          {this._renderContentWithNavigation(YoloCategories, 'Categories', 'Enable All')}
        </SMXTabBarItemIOS>
        <SMXTabBarItemIOS
          title='Coupons'
          iconName={'ion|pricetags'}
          iconSize={26}
          badge={this.state.notifCount > 0 ? this.state.notifCount : undefined}
          selected={this.state.selectedTab === 2}
          onPress={() => {
            this.setState({
              selectedTab: 2,
              notifCount: this.state.notifCount + 1,
            });
          }}>
          {this._renderContentWithNavigation(YoloList)}
        </SMXTabBarItemIOS>
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        ....
        
        
        
        
        
        
        
        
        
var YoloList = React.createClass({
        renderRow: function(rowData: string, sectionID: string, rowID: string) {
    return (
      <View>
        <TouchableHighlight onPress={() => 
          this.props.navigator.push({
            // title: rowData.title,
            title: rowData.posters.thumbnail,
            component: CouponsList,
            rightButtonTitle: 'Skip',
            onRightButtonPress: () => this.props.navigator.pop(),
            passProps: {
              coupons: rowData.coupons,
              client: rowData,
            },
            navigationBar: <NavigationBar title="2nd View"/>
          })
        }>
          <View>
            <View style={[styles.rowBar, {backgroundColor: rowData.posters.color2}]} />
            <View style={[styles.row, {backgroundColor: rowData.posters.color1}]}>
              <Image
                source={{uri: rowData.posters.thumbnail}}
                style={styles.cellImage} />
              <View style={styles.textContainer}>
                <Text style={styles.movieTitle} numberOfLines={2}>
                  {rowData.title}
                </Text>
                <Text style={styles.movieYear} numberOfLines={1}>
                  {rowData.count} Coupons &bull; {rowData.title}
                </Text>
              </View>
            </View>
            <View style={[styles.cellBorder, {marginBottom: 12}]} />
          </View>
        </TouchableHighlight>
      </View>
    );
  }
});