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
Post a Comment