flutter 状态栏不显示 问题解决办法

本篇文章主要讲解flutter 状态栏不显示 问题解决办法,通过本篇文章你可以快速解决遇到的这个问题。

日期:2025年2月15日

作者:任聪聪

现象说明:

现象1:不显示顶部的状态栏

现象2:不显示底部的 按钮

其他说明:

1、尝试通过AppBar解决无效。

2、设置全局样式参数无效。

复制代码
  // 设置系统UI模式为正常模式,显示状态栏和导航栏
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);

  // 设置状态栏样式
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.transparent, // 设置状态栏颜色为透明
    statusBarIconBrightness: Brightness.dark, // 设置状态栏图标为深色
  ));

备注:总之很多方法都无效的情况。

问题原因:

这是由于位于:flutter\android\app\src\main\res\values-night\styles.xml文件下开启了全屏配置导致。

解决办法:

复制代码
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is on -->
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <!-- Show a splash screen on the activity. Automatically removed when
             the Flutter engine draws its first frame -->
        <item name="android:windowBackground">@drawable/launch_background</item>
        <item name="android:forceDarkAllowed">false</item>
        <item name="android:windowFullscreen">false</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
    </style>
    <!-- Theme applied to the Android Window as soon as the process has started.
         This theme determines the color of the Android Window while your
         Flutter UI initializes, as well as behind your Flutter UI while its
         running.

         This Theme is only used starting with V2 of Flutter's Android embedding. -->
    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <item name="android:windowBackground">?android:colorBackground</item>
    </style>
</resources>

说明: <item name="android:windowFullscreen">false</item> 此类目改为false即可。

相关推荐
Jinxiansen02114 分钟前
Vue 3 实战:【加强版】公司通知推送(WebSocket + token 校验 + 心跳机制)
前端·javascript·vue.js·websocket·typescript
JohnYan17 分钟前
Bun技术评估 - 05 SQL
javascript·后端·bun
前端农民晨曦19 分钟前
深入浏览器事件循环与任务队列架构
前端·javascript·面试
Spider_Man34 分钟前
JavaScript对象那些坑:初学者必踩的“陷阱”与进阶秘籍
前端·javascript
我在北京coding1 小时前
Uncaught ReferenceError: process is not defined
前端·javascript·vue.js
用户2018792831671 小时前
如何利用AI工具快速学习Android源码
android
张成AI1 小时前
A2A JS SDK 完整教程:快速入门指南
javascript·agent·a2a
baozj1 小时前
一次表单数据复用引发的 Bug:理解 Vue 中的 data 为何是函数
前端·javascript·vue.js
LRH1 小时前
JS基础 - instanceof 理解及手写
前端·javascript
小小神仙1 小时前
JSCommon系列 - 为什么前端没有 Apache Commons?
前端·javascript·设计模式