Mediaquery في flutter

Flutter Dev · 9 مارس 2021

اواجه مشكلة غريبه شويه

قمت ببناء تطبيق على فلاتر التطبيق في وقت الاختبار مثلا من الاندرويد استوديو الى جهازي الحقيقي

شغال تماما بنسبة 100%100 بدون مشاكل

ولكني قمت بعمل نسخة debug.apk وقمت باخذ هذا النسخة من خلال فلاش مومري من جهاز الكمبيوتر الى جهازي الحقيقي ايضا مع حذف التثبيت السابق الذي كان من الاندويد ستوديو

وبعد تشغيل التطبيق اواجه المشكله التاليه:

Mediaquery. of O called with a 
context that does not contain a 
Mediaquery. 
No Mediaquery ancestor could be 
found starting from the context 
that was passed to 
Mediaquery. of (). This can happen 
because you do not have a 
WidgetsApp or Materia1App widget 
(those widgets introduce a 
Mediaquery), or it can happen if 
the context you use comes from a 
widget above those widgets. 
The context used was: 
Scaffold 
See also: 
http:s://flutter.Dev/docs/testing 
/errors

لا اعلم ما هيا المشكلة والغرب من ذلك ان في وقت اختبار التطبيق من خلال الاندرويد ستوديو الى جهازي التطبيق شغال 100%100 على جهازي الحقيقي ولكن هذا المشكلة تحدث مع نسخة app-debug

مع العلم ايضا اني في وقت الاختبار من حاسوبي الى جهازي الحقيقي لا احصل على اي خطاء في Run كل شي شغال تمام

وهذا كود الصفحة المستعمله:






void main() {

  runApp(
      MaterialApp(
    home: EasyLocalization(
      saveLocale: true,
      supportedLocales: [Locale('en', 'US'), Locale('ar', 'SA')],
      path: 'assets/translations',
      fallbackLocale: Locale('en', 'US'),

      child: loginpage(),
    ),
    ),
  );
}


class loginpage extends StatefulWidget {

  LoginUserState createState() => LoginUserState();
}




class LoginUserState extends State<loginpage> {


  final _formKey = GlobalKey<FormState>();

  

  
  void _toggleVisibility(){
    setState(() {
      _isHidden = !_isHidden;
    });
  }


  Widget buildTextField(String hintText){
    return Container(
        margin: EdgeInsets.all(5),
    child: TextFormField(

    validator: (value) {
    if (value.isEmpty) {
    return 'Requiredfield'.tr();
    }
    return null;
    },

    maxLength: 12,
      controller: passwordController,
      decoration: InputDecoration(
        hintText: hintText,
          labelText: 'Password'.tr(),
        hintStyle: TextStyle(
          color: Colors.grey,
          fontSize: 16.0,
        ),
        border: OutlineInputBorder(

        ),
        prefixIcon: Icon(Icons.lock),
        suffixIcon: hintText == 'Password'.tr() ? IconButton(
          onPressed: _toggleVisibility,
          icon: _isHidden ? Icon(Icons.visibility_off) : Icon(Icons.visibility),
        ) : null,
      ),
      obscureText: hintText == 'Password'.tr() ? _isHidden : false,
    ),
    );
  }



  
  }

 

}




  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
     home: Scaffold(
   
      body: Form(

      key: _formKey,

     child: Stack(

        children: [

          Column(

            children: [

             

              Container(

     child: SingleChildScrollView(


            
                child: SizedBox(
                  width: double.infinity,
                  height:350,
                  child: Center(
                     child: Column(
                      
                      children: <Widget>[
                        SizedBox(
                          height: 2.0,
                        ),
                  new Stack(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.symmetric(horizontal:45, vertical: 5),
                        child: Image.asset(
                          
                          ("assets/log.png"),
                          height: 310,
                          width: 310,

                        ),
                        ),


  ],
                    ),


                      ],
                    ),
                  ),
                ),
              ),
              ),
            ],
          ),
          SingleChildScrollView(

              padding: EdgeInsets.only(left: 7.0, right: 7.0, top: 290.0),
              child: Card(

                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8.0),
                  ),
                  elevation: 3,
             
                  child: Center(

                    child: Column(
                      children: <Widget>[

                        Padding(
                          padding: const EdgeInsets.all(5.0),

                      
                        ),
                 
                        Container(
                            margin: EdgeInsets.all(5),
                            child: TextFormField(
                             keyboardType: TextInputType.number,

                              validator: (value) {
                                if (value.isEmpty) {
                                  return 'Requiredfield'.tr();
                                }
                                return null;
                              },

                              maxLength: 12,
                              controller: phoneController,
                         
                              decoration: InputDecoration(
                                  prefixIcon: Icon(Icons.phone_iphone),
                                  border: OutlineInputBorder(),

                                  labelText: 'Phonenumber'.tr()),

                            )),
                       
                        buildTextField('Password'.tr()),


                        Column(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                         



                            RaisedButton(
                              child: Text('Login'.tr(), style: TextStyle(fontSize: 18.0, color: Colors.black),),
                              padding: EdgeInsets.only(top: 16.0, bottom:16.0, left: 90.0, right: 90.0),

                         
                              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(7)),
                             

                              onPressed: () {
                               
                              },

                            ),

    InkWell(
    onTap: () {
    Navigator.push(
    context, MaterialPageRoute(builder: (context) => Sign()));
    },
    child: Container(
    margin: EdgeInsets.symmetric(vertical: 20),
    padding: EdgeInsets.all(15),
    alignment: Alignment.bottomCenter,
    child: Column(

    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Row(
    mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
        Text(
        'DontHave'.tr(),
        style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
      ),
        SizedBox(
          width: 10,
        ),
  ],

    ),
      SizedBox(
          height: 20,
      ),
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          IconButton(
            icon: Icon(
              Icons.help_outline,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
             
            },
          ),
        

          IconButton(
            icon: Icon(
              Icons.language,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
           
            },
          ),
         ],

      ),

    ],
    ),

    ),

    ),


                          ],

                        ),

                       





                      ],

                    ),

                  ),

              ),

          ),



        ],



      ),

     ),
     ),
    );
  }
}

