React -Native 状态栏文件居中

前端之家收集整理的这篇文章主要介绍了React -Native 状态栏文件居中前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

代码

@H_502_3@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:

@H_502_3@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',

}

猜你在找的React相关文章