如何解决 Flutter 中的 MediaQuery 错误？ [复制]

Posted 2023-02-23

【中文标题】如何解决 Flutter 中的 MediaQuery 错误？ [复制]

【英文标题】：How could I resolve a MediaQuery error in flutter? [duplicate]

【发布时间】：2021-07-01 16:38:41

【问题描述】：

我最近在 Flutter 中遇到了这个错误：

使用不包含 MediaQuery 的上下文调用 MediaQuery.of()。

这是我的代码：

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
void main()
 runApp(Home());


class Home extends StatefulWidget 
@override
 _HomeState createState() => _HomeState();


 class _HomeState extends State<Home> 
 @override
 Widget build(BuildContext context) 
 final size = MediaQuery.of(context).size;
 return  MaterialApp(
   title: 'Refresh my mind',
   debugShowCheckedModeBanner: false,
   theme: ThemeData(
     primarySwatch: Colors.red,
   ),
   home:Scaffold(

     appBar: AppBar(
       title: Text("Hello"),
       leading: Icon(
           Icons.ac_unit
       ),
       actions: [Icon(Icons.account_balance),
         Icon(Icons.airplanemode_active),
         Icon(Icons.autorenew),],
       elevation: 12,
     ),

     backgroundColor: Colors.teal,
     body: Container(
       color: Colors.black12,
   margin: EdgeInsets.all(20),
       child: Center(
         child: Card(
           elevation: 5.0,
           color: Colors.grey,
           child: Container(
             width: size.width/1.5,
             height: 200,
           ),
         ),

       ),
     ),
   ),

 );

我在互联网上搜索，发现我必须使用其他 MaterialApp 小部件或 WidgetApp，但我在代码中使用了 MaterialApp。

所以我想知道，应该是什么错误？

谢谢

【问题讨论】：

这能回答你的问题吗？ Flutter Error: MediaQuery.of() called with a context that does not contain a MediaQuery

【参考方案1】：

这可能是因为 MaterialApp 尚未初始化。尝试将您的主页小部件移动到单独的文件（例如 home_screen.dart）并将其传递给 MaterialApp，例如：

MaterialApp(home:HomeScreen())

在您的主屏幕中使用MediaQuery

【讨论】：

是的！在这种情况下，您的上下文来自您的 MaterialApp，因此在初始化 MaterialApp 之前您将无法访问上下文！