Flutter 修改状态栏颜色

2023-08-13  本文已影响0人  大成小栈

首先,需要检查系统是否允许状态栏显示,检查创建项目时两个文件的配置,将相关内容注释掉or删除:

// iOS 配置
./ios/Runner/Info.plist
<key>UIMainStoryboardFile</key>
<string>Main</string>
<key>UIStatusBarHidden</key> <- <here>
<true/> <- <here>
<key>UISupportedInterfaceOrientations</key>

// Android 配置
./android/app/src/main/res/values/styles.xml
<style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
<item name="android:windowFullscreen">true</item> <- <here>

然后,添加主题设置代码:

 // 状态栏字体白色
  static const SystemUiOverlayStyle light = SystemUiOverlayStyle(
    systemNavigationBarColor: Color(0xFF000000),
    systemNavigationBarDividerColor: null,
    statusBarColor: null,
    systemNavigationBarIconBrightness: Brightness.light,
    statusBarIconBrightness: Brightness.light,
    statusBarBrightness: Brightness.dark,
  );
 
 
//  状态栏字体黑色
  static const SystemUiOverlayStyle dark = SystemUiOverlayStyle(
    systemNavigationBarColor: Color(0xFF000000),
    systemNavigationBarDividerColor: null,
    statusBarColor: null,
    systemNavigationBarIconBrightness: Brightness.light,
    statusBarIconBrightness: Brightness.dark,
    statusBarBrightness: Brightness.light,
  );

将上面逻辑添加到main.dart中 runApp() 方法下,就可以设置全局状态栏字体颜色为白色了。

若不同的页面显示不同的颜色,可以直接将这个引入到需要的页面,改成其他的颜色即可:

//白色
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.light);

参考链接:
https://www.likecs.com/show-308210602.html

上一篇 下一篇

猜你喜欢

热点阅读