代码:
var StackHomeOptions =({navigation})=>{ let {state} = navigation; console.log('Home navigation:'+navigation+state.params); const headerStyle = ETTHeaderStyles.headerStyle; const headerTitle = '北京'; const headerTitleStyle = ETTHeaderStyles.headerTitleStyle; const headerBackTitle = '返回'; const headerRight= (<Button onPress={() => navigation.navigate('MyScene',{ title:'个人中心' })} title={'详情'} />); const headerLeft =(<View/>); return {headerTitle,headerRight,headerTitleStyle,headerStyle,headerBackTitle,headerLeft} };
style:
var ETTHeaderStyles = StyleSheet.create( { headerStyle: { backgroundColor: '#1C1D21' },headerTitleStyle: { flex:1,alignSelf:'center',fontSize: 20,color: '#ffffff',textAlign: 'center',fontSize: 20 },bigTextPrompt: { width: 300,backgroundColor: 'gray',color: 'white',});
问题 1。 因为是首页 所以 右侧有按钮 左侧没有按钮 所以会出现title 向左偏移问题 :
解决办法:在 StackHomeOptions 中 增加 const headerLeft =(<View/>);
问题2. 在 ETTHeaderStyles 中headerTitleStyle 设置了 alignSelf:'center',安卓还是不能够居中
解决办法ETTHeaderStyles 中headerTitleStyle 设置
{
flex:1,
alignSelf:'center',
}