嘿伙计们,我是新来的反应原生并试图在导航栏上构建带有汉堡包图标的导航抽屉。我可以看到导航栏但无法呈现汉堡包图标。当我尝试将其与其他屏幕集成时,代码也不会被渲染 这是我的toolbar.js代码
class toolbar extends Component {
render(){
var navigator = this.props.navigator;
return (
<ToolbarAndroid
title={this.props.title}
navIcon={require('./img/menu.png')}
style = {styles.toolbar}
titleColor={'white'}
onIconClicked={this.props.sidebarRef}/>
);
}
}
和OpenDrawerFromToolbar.js代码
var navigationView = (
<ScrollView>
<View style={{flex: 1, backgroundColor: '#fff'}}>
<Text style={{margin: 10, fontSize: 15, textAlign: 'left'}}>I m in the Drawer!</Text>
</View>
</ScrollView>
);
return (
<DrawerLayoutAndroid
drawerWidth={windowsWidth/1.5}
drawerPosition={DrawerLayoutAndroid.positions.Left}
renderNavigationView={() => navigationView}
ref={'DRAWER'}>
<Toolbar style={styles.toolbar}
title={'Calendar'}
navigator={this.props.navigator}
sidebarRef={()=>this._setDrawer()}/>
<View style={{alignItems: 'center', backgroundColor: 'blue'}}>
<Text style={{margin: 10, fontSize: 15, textAlign: 'right'}}>Hi MiaMia</Text>
</View>
</DrawerLayoutAndroid>
);
}
_setDrawer() {
this.refs['DRAWER'].openDrawer();
}
}
单独运行OpenDrawerFromToolbar.js时,无需渲染汉堡图标即可运行。当我尝试与其他一些视图集成时,它无法呈现。任何人都可以指导我这个吗?
提前多多谢谢。欢迎任何疑问或怀疑。
答案 0 :(得分:0)
您可以使用图像/图标文件夹向我发送项目文件结构快照.. ...
我认为您不能像这样实现工具栏样式:
<Toolbar style={styles.toolbar} //here is the error
title={'Calendar'}
navigator={this.props.navigator}
sidebarRef={()=>this._setDrawer()}/>
并将工具栏样式样式表发送给我..
最好在toolbar.js文件中实现工具栏样式..但是让我先看看你的风格..