Flutter开发：强大的MediaQuery控件

无特别说明，Flutter版本和Dart版本如下：

• Flutter版本：1.12.13+hotfix.5
• Dart版本：2.7Dart版本：2.7。 通常MediaQuery不直接用作控件，而是使用MediaQuery.of来获取当前设备的信息。用法如下：

  var data = MediaQuery.of(context);复制代码

  该方法必须放在 MediaQuery 范围内，否则抛出异常 当异常发生时，MaterialApp 和 WidgetsApp 都会调用 MediaQuery，并在屏幕发生变化时引起重构，如屏幕旋转、跳跃等。输入框等

  MediaQueryData

  MediaQueryData 是由 MediaQuery.of 检索的数据类型。描述如下：

  属性	描述
  尺寸	逻辑像素不是物理像素。与Android上的dp类似，逻辑像素在不同尺寸的手机上显示的尺寸基本相同。物理像素=尺寸*设置像素比。
  devicePixelRatio	每个逻辑像素的物理像素数，即设备像素比率。
  textScaleFactor	每个逻辑像素的字体像素数。如果设置为 1.5，它将比指定字体大 50%。
  platformBrightness	当前设备的亮度模式，如进入Android Pie手机的省电模式，所有应用程序都会以深色模式绘制。
  viewInsets	被系统遮挡的部分通常是指键盘，弹出键盘，viewInsets.bottom代表键盘的高度。
  polster	被系统遮挡的部分通常指的是“缺口”或者系统状态栏。
  viewPadding	被系统遮挡的部分通常指的是“缺口”或者系统状态栏。该值与参数padding和view Insets无关，其值来自于MediaQuery作为检查的起始边缘。在移动设备上，这通常是全屏的。
  systemGestureInsets	屏幕边缘的区域，系统在其中“消耗”输入事件并阻止这些事件传递到应用程序。例如，Android Q 使用滑动手势来导航页面（iOS 也同样），例如向左滑动退出当前页面。
  物理深度	类似于三维空间Z轴的设备的最大深度。
  AlwaysUse24HourFormat	让它成为24小时格式。
  accessibleNavigation	用户是否使用辅助功能（例如 TalkBack 或 VoiceOver）与应用程序交互，旨在帮助视障人士。
  invertColors	是否支持颜色反转。
  高对比度	用户是否需要前景与背景的高对比度，可以在iOS中使用菜单“设置”->“辅助功能”->“增加对比度”。此标志仅在运行 iOS 13 或更高版本的 iOS 设备上更新。
  disableAnimations	平台是否要求禁用或减少动画（如果可能）。
  粗体文字	平台是否需要粗体文字。
  方向	是水平还是垂直。

  padding、viewPadding和viewInsets场景之间的区别是：❀♓根据大小构建不同的布局

  SafeArea 控制是通过MediaQuery应用 .of。平板电脑和手机（或者横竖屏）的布局可能会有所不同，比如下面的布局：

  布局代码如下：

  var screenSize = MediaQuery.of(context).size;
  if(screenSize.width>oneColumnLayout){
    //平板布局
  }else{
    //手机布局
  }复制代码

  oneColumnLayout表示列布局宽度。

  系统字体更改

  许多应用程序都具有通过 MediaQuery 实现的调整字体大小的功能。实现如下：

  @override
    Widget build(BuildContext context) {
      var _data = MediaQuery.of(context).copyWith(textScaleFactor: 2.0);
      return Scaffold(
        appBar: AppBar(
          title: Text('老孟'),
        ),
        body: MediaQuery(
          data: _data,
          child: Text('字体变大'),
        ),
      );
    }复制代码

  字体大小加倍。

  作者：老孟程序员
  链接：https://juejin.im/post/5e81ead56fb9a03c320b9c27
  来源：掘金版权归作者所有。商业转载请联系作者获取授权。非商业转载请注明出处。