فيه احد يعرف سبب حدوث هذا المشكلة وكيفية حلها؟

بلال زيادة · 9 مارس 2021

حيشتغل على المحاكي طبيعي ولكن على الجهاز الحقيقي ما راح يشتغل, أنت بحاجة إلى MaterialApp أو WidgetsApp حول عنصر واجهة المستخدم الخاص بك.

عند استخدام MediaQuery ستبحث Flutter عن شجرة عناصر واجهة المستخدم للعثور على عنصر واجهة المستخدم.

فالكود الخاص بك سيصبح

void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
    home: EasyLocalization(
      saveLocale: true,
      supportedLocales: [Locale('en', 'US'), Locale('ar', 'SA')],
      path: 'assets/translations',
      fallbackLocale: Locale('en', 'US'),

      child: loginpage(),
    ),
    );
  }
}


class loginpage extends StatefulWidget {

  LoginUserState createState() => LoginUserState();
}




class LoginUserState extends State<loginpage> {


  final _formKey = GlobalKey<FormState>();

  

  
  void _toggleVisibility(){
    setState(() {
      _isHidden = !_isHidden;
    });
  }


  Widget buildTextField(String hintText){
    return Container(
        margin: EdgeInsets.all(5),
    child: TextFormField(

    validator: (value) {
    if (value.isEmpty) {
    return 'Requiredfield'.tr();
    }
    return null;
    },

    maxLength: 12,
      controller: passwordController,
      decoration: InputDecoration(
        hintText: hintText,
          labelText: 'Password'.tr(),
        hintStyle: TextStyle(
          color: Colors.grey,
          fontSize: 16.0,
        ),
        border: OutlineInputBorder(

        ),
        prefixIcon: Icon(Icons.lock),
        suffixIcon: hintText == 'Password'.tr() ? IconButton(
          onPressed: _toggleVisibility,
          icon: _isHidden ? Icon(Icons.visibility_off) : Icon(Icons.visibility),
        ) : null,
      ),
      obscureText: hintText == 'Password'.tr() ? _isHidden : false,
    ),
    );
  }



  
  }

 

}




  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
     home: Scaffold(
   
      body: Form(

      key: _formKey,

     child: Stack(

        children: [

          Column(

            children: [

             

              Container(

     child: SingleChildScrollView(


            
                child: SizedBox(
                  width: double.infinity,
                  height:350,
                  child: Center(
                     child: Column(
                      
                      children: <Widget>[
                        SizedBox(
                          height: 2.0,
                        ),
                  new Stack(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.symmetric(horizontal:45, vertical: 5),
                        child: Image.asset(
                          
                          ("assets/log.png"),
                          height: 310,
                          width: 310,

                        ),
                        ),


  ],
                    ),


                      ],
                    ),
                  ),
                ),
              ),
              ),
            ],
          ),
          SingleChildScrollView(

              padding: EdgeInsets.only(left: 7.0, right: 7.0, top: 290.0),
              child: Card(

                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8.0),
                  ),
                  elevation: 3,
             
                  child: Center(

                    child: Column(
                      children: <Widget>[

                        Padding(
                          padding: const EdgeInsets.all(5.0),

                      
                        ),
                 
                        Container(
                            margin: EdgeInsets.all(5),
                            child: TextFormField(
                             keyboardType: TextInputType.number,

                              validator: (value) {
                                if (value.isEmpty) {
                                  return 'Requiredfield'.tr();
                                }
                                return null;
                              },

                              maxLength: 12,
                              controller: phoneController,
                         
                              decoration: InputDecoration(
                                  prefixIcon: Icon(Icons.phone_iphone),
                                  border: OutlineInputBorder(),

                                  labelText: 'Phonenumber'.tr()),

                            )),
                       
                        buildTextField('Password'.tr()),


                        Column(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                         



                            RaisedButton(
                              child: Text('Login'.tr(), style: TextStyle(fontSize: 18.0, color: Colors.black),),
                              padding: EdgeInsets.only(top: 16.0, bottom:16.0, left: 90.0, right: 90.0),

                         
                              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(7)),
                             

                              onPressed: () {
                               
                              },

                            ),

    InkWell(
    onTap: () {
    Navigator.push(
    context, MaterialPageRoute(builder: (context) => Sign()));
    },
    child: Container(
    margin: EdgeInsets.symmetric(vertical: 20),
    padding: EdgeInsets.all(15),
    alignment: Alignment.bottomCenter,
    child: Column(

    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Row(
    mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
        Text(
        'DontHave'.tr(),
        style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
      ),
        SizedBox(
          width: 10,
        ),
  ],

    ),
      SizedBox(
          height: 20,
      ),
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          IconButton(
            icon: Icon(
              Icons.help_outline,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
             
            },
          ),
        

          IconButton(
            icon: Icon(
              Icons.language,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
           
            },
          ),
         ],

      ),

    ],
    ),

    ),

    ),


                          ],

                        ),

                       





                      ],

                    ),

                  ),

              ),

          ),



        ],



      ),

     ),
     ),
    );
  }
}

