React-native-router-flux renderRightButton（）方法

Question

我正在尝试渲染导航栏自定义右键。

React-native-router-flux版本：^ 3.43.0

代码看起来像这样：

<Scene
  initial
  key="RegistrationType"
  navigationBarStyle={Style.navBarStyleBlue}
  renderRightButton={() => (
    <View style={{
      backgroundColor: 'yellow',
      height: 50,
      alignItems: 'center',
      justifyContent: 'center'
    }}>
      <TouchableOpacity onPress={Actions.Login}>
        <Text>Login</Text>
      </TouchableOpacity>
    </View>
  )}
  component={RegistrationType}
  title=""
  hideNavBar={false}
/>

Navbar的风格：

navBarStyleBlue: {
  backgroundColor: 'blue',
  borderBottomWidth: 0,
  height: 50
},

所以基本上我正试图让右边的按钮与导航栏垂直对齐，得到这样的东西：

但我得到了这个：

有什么想法吗？

Answer 1

想通了。 必须使用rightButtonStyle属性。

rightButtonStyle={{
  top: 0,
  height: 50,
  padding: 0,
  justifyContent: 'center',
  alignItems: 'center'
}}