javascript - React Native Android change scene navigator -

i'm trying build tabview , can't find out how change , render scenes. main view 1 (app.js) :

<view style={{flex: 1}}>   <tabview      ref="tabs"     ontab={(tab) => {       this.setstate({tab});     }}     tabs={[       {         component: list,         name: 'découvrir',         icon: require('../assets/img/tabs/icons/home.png')       },       {         component: friends,         name: 'amis',         icon: require('../assets/img/tabs/icons/friend.png'),         pastille: this.state.friendspastille < 10 ? this.state.friendspastille : '9+'       },       {         component: recostep1,         icon: require('../assets/img/tabs/icons/add.png'),         hasshared: mestore.getstate().me.has_shared       },       {         component: notifs,         name: 'notifs',         icon: require('../assets/img/tabs/icons/notif.png'),         pastille: this.state.notifspastille < 10 ? this.state.notifspastille : '9+'       },       {         component: profil,         name: 'profil',         icon: require('../assets/img/tabs/icons/account.png')       }     ]}     initialskipcache={!!this.notiflaunchtab}     initialselected={this.notiflaunchtab || 0}     tabsblocked={false} /> </view> 

the tabview component 1 , works fine. navigator renders blank screen only...

rendertab(index, name, icon, pastille, hasshared) {   var opacitystyle = {opacity: index === this.state.selected ? 1 : 0.3};   return (     <touchablewithoutfeedback key={index} style={styles.tabbartab} onpress={() => {       if (this.props.tabsblocked) {         return;       }       this.resettotab(index);     }}>       <view style={styles.tabbartab}>         <image source={icon} style={opacitystyle} />          {name ?           <text style={[styles.tabbartabtext, opacitystyle]}>{name}</text>         : null}       </view>     </touchablewithoutfeedback>   ); }  resettotab(index, opts) {   this.setstate({selected: index}); }  renderscene = (route, navigator) => {   var temp = navigator.getcurrentroutes();   return temp[this.state.selected].component; }  render() {   return (     <view style={styles.tabbarcontainer}>       <navigator         style={{backgroundcolor: '#ffffff', paddingtop: 20}}         initialroutestack={this.props.tabs}         initialroute={this.props.tabs[this.props.initialselected || 0]}         ref="tabs"         key="navigator"         renderscene={this.renderscene}         configurescene={() => {           return {             ...navigator.sceneconfigs.fadeandroid,             defaulttransitionvelocity: 10000,             gestures: {}           };         }} />        {this.state.showtabbar ? [          <view key="tabbar" style={styles.tabbartabs}>             {_.map(this.props.tabs, (tab, index) => {             return this.rendertab(index, tab.name, tab.icon, tab.pastille, tab.hasshared);             })}         </view>       ] : []}     </view>   ); } 

i know i'm doing wrong, can't figure out ... changing tabs doesn't display shown below.. used navigatorios ans ios version worked fine following navigator in render method in tabview (i don't know how go navigatorios navigator) :

<navigator   style={{backgroundcolor: '#ffffff', paddingtop: 20}}   initialroutestack={this.props.tabs}   initialroute={this.props.tabs[this.props.initialselected || 0]}   ref="tabs"   key="navigator"   renderscene={(tab, navigator) => {     var index = navigator.getcurrentroutes().indexof(tab);     return (       <navigatorios         style={styles.tabbarcontent}         key={index}         itemwrapperstyle={styles.tabbarcontentwrapper}         initialroute={tab.component.route()}         initialskipcache={this.props.initialskipcache} />       );   }}   configurescene={() => {     return {       ...navigator.sceneconfigs.fadeandroid,       defaulttransitionvelocity: 10000,       gestures: {}     };   }} /> 

try adding a

flex:1 

property navigator. if doesn't work, check see tabbarcontainer has

flex:1  

property.