Issues with Flutter's MaterialLocalizations

Question

I have issues with my Material Widgets (AppBar widget as an example). I tried to find a solution in other SO questions but nothing is working. In production App bar's back button, and some other material files aren't working too, even material clipboard.

[Edit] I found out that the issue was with not supported language (Turkmen/Russian - two main languages of my app) in some non-global (Chinese, Hindu) phones. There were no issues with other iOS / Android devices.

So there is my MaterialApp file:

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:peydaly.market/blocs/markets_provider.dart';
import 'package:peydaly.market/generated/l10n.dart';
import 'package:peydaly.market/screens/loading_screen.dart';

import 'blocs/markets_provider.dart';

class App extends StatelessWidget {
  @override
  Widget build(context) {
    return MarketsProvider(
      child: MaterialApp(
        localizationsDelegates: [
          S.delegate,
          GlobalMaterialLocalizations.delegate,
          GlobalWidgetsLocalizations.delegate,
          GlobalCupertinoLocalizations.delegate,
        ],
        supportedLocales: S.delegate.supportedLocales,
        debugShowCheckedModeBanner: false,
        darkTheme: buildDarkMode(),
        theme: buildLightMode(),
        title: 'Peýdaly.Market',
        home: LoadingScreen(),
      ),
    );
  }

  ThemeData buildLightMode() {
    return ThemeData.light().copyWith(
      buttonTheme: ButtonThemeData(
        minWidth: 10,
      ),
      primaryColor: Colors.grey[100],
      backgroundColor: Colors.white,
      iconTheme: IconThemeData(
        color: Colors.grey[900],
      ),
      appBarTheme: AppBarTheme(
        centerTitle: true,
        brightness: Brightness.light,
        iconTheme: IconThemeData(
          color: Colors.grey[900],
        ),
        actionsIconTheme: IconThemeData(
          color: Colors.grey[900],
        ),
        // brightness: Brightness.light,
        color: Colors.white,
        textTheme: TextTheme(
          headline6: TextStyle(
            color: Colors.grey[900],
            fontWeight: FontWeight.w600,
          ),
        ),
        elevation: 0,
      ),
    );
  }

  ThemeData buildDarkMode() {
    return ThemeData.dark().copyWith(
      buttonTheme: ButtonThemeData(
        minWidth: 10,
      ),
      backgroundColor: Colors.grey[900],
      primaryColor: Colors.grey[850],
      iconTheme: IconThemeData(
        color: Colors.white,
      ),
      appBarTheme: AppBarTheme(
        centerTitle: true,
        brightness: Brightness.dark,
        iconTheme: IconThemeData(
          color: Colors.white,
        ),
        actionsIconTheme: IconThemeData(
          color: Colors.white,
        ),
        // brightness: Brightness.dark,
        color: Colors.grey[900],
        textTheme: TextTheme(
          headline6: TextStyle(
            color: Colors.grey[100],
            fontWeight: FontWeight.w600,
          ),
        ),
        elevation: 0,
      ),
    );
  }
}

My pubspec.yaml file:

name: peydaly.market
description: Subscription Online Groceries delivery service app for mobile devices.
version: 0.2+23

environment:
  sdk: ">=2.7.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  animations: ^1.1.2
  cached_network_image: ^2.2.0+1
  carousel_slider: ^2.3.1
  crypto: ^2.1.5
  cupertino_icons: ^1.0.0
  cupertino_rounded_corners: ^1.0.3
  date_format: ^1.0.9
  flare_flutter: ^2.0.6
  flutter_polyline_points: ^0.2.4
  futuristic: ^0.1.3
  google_maps_flutter: ^1.0.6
  http: ^0.12.1
  intl: 0.16.1
  location: ^3.0.2
  modal_bottom_sheet: ^0.2.2
  path_provider: ^1.6.14
  rive: ^0.6.3
  rxdart: ^0.24.1
  shimmer: ^1.1.1
  splashscreen: ^1.3.4
  sqflite: ^1.3.1+1
  superellipse_shape: ^0.1.5

dev_dependencies:
  flutter_test:
    sdk: flutter
  pedantic: ^1.4.0

flutter:
  uses-material-design: true
  generate: true
  assets:
    - assets/social/
    - assets/playlists/
    - assets/avatar/
    - assets/sql/
flutter_localizations:
    sdk: flutter
flutter_intl:
  enabled: true
  class_name: S
  main_locale: tm

flutter_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"

And my debug console error.

═══════ Exception caught by widgets library ═══════════════════════════════════
The following assertion was thrown building AppBar(dirty, dependencies: [_LocalizationsScope-[GlobalKey#2fd79]], state: _AppBarState#848b3):
No MaterialLocalizations found.

AppBar widgets require MaterialLocalizations to be provided by a Localizations widget ancestor.
The material library uses Localizations to generate messages, labels, and abbreviations.

To introduce a MaterialLocalizations, either use a MaterialApp at the root of your application to include them automatically or add a Localization widget with a MaterialLocalizations delegate.

The specific widget that could not find a MaterialLocalizations ancestor was: AppBar
    dirty
    dependencies: [_LocalizationsScope-[GlobalKey#2fd79]]
    state: _AppBarState#848b3
The ancestors of this widget were
    Scaffold
        dependencies: [_InheritedTheme, _LocalizationsScope-[GlobalKey#2fd79], Directionality, MediaQuery, _EffectiveTickerMode]
        state: ScaffoldState#0f235(tickers: tracking 2 tickers)
    CitySelectionScreen
        dependencies: [_InheritedTheme, _LocalizationsScope-[GlobalKey#2fd79], MarketsProvider]
        state: _CitySelectionScreenState#fb711
    MaterialApp
        state: _MaterialAppState#44c02
    MarketsProvider
    App
    ...
The relevant error-causing widget was
AppBar
lib/screens/city_selection_screen.dart:53
When the exception was thrown, this was the stack
#0      debugCheckHasMaterialLocalizations.<anonymous closure>
package:flutter/…/material/debug.dart:74
#1      debugCheckHasMaterialLocalizations
package:flutter/…/material/debug.dart:94
#2      _AppBarState.build
package:flutter/…/material/app_bar.dart:509
#3      StatefulElement.build
package:flutter/…/widgets/framework.dart:4744
#4      ComponentElement.performRebuild
package:flutter/…/widgets/framework.dart:4627
...
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by widgets library ═══════════════════════════════════
No MaterialLocalizations found.
The ancestors of this widget were
    Scaffold
        dependencies: [_InheritedTheme, _LocalizationsScope-[GlobalKey#2fd79], Directionality, MediaQuery, _EffectiveTickerMode]
        state: ScaffoldState#0f235(tickers: tracking 2 tickers)
    CitySelectionScreen
        dependencies: [_InheritedTheme, _LocalizationsScope-[GlobalKey#2fd79], MarketsProvider]
        state: _CitySelectionScreenState#fb711
    MaterialApp
        state: _MaterialAppState#44c02
    MarketsProvider
    App
    ...
The relevant error-causing widget was
AppBar
lib/screens/city_selection_screen.dart:53
════════════════════════════════════════════════════════════════════════════════

Answer 1

So the issue was with App localization issues of Material UI elements on unsupported devices, so to add support to it, I added these lines to my App file:

supportedLocales: [
  const Locale('ru'),
  const Locale('tm'),
  ...S.delegate.supportedLocales,
],