No Materiallocalizations Found - Myapp Widgets Require Materiallocalizations To Be Provided By A Localizations Widget Ancestor

I was just trying to create an app with button which shows an alert message when the button is pressed. But it gives me this error(Mentioned below). I wrote this code by taking re

Solution 1:

This is because the context you are passing into the showDialog method is a context that doesn't yet have a MaterialLocalizations widget in the widget tree, the MaterialLocalizations widget gets added implicitly by the MaterialApp widget.

To fix it, try the following:

import'package:flutter/material.dart';

voidmain() {
  runApp(MyApp());
}

classMyAppextendsStatelessWidget {
  @overrideWidgetbuild(BuildContext context) {
    returnMaterialApp(
      title: "Test",
      home: TestPage(),
    );
  }
}

classTestPageextendsStatelessWidget {
  @overrideWidgetbuild(BuildContext context) {
    returnScaffold(
      appBar: AppBar(title: Text("Test")),
      body: Container(
        child: Center(
          child: RaisedButton(
            color: Colors.redAccent,
            textColor: Colors.white,
            onPressed: () {
              testAlert(context);
            },
            child: Text("PressMe"),
          ),
        ),
      ),
    );
  }

  voidtestAlert(BuildContext context) {
    var alert = AlertDialog(
      title: Text("Test"),
      content: Text("Done..!"),
    );

    showDialog(
        context: context,
        builder: (BuildContext context) {
          return alert;
        });
  }
}

Solution 2:

An easy fix which worked in my case was simply to move the MaterialApp widget up to the main() method.

main() {
  runApp(MaterialApp(home: App()));
}

Solution 3:

This also happens when you switch to a language that is not supported by the GlobalMaterialLocalizations delegate. It is a tricky message to understand, because it says that you should have the MaterialApp at the top of your tree, but that may already be present.

In my case, the language I was localising (UK Welsh -- cy-GB) is not catered for automatically. I had to write my own delegate for boilerplate strings, and add it to the list of localisations at the root of my app.

The code for the Belarusian delegate is here. I adapted it to cater for the Welsh language. It contains date formatting information, as well as about seventy stock phrases that material design thinks you may need, such as "SELECT ALL", "Page <x> of <y>" etc.

If you need to make a delegate that covers a language not listed in the global material localisations, then once you have created the delegate, look in your codebase, and somewhere near the top of the tree, you will have a line like

MaterialApp(
 localizationsDelegates: [
   GlobalMaterialLocalizations.delegate,
   GlobalWidgetsLocalizations.delegate,
   GlobalCupertinoLocalizations.delegate,
 ],
 supportedLocales: [
    const Locale('en', ''), // English, no country code
    const Locale('he', ''), // Hebrew, no country code
    const Locale.fromSubtags(languageCode: 'zh')
  ],
  // ...
)

Simply add CyMaterialLocalizations.delegate (or whatever you call your new language delegate) to the localizationsDelegates list.

Solution 4:

I have the same issue with showTimePicker inside of RaisedButton,

I restructured as:

runApp 
  |__MaterialApp
    |__ StatefulWidget/StatelessWidget
      |__SafeArea
        |__Scaffold
          |__ RaisedButton
            |__ showTimePicker

Here is the sample worked solution:

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

void main() {
  runApp(
    MaterialApp(
      debugShowCheckedModeBanner: false,
      localizationsDelegates: [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: [
        const Locale('en', 'US'), 
      ],
      home: Sample(),
    ),
  );
}

class Sample extends StatefulWidget {
  @override
  _SampleState createState() => _SampleState();
}

class _SampleState extends State<Sample> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: RaisedButton(
            child: Text('Time Picker'),
            onPressed: () {
              showTimePicker(
                context: context,
                initialTime: TimeOfDay(hour: 10, minute: 47),
                builder: (BuildContext context, Widget child) {
                  return MediaQuery(
                    data: MediaQuery.of(context)
                        .copyWith(alwaysUse24HourFormat: true),
                    child: child,
                  );
                },
              );
            },
          ),
        ),
      ),
    );
  }
}

Solution 5:

Another approach by wrapping the most inner widget that invokes showDialog with Builder. In this scenario, the most inner widget is TextButton (note that I replaced the deprecated RaisedButton with TextButton).

import'package:flutter/material.dart';

voidmain() => runApp(MyApp());

classMyAppextendsStatelessWidget {
  @overrideWidgetbuild(BuildContext context) {
    returnMaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("Test")),
        body: Container(
          child: Builder(
            builder: (context) {
              returnTextButton(
                child: constText('Show'),
                onPressed: () {
                  showDialog(
                    context: context,
                    builder: (_) =>AlertDialog(
                      title: Text("Test"),
                      content: Text("Done..!"),
                    ),
                  );
                },
              );
            },
          ),
        ),
      ),
    );
  }
}