Flutter：在iOS中更改状态栏颜色 [英] Flutter: Change status bar color in iOS

问题描述

我想使用 package：flutter / services.dart 包更改状态栏的颜色，但是它不起作用。我正在使用Mac和iOS模拟器：

I want to change status bar color with package:flutter/services.dart package but it doesn't work. I am using Mac and iOS simulator:

• Mojave 10.14.6


• iOS 12.2模拟器/ Xr


• Flutter 1.9.1 + hotfix.2


• 工具•Dart 2.5.0

• Mojave 10.14.6
• iOS 12.2 simulator / Xr
• Flutter 1.9.1+hotfix.2
• Tools • Dart 2.5.0

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {

    SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        statusBarColor: Colors.red // <-- doesn't work
      )
    );

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}
... // other stuff

即使我将其放在 main 函数中，也可以：

Even if I put it in the main function:

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  SystemChrome.setSystemUIOverlayStyle(
    SystemUiOverlayStyle(
      statusBarColor: Colors.red,
    )
  );
  SystemChrome.setPreferredOrientations(
      [DeviceOrientation.portraitUp, DeviceOrientation.portraitDown])
    .then((_) => runApp(MyApp()));
}
... // the rest code here

如果我想将 appBar 背景颜色更改为白色，我会得到这个。

As a result I get this if I want to change appBar background color to white.

尚未针对Android进行过测试。此问题仅与iOS模拟器有关吗？如何解决它？

Haven't tested it for android yet. Is this issue related only to iOS simulator or so? How to fix it?

UPD

这个问题开始让我发疯。

This issue starts to drive my nuts.

推荐答案

编辑：

appBar: AppBar(
  elevation: 0,
  brightness: Brightness.light, // this makes status bar text color black
  backgroundColor: Colors.white,
)

输出：

statusBarColor 只能在Android中进行更改，而不能在iOS中进行更改，如果您尝试通过某些变通办法进行更改，则Apple可能会拒绝您的应用程序，因为他们不希望您使用其他的 AppBar 和状态栏颜色。

statusBarColor can only be changed in Android and not in iOS, and probably Apple can reject your app if you try do so by some workarounds because they don't want you to have different AppBar and status bar color.

AppBar(backgroundColor: Colors.red) // this changes both AppBar and status bar color in iOS

Apple希望您坚持自己的设计，这就是为什么更改 statusBarColor 对iOS没有影响的原因。

Apple wants you to stick to their designs which is why changing statusBarColor has no effect on iOS.

这篇关于Flutter：在iOS中更改状态栏颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！