Flutter Dev · 9 مارس 2021

بتاريخ 2 ساعات قال بلال زيادة:

حيشتغل على المحاكي طبيعي ولكن على الجهاز الحقيقي ما راح يشتغل, أنت بحاجة إلى MaterialApp أو WidgetsApp حول عنصر واجهة المستخدم الخاص بك.

عند استخدام MediaQuery ستبحث Flutter عن شجرة عناصر واجهة المستخدم للعثور على عنصر واجهة المستخدم.

فالكود الخاص بك سيصبح


void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
    home: EasyLocalization(
      saveLocale: true,
      supportedLocales: [Locale('en', 'US'), Locale('ar', 'SA')],
      path: 'assets/translations',
      fallbackLocale: Locale('en', 'US'),

      child: loginpage(),
    ),
    );
  }
}


class loginpage extends StatefulWidget {

  LoginUserState createState() => LoginUserState();
}




class LoginUserState extends State<loginpage> {


  final _formKey = GlobalKey<FormState>();

  

  
  void _toggleVisibility(){
    setState(() {
      _isHidden = !_isHidden;
    });
  }


  Widget buildTextField(String hintText){
    return Container(
        margin: EdgeInsets.all(5),
    child: TextFormField(

    validator: (value) {
    if (value.isEmpty) {
    return 'Requiredfield'.tr();
    }
    return null;
    },

    maxLength: 12,
      controller: passwordController,
      decoration: InputDecoration(
        hintText: hintText,
          labelText: 'Password'.tr(),
        hintStyle: TextStyle(
          color: Colors.grey,
          fontSize: 16.0,
        ),
        border: OutlineInputBorder(

        ),
        prefixIcon: Icon(Icons.lock),
        suffixIcon: hintText == 'Password'.tr() ? IconButton(
          onPressed: _toggleVisibility,
          icon: _isHidden ? Icon(Icons.visibility_off) : Icon(Icons.visibility),
        ) : null,
      ),
      obscureText: hintText == 'Password'.tr() ? _isHidden : false,
    ),
    );
  }



  
  }

 

}




  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
     home: Scaffold(
   
      body: Form(

      key: _formKey,

     child: Stack(

        children: [

          Column(

            children: [

             

              Container(

     child: SingleChildScrollView(


            
                child: SizedBox(
                  width: double.infinity,
                  height:350,
                  child: Center(
                     child: Column(
                      
                      children: <Widget>[
                        SizedBox(
                          height: 2.0,
                        ),
                  new Stack(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.symmetric(horizontal:45, vertical: 5),
                        child: Image.asset(
                          
                          ("assets/log.png"),
                          height: 310,
                          width: 310,

                        ),
                        ),


  ],
                    ),


                      ],
                    ),
                  ),
                ),
              ),
              ),
            ],
          ),
          SingleChildScrollView(

              padding: EdgeInsets.only(left: 7.0, right: 7.0, top: 290.0),
              child: Card(

                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8.0),
                  ),
                  elevation: 3,
             
                  child: Center(

                    child: Column(
                      children: <Widget>[

                        Padding(
                          padding: const EdgeInsets.all(5.0),

                      
                        ),
                 
                        Container(
                            margin: EdgeInsets.all(5),
                            child: TextFormField(
                             keyboardType: TextInputType.number,

                              validator: (value) {
                                if (value.isEmpty) {
                                  return 'Requiredfield'.tr();
                                }
                                return null;
                              },

                              maxLength: 12,
                              controller: phoneController,
                         
                              decoration: InputDecoration(
                                  prefixIcon: Icon(Icons.phone_iphone),
                                  border: OutlineInputBorder(),

                                  labelText: 'Phonenumber'.tr()),

                            )),
                       
                        buildTextField('Password'.tr()),


                        Column(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                         



                            RaisedButton(
                              child: Text('Login'.tr(), style: TextStyle(fontSize: 18.0, color: Colors.black),),
                              padding: EdgeInsets.only(top: 16.0, bottom:16.0, left: 90.0, right: 90.0),

                         
                              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(7)),
                             

                              onPressed: () {
                               
                              },

                            ),

    InkWell(
    onTap: () {
    Navigator.push(
    context, MaterialPageRoute(builder: (context) => Sign()));
    },
    child: Container(
    margin: EdgeInsets.symmetric(vertical: 20),
    padding: EdgeInsets.all(15),
    alignment: Alignment.bottomCenter,
    child: Column(

    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Row(
    mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
        Text(
        'DontHave'.tr(),
        style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
      ),
        SizedBox(
          width: 10,
        ),
  ],

    ),
      SizedBox(
          height: 20,
      ),
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          IconButton(
            icon: Icon(
              Icons.help_outline,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
             
            },
          ),
        

          IconButton(
            icon: Icon(
              Icons.language,
              color: const Color(0xFF001c3e),
              size: 47,
            ),
            onPressed: () {
           
            },
          ),
         ],

      ),

    ],
    ),

    ),

    ),


                          ],

                        ),

                       





                      ],

                    ),

                  ),

              ),

          ),



        ],



      ),

     ),
     ),
    );
  }
}

