【skill总结】flutter关于状态栏的操作

332 阅读1分钟

系统默认的appBar等高度

/// The height of the toolbar component of the [AppBar].
const double kToolbarHeight = 56.0;

/// The height of the bottom navigation bar.
const double kBottomNavigationBarHeight = 56.0;

/// The height of a tab bar containing text.
const double kTextTabBarHeight = 48.0;

获取状态栏的高度

import 'dart:ui';
MediaQueryData.fromWindow(window).padding.top

状态栏背景色或者图标改变颜色

    SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        statusBarIconBrightness: Brightness.dark);
    SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);

对于自定义Appbar时的状态栏

自定义appbar不写在Scaffold的appbar中,写在body中,但是又不想系统状态栏遮住

SafeArea(child: null)

自定义appbar渐变

MediaQuery.removePadding(
            context: context,
            removeTop: true,
            child: NotificationListener(
              onNotification: (scrollNotification) {
                if (scrollNotification is ScrollUpdateNotification) {
                  var alpha = scrollNotification.metrics.pixels /
                      ScreenUtils.setHeight(36); // 36为自定义appbar高度
                  if (alpha < 0) {
                    alpha = 0;
                  } else if (alpha > 1) {
                    alpha = 1;
                  }
                  _model.setOffset(alpha);
                }
                return false;
              },
              child: null,
            ))