Flutter 透明状态栏及字体颜色的设置方法

注:底色透明是否生效与android版本有关,版本过低设置无效

1.在main.dart内设置

void main(){
 runApp(new MyApp());
 if (Platform.isAndroid) {
 //设置Android头部的导航栏透明
 SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(
 	statusBarColor: Colors.transparent, //全局设置透明
 	statusBarIconBrightness: Brightness.light
 	//light:黑色图标 dark:白色图标
 	//在此处设置statusBarIconBrightness为全局设置
 );
 SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
 }
}

2.单页面设置

appBar: AppBar(
		  title: new Text(''),
	  elevation: 0,
	  brightness: Brightness.dark, //设置为白色字体
	  ),

注:设置AppBar之后,单独在build内设置这行代码会失效 SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.light);

ps:下面看下Flutter修改状态栏颜色以及字体颜色

Flutter沉浸式状态栏

void main() {
 runApp(MyApp());
 if (Platform.isAndroid) {
 // 以下两行 设置android状态栏为透明的沉浸。写在组件渲染之后,是为了在渲染后进行set赋值,覆盖状态栏,写在渲染之前MaterialApp组件会覆盖掉这个值。
 SystemUiOverlayStyle systemUiOverlayStyle =
  SystemUiOverlayStyle(statusBarColor: Colors.transparent);
 SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
 }
}

Flutter修改状态栏字体颜色

使用AnnotatedRegion包裹Scaffold,可以使得状态栏颜色改变,有dark和light两种

@override
 Widget build(BuildContext context) {

 return AnnotatedRegion<SystemUiOverlayStyle>(
  value: SystemUiOverlayStyle.light,
  child: Material(child:Scaffold(),),);
 }