اهلا بك اخي الكريم

شاكر لك جوابك عزيزي

ولكن المشكلة لم تحل ما زال يظهر نفس كود الخطاء قمت باضافة تعليماتك هذا الى مشروعي

void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
    home: EasyLocalization(
      saveLocale: true,
      supportedLocales: [Locale('en', 'US'), Locale('ar', 'SA')],
      path: 'assets/translations',
      fallbackLocale: Locale('en', 'US'),

      child: loginpage(),
    ),
    );
  }
}

بلال زيادة · 9 مارس 2021

ممكن ترفق ملفات المشروع كاملاً ؟

Flutter Dev · 9 مارس 2021

بتاريخ On 3/9/2021 at 21:41 قال بلال زيادة:

ممكن ترفق ملفات المشروع كاملاً ؟

اهلا بك اخي

اعتذر منك لقد وجدت سبب المشكله هذا اول تطبيق لي في فلاتر عشان كذا ما كنت اعلم ان اول صفحه سوف تاخذ موقع صفحة main وانا كنت شغال على صفحة تسجيل الدخول التي هيا اول صفحه في تطبيقي

المشكله الوحيده فقط الان انا لا ارغب بوضع main الصفحة الاساسيه كيف يمكن تغيرها او هيا اساسيه من فلاتر ويجب ان تكون هيا اول صفحه يعمل عليها التطبيق؟

بلال زيادة · 9 مارس 2021

بتاريخ 2 دقائق مضت قال مروان مروان3:

اهلا بك اخي

اعتذر منك لقد وجدت سبب المشكله هذا اول تطبيق لي في فلاتر عشان كذا ما كنت اعلم ان اول صفحه سوف تاخذ موقع صفحة main وانا كنت شغال على صفحة تسجيل الدخول التي هيا اول صفحه في تطبيقي

المشكله الوحيده فقط الان انا لا ارغب بوضع main الصفحة الاساسيه كيف يمكن تغيرها او هيا اساسيه من فلاتر ويجب ان تكون هيا اول صفحه يعمل عليها التطبيق؟

التطبيق لا يعمل بدون دالة main.

Flutter Dev · 9 مارس 2021

بتاريخ 7 دقائق مضت قال بلال زيادة:

التطبيق لا يعمل بدون دالة main.

ساقوم بنقل الملف كامل لا توجد مشكله او استبدال الصفحات بالاصح

كل الشكر لك الغالي الكود الذي وضعته كان مفيد لي

Mediaquery في flutter

السؤال

Flutter Dev

6 أجوبة على هذا السؤال

Recommended Posts

بلال زيادة

Flutter Dev

بلال زيادة

Flutter Dev

بلال زيادة

Flutter Dev

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية