import React,{ Component } from 'react';
import {
Platform,
StyleSheet,
View,
StatusBar
} from 'react-native';
import ETTHeaderStyles from '../res/styles/ETTHeaderStyles';
export class ETTLightStatus extends Component {
render() {
return (
<StatusBar
animated={true} //指定状态栏的变化是否应以动画形式呈现。目前支持这几种样式:backgroundColor,barStyle和hidden
hidden={false} //是否隐藏状态栏。
networkActivityIndicatorVisible ={false}//仅作用于ios。是否显示正在使用网络。
showHideTransition={'fade'}//仅作用于ios。显示或隐藏状态栏时所使用的动画效果(’fade’,‘slide’)。
backgroundColor={ETTHeaderStyles.headerStyle} //状态栏的背景色
translucent={false}//指定状态栏是否透明。设置为true时,应用会在状态栏之下绘制(即所谓“沉浸式”——被状态栏遮住一部分)。常和带有半透明背景色的状态栏搭配使用。
barStyle={'light-content'} // enum('default','light-content','dark-content')
>
</StatusBar>
);
}
}
export class ETTDarkStatus extends Component {
render() {
return (
<StatusBar
animated={true} //指定状态栏的变化是否应以动画形式呈现。目前支持这几种样式:backgroundColor,barStyle和hidden
hidden={false} //是否隐藏状态栏。
backgroundColor={'white'} //状态栏的背景色
translucent={false}//指定状态栏是否透明。设置为true时,应用会在状态栏之下绘制(即所谓“沉浸式”——被状态栏遮住一部分)。常和带有半透明背景色的状态栏搭配使用。
barStyle={'dark-content'} // enum('default','dark-content')
networkActivityIndicatorVisible ={false}//仅作用于ios。是否显示正在使用网络。
showHideTransition={'fade'}
>
</StatusBar>
);
}
}
使用处:
render() { return( <View style={rootStyles.container}> <ETTLightStatus/> <Text style={rootStyles.textPromptStyle}> 入口文件: </Text> <Button style={rootStyles.bigTextPrompt} onPress={() => this.userConfirmed()} title={'to detail'}> </Button> </View> ); }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。