我使用以下语法在我的react-native应用程序中创建了一个导航栏
<Navigator renderScene={this.renderScene.bind(this)} navigator={this.props.navigator} navigationBar={ <Navigator.NavigationBar style={styles.navbar} routeMapper={NavigationBarRouteMapper} /> } />
默认情况下,导航栏的布局是: LeftButton 与栏的左侧对齐, RightButton 与栏的 右侧 对齐。但是 Title 对齐到容器flexbox的左侧。在 LeftButton旁边 。
我想要达到的目的非常简单,我只希望 标题 位于导航栏两个按钮之间。
我的标题就是这样的组件
<Text style={styles.navbarTitleText}> Welcome </Text>
我以为可以使用以下样式实现此目的
alignSelf: 'center'
这几乎工作,但很明显的是,容器为Flexbox的在 标题 上的右手边缘开始 LeftButton 在屏幕的边缘上的导航条的端部和端部,所以它的那些2个点之间的中心。这不是屏幕/导航栏的中心。
我只想要一个中央标题,有人可以帮忙吗?
我认为这个问题是在Android上为您发生的。我也有同样的问题,标题放在左边。对我有用的是:
<NavigationBar routeMapper={NavigationBarRouteMapper} style = {styles.navigationBar} navigationStyles={Navigator.NavigationBar.StylesIOS} />
StylesIOS使导航栏类似于iOS外观,标题居中。