【错误记录】Flutter 界面报错 ( No MediaQuery widget ancestor found. | Scaffold widgets require a MediaQuery )

文章目录

• 一、报错信息
• 二、解决方案

一、报错信息

---

Flutter 应用运行时报如下错误 :

代码语言：javascript复制

Launching libmain.dart on Pixel 2 in debug mode...
Running Gradle task 'assembleDebug'...
√ Built buildappoutputsflutter-apkapp-debug.apk.
Installing buildappoutputsflutter-apkapp.apk...
Uninstalling old version...
Error: ADB exited with exit code 1
Performing Streamed Install

adb: failed to install D:02_Project02_Android_Learnflutter_animationbuildappoutputsflutter-apkapp.apk: Failure [INSTALL_FAILED_UPDATE_INCOMPATIBLE: Package kim.hsl.flutter_animation signatures do not match previously installed version; ignoring!]
Installing buildappoutputsflutter-apkapp.apk...
Debug service listening on ws://127.0.0.1:59548/20KwYgDmkUc=/ws
Syncing files to device Pixel 2...

======== Exception caught by widgets library =======================================================
The following assertion was thrown building HeroAnimation:
No MediaQuery widget ancestor found.

Scaffold widgets require a MediaQuery widget ancestor.
The specific widget that could not find a MediaQuery ancestor was: Scaffold
  dirty
  state: ScaffoldState#6ef6f(lifecycle state: initialized, tickers: tracking 2 tickers)
The ownership chain for the affected widget is: "Scaffold ← HeroAnimation ← [root]"

No MediaQuery ancestor could be found starting from the context that was passed to MediaQuery.of(). This can happen because you have not added a WidgetsApp, CupertinoApp, or MaterialApp widget (those widgets introduce a MediaQuery), or it can happen if the context you use comes from a widget above those widgets.

The relevant error-causing widget was: 
  HeroAnimation file:///D:/002_Project/002_Android_Learn/flutter_animation/lib/main.dart:5:10
When the exception was thrown, this was the stack: 
#0      debugCheckHasMediaQuery.<anonymous closure> (package:flutter/src/widgets/debug.dart:219:7)
#1      debugCheckHasMediaQuery (package:flutter/src/widgets/debug.dart:234:4)
#2      MediaQuery.of (package:flutter/src/widgets/media_query.dart:820:12)
#3      ScaffoldState.didChangeDependencies (package:flutter/src/material/scaffold.dart:2820:50)
#4      StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4725:11)
...
====================================================================================================

出错代码 :

代码语言：javascript复制

void main() {
  runApp(HeroAnimation());
}

class HeroAnimation extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // 时间膨胀系数 , 用于降低动画运行速度
    timeDilation = 10.0;
    return Scaffold(
      appBar: AppBar(
        title: Text("Hero 动画演示( 跳转前页面 )"),
      ),
      body: Center(
        child: HeroWidget(
          imageUrl: "https://img-blog.csdnimg.cn/20210329101628636.jpg",
          width: 300,
        ),
      ),
    );
  }
}

二、解决方案

---

出现上述问题 , 是因为在界面的根组件 , 没有使用 MaterialApp 组件 , 在 main.dart 中的 main 函数中 , 运行的组件的根组件必须是 MaterialApp ;

在 Scaffold 组件的外层包裹一层 MaterialApp , 即可解决问题 ;

代码语言：javascript复制

class HeroAnimation extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // 时间膨胀系数 , 用于降低动画运行速度
    timeDilation = 10.0;
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Hero 动画演示( 跳转前页面 )"),
        ),
        body: ,
      ),
    );
  }

}

flutter dart 函数 解决方案

0 人点赞