注意：無特殊說明，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獲取數據的類型。說明如下：
| 屬性 | 說明 |
|---|---|
| size | 邏輯像素，並不是物理像素，類似於Android中的dp，邏輯像素會在不同大小的手機上顯示的大小基本一樣，物理像素 = size*devicePixelRatio。 |
| devicePixelRatio | 單位邏輯像素的物理像素數量，即設備像素比。 |
| textScaleFactor | 單位邏輯像素字體像素數，如果設置爲1.5則比指定的字體大50%。 |
| platformBrightness | 當前設備的亮度模式，比如在Android Pie手機上進入省電模式，所有的App將會使用深色（dark）模式繪製。 |
| viewInsets | 被系統遮擋的部分，通常指鍵盤，彈出鍵盤，viewInsets.bottom表示鍵盤的高度。 |
| padding | 被系統遮擋的部分，通常指“劉海屏”或者系統狀態欄。 |
| viewPadding | 被系統遮擋的部分，通常指“劉海屏”或者系統狀態欄，此值獨立於padding和viewInsets，它們的值從MediaQuery控件邊界的邊緣開始測量。在移動設備上，通常是全屏。 |
| systemGestureInsets | 顯示屏邊緣上系統“消耗”的區域輸入事件，並阻止將這些事件傳遞給應用。比如在Android Q手勢滑動用於頁面導航（ios也一樣），比如左滑退出當前頁面。 |
| physicalDepth | 設備的最大深度，類似於三維空間的Z軸。 |
| alwaysUse24HourFormat | 是否是24小時制。 |
| accessibleNavigation | 用戶是否使用諸如TalkBack或VoiceOver之類的輔助功能與應用程序進行交互，用於幫助視力有障礙的人進行使用。 |
| invertColors | 是否支持顏色反轉。 |
| highContrast | 用戶是否要求前景與背景之間的對比度高， iOS上，方法是通過“設置”->“輔助功能”->“增加對比度”。 此標誌僅在運行iOS 13的iOS設備上更新或以上。 |
| disableAnimations | 平臺是否要求儘可能禁用或減少動畫。 |
| boldText | 平臺是否要求使用粗體。 |
| orientation | 是橫屏還是豎屏。 |
padding、viewPadding和viewInsets的區別如下：
使用場景
根據尺寸構建不同的佈局
SafeArea控件就是通過MediaQuery.of來實現的，平板和手機的（或者橫屏和豎屏）佈局可能是不一樣的，比如如下佈局：
佈局代碼如下：
var screenSize = MediaQuery.of(context).size;
if(screenSize.width>oneColumnLayout){
//平板佈局
}else{
//手機佈局
}oneColumnLayout表示一列布局的寬度。
系統字體變化
很多App都有一個功能就是調節字體大小，通過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('字體變大'),
),
);
}字體變大了一倍。
交流
如果你對Flutter還有疑問或者技術方面的疑惑，歡迎加入Flutter交流羣（微信：laomengit）。
同時也歡迎關注我的Flutter公衆號【老孟程序員】，公衆號首發Flutter的相關內容。
推薦一個Flutter學習地址：http://laomengit.com 裏面包含150多個組件的詳細用法。