admin 管理员组

文章数量: 1087678

【Flutter 问题系列第 45 篇】Flutter 改变状态栏的背景颜色和字体颜色

这是【Flutter 问题系列第 45 篇】，如果觉得有用的话，欢迎关注专栏。

一：问题描述

有的时候 App 中并没有设置 AppBar，这个时候顶部状态栏就会出现如下图所示的颜色

如果你想更改状态栏的背景颜色和字体颜色，可以这样做。

二：解决方案

首先引入 import 'package:flutter/services.dart'; 文件，然后根据如下代码片段设置你先要的颜色

void main() {SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(// Brightness.light 状态栏字体颜色（白色）statusBarIconBrightness: Brightness.dark, // 状态栏字体颜色（黑色）statusBarColor: Colors.yellow, // 状态栏背景色));runApp(MyApp());
}

如果你想让状态栏的背景色设置为透明。可以设置 statusBarColor 属性为 Colors.transparent

下面是真机演示效果

效果一（黄色背景，黑色字体）

效果二（黑色背景，白色字体）

效果三（透明背景，黑色字体）

你的问题得到解决了吗？欢迎在评论区留言。

赠人玫瑰，手有余香，如果觉得文章不错，希望可以给个一键三连，感谢。

结束语

Google 的 Flutter 越来越火，截止 2021年9月12日 GitHub 标星已达 130K，Flutter 毅然是一种趋势，所以作为前端开发者，没有理由不趁早去学习。

无论你是 Flutter 新手还是已经入门了，不妨先点个关注，后续我会将 Flutter 中的常用组件（含有源码分析、组件的用法及注意事项）以及可能遇到的问题写到 CSDN 博客中，希望自己学习的同时，也可以帮助更多的人。

本文标签： Flutter 问题系列第 45 篇Flutter 改变状态栏的背景颜色和字体颜色

版权声明：本文标题：【Flutter 问题系列第 45 篇】Flutter 改变状态栏的背景颜色和字体颜色 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1700277341a376408.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。