Flutter 状态栏完美攻略

1. 沉浸式状态栏

Dart 复制代码
Scaffold(
        extendBodyBehindAppBar: true,
        appBar: AppBar(
          toolbarHeight: 0,
        ),
        body: Container(color:Colors.red)
)

2. 状态栏的背景颜色

Dart 复制代码
Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.transparent,
        ),
        body: Container(color:Colors.red)
)

3. 状态栏的文字颜色

Brightness.light文字黑色
Brightness.dark文字白色

Dart 复制代码
Scaffold(
        appBar: AppBar(
          brightness: Brightness.light,
        ),
        body: Container(color:Colors.red)
)

4. 沉浸式状态栏下的安全区域

Dart 复制代码
Scaffold(
        extendBodyBehindAppBar: true,
        appBar: AppBar(
          toolbarHeight: 0,
        ),
        body: SafeArea(child:Container(color:Colors.red))
)

5. Android机器的状态栏颜色改为透明

默认是带个遮罩的,完全去除:

Dart 复制代码
void main() async {
   runApp(MaterialApp());
    SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(statusBarColor:Colors.transparent);
    SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
}
相关推荐
小龙在山东14 小时前
Flutter Scaffold 页面结构
flutter
TangAcrab2 天前
vscode flutter 项目连接 mumu 浏览器
ide·vscode·flutter
小龙在山东2 天前
Flutter常用Widget小部件
flutter
yangshuo12812 天前
git安装flutter
git·flutter
Kevin Coding2 天前
Flutter使用Flavor实现切换环境和多渠道打包
android·flutter·ios
字节全栈_BjO2 天前
Flutter Raw Image Provider
flutter
字节全栈_rJF3 天前
Flutter Candies 一桶天下
前端·javascript·flutter
pengyu4 天前
系统化掌握 Dart 编程之异常处理(二):从防御到艺术的进阶之路
android·flutter·dart
字节全栈_ZKt4 天前
FIDL:Flutter与原生通讯的新姿势,不局限于基础数据类型
flutter
小龙在山东4 天前
Flutter开发环境配置
flutter