到此这篇关于Flutter 透明状态栏及字体颜色的文章就介绍到这了,更多相关Flutter 状态栏字体颜色内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • flutter 屏幕尺寸适配和字体大小适配的实现

    前言: 现在的手机品牌和型号越来越多,导致我们平时写布局的时候会在个不同的移动设备上显示的效果不同, 比如我们的设计稿一个View的大小是300px,如果直接写300px,可能在当前设备显示正常,但到了其他设备可能就会偏小或者偏大,这就需要我们对屏幕进行适配. 安卓原生的话有自己的适配规则,可以根据不同的尺寸建立不同的文件夹,系统会根据当前的设备尺寸取对应的大小的布局.而flutter本身并没有适配规则,而原生的又比较繁琐,这就需要我们自己去对屏幕进行适配. 点击直达github地址 如果有帮助

  • Flutter沉浸式状态栏/AppBar导航栏/仿咸鱼底部凸起导航栏效果

    如下图:状态栏是指android手机顶部显示手机状态信息的位置. android 自4.4开始新加入透明状态栏功能,状态栏可以自定义颜色背景,使titleBar能够和状态栏融为一体,增加沉浸感. 如上图Flutter状态栏默认为黑色半透明,那么如何去掉这个状态栏的黑色半透明背景色,让其和标题栏颜色一致,通栏沉浸式,实现如下图效果呢?且继续看下文讲述. 在flutter项目目录下找到android主入口页面MainActivity.kt或MainActivity.java,判断一下版本号然后将状态

  • Flutter 透明状态栏及字体颜色的设置方法

    注:底色透明是否生效与android版本有关,版本过低设置无效 1.在main.dart内设置 void main(){ runApp(new MyApp()); if (Platform.isAndroid) { //设置Android头部的导航栏透明 SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle( statusBarColor: Colors.transparent, //全局设置透明 statusBarIc

  • iOS开发技巧之状态栏字体颜色的设置方法

    状态栏的字体为黑色:UIStatusBarStyleDefault 状态栏的字体为白色:UIStatusBarStyleLightContent 一.在info.plist中,将View controller-based status bar appearance设为NO 状态栏字体的颜色只由下面的属性设定,默认为白色: // default is UIStatusBarStyleDefault [UIApplication sharedApplication].statusBarStyle 解

  • jQuery实现字体颜色渐变效果的方法

    本文实例讲述了jQuery实现字体颜色渐变效果的方法.分享给大家供大家参考,具体如下: jQuery不允许css属性值为非数字的属性进行动画处理, 比如.animate(color:'red',500)或是.animate(fontWeight:'bold',500)都无法运行, 因此如果想实现颜色渐变的效果需要animate()外的其他方法,示例如下 方法1: <!DOCTYPE html> <html lang="en"> <head> <

  • CKeditor4 字体颜色功能配置方法教程

    本文实例讲述了CKeditor4 字体颜色功能配置方法.分享给大家供大家参考,具体如下: 今天动手ckeditor编辑器的时候发现工具栏上并没有可以更改字体颜色和背景颜色的按钮,所以我上网搜了下,网上特别多config.js文件配置的代码了,看得眼花缭乱的我选择把全部代码都复制下来.结果当然是没用的--一开始我还能有文本框.工具栏,到后来就变成什么都没有了. 后来我找到了ckeditor的文档:https://ckeditor.com/docs/index.html,找到里面的指南 在搜索框里搜

  • layer ui插件显示tips时,修改字体颜色的实现方法

    今天做调查问卷,又遇到一个蛋疼小问题,记录下. 调查问卷有很多选项是要求必填的,如果不填的话,需要给出友好的提示.用的如下组件:http://layer.layui.com/ 1.之前一直默认用的: <script src="/assets/js/layer/layer.js"></script> function showMessage(msg, domObj) { layer.tips(msg, domObj,{tips:3});//弹出框加回调函数 } s

  • extjs grid设置某列背景颜色和字体颜色的实现方法

    css代码: 复制代码 代码如下: .x-grid-back-red { background: #FF0000; } js代码: 复制代码 代码如下: { header : '分成类型', dataIndex : 'divideType', renderer : function(v,m){ m.css='x-grid-back-red'; return v; }, width : 60 } 或者直接这样写也可以 复制代码 代码如下: { header : '编号', dataIndex :

  • jQuery之字体大小的设置方法

    先获取字体大小,进行处理. 再将修改的值保存. slice() 方法可从已有的数组中返回选定的元素.arrayObject.slice(start,end).start 必需.规定从何处开始选取.如果是负数,那么它规定从数组尾部开始算起的位置.也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推. end   可选.规定从何处结束选取.该参数是数组片断结束处的数组下标.如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素.如果这个参数是负数,那么它规定的是从数组

  • ScrollView滚动条颜色的设置方法

    很多开发者在做Android UI时不知道如何设置ScrollView滚动条控件的滑块颜色,其实通过ScrollView的xml布局属性android:scrollbarThumbVertical可以关联一个drawable对象,比如说在ScrollView中我们有 android:scrollbars="vertical" //滚动条是垂直的android:scrollbarThumbVertical="@drawable/red" //垂直滚动条颜色为red,r

  • IOS中一段文字设置多种字体颜色代码

    给定range和需要设置的颜色,就可以给一段文字设置多种不同的字体颜色,使用方法如下: 复制代码 代码如下: [self fuwenbenLabel:contentLabel FontNumber:[UIFont systemFontOfSize:15] AndRange:NSMakeRange(6, 1) AndColor:RGBACOLOR(34, 150, 253, 1)]; 复制代码 代码如下: //设置不同字体颜色 -(void)fuwenbenLabel:(UILabel *)lab

  • Android系统更改状态栏字体颜色

    随着时代的发展,Android的状态栏都不是乌黑一片了,在Android4.4之后我们可以修改状态栏的颜色或者让我们自己的View延伸到状态栏下面.我们可以进行更多的定制化了,然而有的时候我们使用的是淡色的颜色比如白色,由于状态栏上面的文字为白色,这样的话状态栏上面的文字就无法看清了.因此本文提供一些解决方案,可以是MIUI6+,Flyme4+,Android6.0+支持切换状态栏的文字颜色为暗色. 修改MIUI public static boolean setMiuiStatusBarDar

随机推荐