1.获取状态栏高度
1.第一种,注意:这里需要导入 'dart:ui' 包
import 'dart:ui';
MediaQueryData.fromWindow(window).padding.top
2.第二种,
MediaQuery.of(context).padding.top
说到状态栏,就要说个安全区域的概念:所谓安全区域,就是适配现在一些刘海屏之类的非常规显示屏,在flutter中除了根据上面的方法获取到状态栏高度,给页面加对应的状态栏高度padding,还有一个专门的widget用来显示安全区域内容:SafeArea
2.获取appBar高度
位于 Dart Packages/flutter/src/material/constans.dart
/// * [kMinInteractiveDimensionCupertino] /// * The Material spec on touch targets at <https://material.io/design/usability/accessibility.html#layout-typography>. const double kMinInteractiveDimension = 48.0; /// 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;
3.获取手机屏幕宽高
Material 设计规范中 状态栏、导航栏、ListTile高度分别为 24、56、56
MediaQuery.of(context).size.width
MediaQuery.of(context).size.height
我把 MediaQuery.of(context) 的值输出来了,不同的机型有些值是不同的, 其实 MediaQuery.of(context) 输出的内容和 MediaQueryData.fromWindow(window) 输出的内容是一样的
MediaQueryData(
size: Size(360.0, 592.0),
devicePixelRatio: 2.0,
textScaleFactor: 1.0,
platformBrightness: Brightness.light,
padding: EdgeInsets(0.0, 24.0, 0.0, 0.0),
viewPadding: EdgeInsets(0.0, 24.0, 0.0, 0.0),
viewInsets: EdgeInsets.zero,
physicalDepth: 1.7976931348623157e+308,
alwaysUse24HourFormat: true,
accessibleNavigation: false,
disableAnimations: false,
invertColors: false,
boldText: false,
);