小编Mar*_*ver的帖子

更改Navigator.NavigationBar的默认样式(标题)

我使用以下语法在react-native应用程序中创建了一个导航栏

<Navigator
  renderScene={this.renderScene.bind(this)}
  navigator={this.props.navigator}
  navigationBar={
    <Navigator.NavigationBar 
      style={styles.navbar}  
      routeMapper={NavigationBarRouteMapper} />
      } />
Run Code Online (Sandbox Code Playgroud)

默认情况下,导航栏有一个布局,其中LeftButton与条形图的左侧对齐,而RightButton与条形图的右侧对齐.但标题与其容器弹性框的左侧对齐.哪个是LeftButton的旁边.

我想要实现的非常简单我只想让标题居中在导航栏的两个按钮之间.

我的标题只是一个<Text>组件

<Text style={styles.navbarTitleText}>
 Welcome
</Text>
Run Code Online (Sandbox Code Playgroud)

我以为我可以使用以下样式实现此目的

alignSelf: 'center'
Run Code Online (Sandbox Code Playgroud)

这几乎可以工作,但很明显,Title的容器flexbox 在LeftButton的右边缘开始,并在屏幕边缘的导航栏的末尾结束,所以它在这两个点之间居中.这不是屏幕/导航栏的中心.

我只想要一个中心标题,任何人都可以帮忙吗?

android reactjs react-native

6
推荐指数
1
解决办法
4909
查看次数

样式表中的平台条件语句(react-native)

对于次要平台特定代码,您可以使用平台模块来执行一些平台相关代码。如此处的文档中所述:https : //facebook.github.io/react-native/docs/platform-specific-code.html

有一个如何在样式表中使用它的示例

var styles = StyleSheet.create({ 
   height: (Platform.OS === 'ios') ? 200 : 100, 
});
Run Code Online (Sandbox Code Playgroud)

我想做一些类似但简单的 if 语句来决定是否使用一种样式,例如仅用于一个平台的样式。

下面是一个例子:

var styles = StyleSheet.create({
   textInputStyle: {
      if (Platform.OS === 'android') {
         textAlignVertical:'top' // android only style
      }
   }
});~
Run Code Online (Sandbox Code Playgroud)

这在语法上是不正确的,实现这一目标的正确代码是什么。我想避免为每个平台使用两个单独的样式表,因为当它只有 1 或 2 个不同的字段时似乎没有必要。

reactjs react-native

5
推荐指数
2
解决办法
3949
查看次数

标签 统计

react-native ×2

reactjs ×2

android ×1