老
孟
一枚
有态度
的程序员
注意：无特殊说明，Flutter版本及Dart版本如下：
- Flutter版本：1.12.13 hotfix.5
- Dart版本：2.7.0
MediaQuery
通常情况下，不会直接将MediaQuery当作一个控件，而是使用MediaQuery.of获取当前设备的信息，用法如下：
var data = MediaQuery.of(context);
此方式必须放在MediaQuery作用域内，否则会抛出异常，MaterialApp和WidgetsApp都引入了MediaQuery，并且随着屏幕的变化而导致重建，比如旋转屏幕、弹出输入框等。
MediaQueryData
MediaQueryData是MediaQuery.of获取数据的类型。说明如下：
逻辑像素，并不是物理像素，类似于Android中的dp，逻辑像素会在不同大小的手机上显示的大小基本一样，物理像素 = size*devicePixelRatio。padding、viewPadding和viewInsets的区别如下：
使用场景
根据尺寸构建不同的布局
SafeArea控件就是通过MediaQuery.of来实现的，平板和手机的（或者横屏和竖屏）布局可能是不一样的，比如如下布局：
布局代码如下：
代码语言：javascript复制var screenSize = MediaQuery.of(context).size;
if(screenSize.width>oneColumnLayout){
//平板布局
}else{
//手机布局
}
oneColumnLayout表示一列布局的宽度。
系统字体变化
很多App都有一个功能就是调节字体大小，通过MediaQuery来实现，实现如下：
代码语言：javascript复制@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('字体变大'),
),
);
}
字体变大了一倍。
