其他分享
首页 > 其他分享> > flutter设置面系统状态栏颜色

flutter设置面系统状态栏颜色

作者:互联网

flutter设置系统状态栏颜色

原图可能是这样的

原图是这样

但是想要顶部和底部状态栏颜色是这样

在这里插入图片描述
关键代码就是初始化页面时进行设置

  @override
  void initState() {
    SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        systemNavigationBarColor: Color(0xffdb2c1f),
      ),
    );
    super.initState();
  }

全部代码

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


class LoginPage extends StatefulWidget {
  final Map<dynamic, dynamic>? arguments;
  LoginPage({Key? key, this.arguments}) : super(key: key);

  @override
  _LoginPageState createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  @override
  void initState() {
    SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        systemNavigationBarColor: Color(0xffdb2c1f),
      ),
    );
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Container(
      decoration: BoxDecoration(color: Color(0xffdb2c1f)),
      child: Column(
        children: [
          Container(
            alignment: Alignment(0.0, -0.7),
            margin: EdgeInsets.only(top: 100),
            child: Image.asset(
              'lib/assets/images/loginLogo.png',
              width: 80,
              height: 80,
            ),
          ),
          Container(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                // Text(
                //   '18260898501',
                //   style: TextStyle(color: Colors.white, fontSize: 16),
                // ),
                // Icon(Icons.border_color)
              ],
            ),
          )
        ],
      ),
    ));
  }
}

标签:颜色,状态栏,color,LoginPageState,initState,override,flutter
来源: https://blog.csdn.net/qq_37621866/article/details/117021430