close

[Solved] No MediaQuery widget found in flutter

Hello Guys How are you all? Hope You all are fine. When I was trying to run my flutter app and suddenly I get the following error in my stack track. No MediaQuery widget found in a flutter. So today Here I come with all possible solutions for this error.

We are providing you all possible solutions to solve this error. let’s start this article without wasting your time.

How No MediaQuery widget found Error Occurs ?

I run My code and its give me media Query error.

════════ Exception caught by gesture ═══════════════════════════════════════════
The following assertion was thrown while handling a gesture:
No MediaQuery widget found.

MyApp widgets require a MediaQuery widget ancestor.
The specific widget that could not find a MediaQuery ancestor was: MyApp
    state: _MyAppState#af72b

How to Solve No MediaQuery widget found Error?

  1. How to Solve No MediaQuery widget found Error?

    To solve this No MediaQuery widget found Error You Must have to use MaterialApp() to use MediaQuery. You cant use MediaQuery without MaterialApp Widget To use MediaQuery.of() function, first, you need to wrap your widget with MaterialApp(), even after that, you may get the error. To solve this error fully, you need to place MaterialApp() widget like below.

  2. No MediaQuery widget found Error

    To solve this No MediaQuery widget found Error You Must have to use MaterialApp() to use MediaQuery. You cant use MediaQuery without MaterialApp Widget To use MediaQuery.of() function, first, you need to wrap your widget with MaterialApp(), even after that, you may get the error. To solve this error fully, you need to place MaterialApp() widget like below.

Solution 1

You cant use MediaQuery without MaterialApp Widget To use MediaQuery.of() function, first, you need to wrap your widget with MaterialApp(), even after that, you may get the error. To solve this error fully, you need to place MaterialApp() widget like below:

import 'package:flutter/material.dart';
void main(){
  runApp(MyApp());
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp( 
      home: LoginScreen()             
    );
  }
}

class LoginScreen extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
     return Scaffold(
          body: Container( 
                //Now you can use MediaQuery
                 width: MediaQuery.of(context).size.width,
                 height: MediaQuery.of(context).size.height * 0.4, 
             )
       );
  }
}

Read More About MediaQuery.

Solution 2

You Must have to use MaterialApp() to use MediaQuery.

Summery

So, It’s All About This Error. I hope this tutorial helps you to Solve your error. Please Comment Below if You stucks anywhere with my code. And please comment below which solution worked for you. Thank You.

Also Check Out Below Tutorials

Leave a Comment

%d bloggers like this: