TabBarIOS on React Native not working as expected -


i'm having problems on implementing tab bar react native. documentation not exist (http://facebook.github.io/react-native/docs/tabbarios.html) , example @ front page insufficient (e.g. missing required property icon).

i managed implement code point-of-view , showed up. light blue box taking half of space on screen.

my "working" code looked this:

<tabbarios>   <tabbarios.item title="wooden" selected={false} icon={require('image!wooden')}>     <navigatorios initialroute={{ title: 'wooden' }} />   </tabbarios.item> </tabbarios> 

but said, end result not expected.

has managed implement tabbarios successfully? tried search through source code there no gotchas would've helped me.

answering own question, how got working:

first need define tabbaritemios:

var react = require('react-native'); var {   image,   stylesheet,   text,   view,   tabbarios } = react;  var tabbaritemios = tabbarios.item; 

then, can use helper defining icons:

function _icon(imageuri) {   return {     uri: imageuri,     isstatic: true   }; } 

and, well... rest of actual code:

<tabbarios>   <tabbaritemios     icon={_icon('favorites')}>   </tabbaritemios>   <tabbaritemios     icon={_icon('history')}>   </tabbaritemios>   <tabbaritemios     icon={_icon('more')}>   </tabbaritemios> </tabbarios> 

this returns @ least basic kind of tabbar.

this based on example can found here: https://github.com/facebook/react-native/blob/master/examples/uiexplorer/tabbarexample.js


Comments

Popular posts from this blog

google chrome - Developer tools - How to inspect the elements which are added momentarily (by JQuery)? -

angularjs - Showing an empty as first option in select tag -

php - Cloud9 cloud IDE and CakePHP -