flutter设置statusbar状态栏的背景颜色和 APP（AppBar）内部颜色一致方法。

可口码农

已于 2022-07-28 21:59:39 修改

阅读量2.9k

点赞数 3

分类专栏： flutter 文章标签： flutter android kotlin

于 2022-07-28 21:33:52 首次发布

本文链接：https://blog.csdn.net/qq996150938/article/details/126044413

版权

flutter 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

网上搜出来的方式都是在 dart中设置 statusbar透明，但是我试了几个作者提供的语法都没法实现。

最后找到一种方法，那就是在

MainActivity.kt路径：android/app/src/main/kotlin/com/example/flutter_app/MainActivity.kt

package com.example.learn_flutter2

import io.flutter.embedding.android.FlutterActivity
//引入
import android.os.Build;
import android.os.Bundle;
class MainActivity: FlutterActivity() {
    //设置状态栏沉浸式透明（修改flutter状态栏黑色半透明为全透明）
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            window.statusBarColor = 0
        }
    }
}

如上加入注释部分的代码即可解决flutter 状态栏和 APP内部一致。

如果你是 java。

如下解决：

package com.example.demo1;

import androidx.annotation.NonNull;
import io.flutter.embedding.android.FlutterActivity;
import io.flutter.embedding.engine.FlutterEngine;
import io.flutter.plugins.GeneratedPluginRegistrant;

// 引入
import android.os.Build;
import android.os.Bundle;

public class MainActivity extends FlutterActivity {
     @Override
     public void configureFlutterEngine(@NonNull FlutterEngine flutterEngine) {
         GeneratedPluginRegistrant.registerWith(flutterEngine);
     }

     // 设置状态栏沉浸式透明（修改flutter状态栏黑色半透明为全透明）
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
             getWindow().setStatusBarColor(0);
         }
     }
}

我是 kt的代码，实测成功，java的部分没有实测过，我想应该没问题。

以上方式还需要修改 Android 原生代码，后来找到了dart 实现的代码：

第一步：引入

import 'package:flutter/services.dart';

引入后。

第二步：两种方式实现，二选一就行

1、在main中全局实现：

Future<void> main() async {
  runApp(MyApp());
  SystemUiOverlayStyle uiStyle = const SystemUiOverlayStyle(
        systemNavigationBarColor: const Color(0x00000000),
        systemNavigationBarDividerColor: null,
        statusBarColor: const Color(0x00000000),
        systemNavigationBarIconBrightness: Brightness.dark,
        statusBarIconBrightness: Brightness.dark,
        statusBarBrightness: Brightness.dark,
    );

    SystemChrome.setSystemUIOverlayStyle(uiStyle);
}

2、在每个页面分别实现：

    static SystemUiOverlayStyle uiStyle = const SystemUiOverlayStyle(
        systemNavigationBarColor: const Color(0x00000000),
        systemNavigationBarDividerColor: null,
        statusBarColor: const Color(0x00000000),
        systemNavigationBarIconBrightness: Brightness.dark,
        statusBarIconBrightness: Brightness.dark,
        statusBarBrightness: Brightness.dark,
    );

    static appUIStyle() {
        SystemChrome.setSystemUIOverlayStyle(uiStyle);
    }

然后在每个页面initState中调用 appUIStyle。