headerRightはミリ秒単位で表示され、消えます。 （反応ナビゲーション）

Question

私はナビゲーション用のKitten UIを使用しています（単なるラッパーです）。 titleとheaderLeftが表示されますが、headerRightは表示されません。

これはnavBar.js（ThemedNavigationBar）

_renderRight(headerRight) { 
    let windowWidth = Dimensions.get('window').width; 
    const width = this.state.width 
     ? (windowWidth - this.state.width)/2 
     : undefined; 
    return headerRight && (
     <View style={[{width}, styles.right]}>{headerRight}</View> 
    ); 

    } 

render() { 
    let options = this.props.headerProps.getScreenDetails(this.props.headerProps.scene).options; 
    return (
     <View style={styles.layout}> 
     <View style={styles.container}> 
      {this._renderTitle(options.title, options.headerTitle)} 
      {this._renderLeft(options.headerLeft)} 
      {this._renderRight(options.headerRight)} 
     </View> 
     </View> 
    ) 
    } 

です（画像はこの質問の最下部に取り付けた）これは私のChangePasswordのnavigationOption

static navigationOptions = ({ navigation }) => ({ 
    title: `Change Password`, 
    tabBarVisible: false, 
    headerRight: (<- RIGHT HERE 
     <Button 
     title='SAVE' 
     /> 
    ), 
    header: (headerProps) => { 
     return <ThemedNavigationBar navigation={navigation} headerProps={headerProps}/> 
    } 
}); 

<Button title='SAVE' />が表示されません！

UPDATE

私はここで何が起こっているか、0から30までstyles.right.rightを設定したとき、私は、この奇妙な探してナビゲーションを取得していますか？

left: { 
    position: 'absolute', 
    top: 0, 
    bottom: 0, 
    justifyContent: 'center' 
    }, 
    right: { 
    position: 'absolute', 
    right: 30, <- I set right from 30 to 0 and I could see the button (But it shows just the part of the botton. Can I do it better? 
    top: 0, 
    bottom: 0, 
    justifyContent: 'center' 
    }, 
    title: { 
    ...StyleSheet.absoluteFillObject, 
    justifyContent: 'center', 
    alignItems: 'center', 

Answer 1

正確な値を設定すると、{width: 40}は私の問題を解決しました。ありがとうございます