如何在反应原生android应用程序中使用工具栏

Question

我正在学习react-native编程，我正在尝试将http://react-native-material-design.github.io/installation集成到材料设计中。

我想在我的应用程序中使用此http://react-native-material-design.github.io/components/toolbar视图，因为没有关于如何使用它的文档。

任何人都可以帮助我如何在我的应用程序中使用这个视图。提前致谢。

PS：我不想除了使用该https://facebook.github.io/react-native/docs/toolbarandroid.html

Answer 1

从不知道你所使用的导航仪，与react-native-router-flux你可以轻松地设置的NavBar（或工具栏在Android的话）通过简单地添加navBar={MyCustomNavBar}到场景，您希望您的工具栏存在，

<Scene sceneStyle={{marginTop: Metrics.navBarHeight}} component={HomeScreen} key="home" navBar={MyCustomNavBar}/> 

和

import MyCustomNavBar from './components'在您的导航仪的顶部。

CustomNavBar可以是任何你能想象的。您可以添加图标，按钮，标志甚至动画搜索栏。请注意，在React Native中，工具栏绝对定位，并且它们具有固定的高度，因此导航器中的所有场景都必须具有marginTop样式，以防止内容重叠。一个例子MyCustomBar可以具有一个包装视图诸如

render() { 
return (
    <View style={containerStyle}> 
     ... 
    </View> 
) 
} 

与

container: { 
    position: 'absolute', 
    top: 0, 
    left: 0, 
    right: 0, 
    height: Metrics.navBarHeight, 
    } 

的NavBar高度containerStyles不在Android和