Localization issue in Flutter - AppLocalizations not found`

Question

I have added localization into my flutter app following flutter tutorial and few guidelines on internet. However, it seems not working.

I have done this in my main.dart

import 'firebase_options.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        theme: ThemeData(
          fontFamily: 'ProxymaNovaLight',
        ),
        localizationsDelegates: AppLocalizations.localizationsDelegates,
        supportedLocales: AppLocalizations.supportedLocales,
        debugShowCheckedModeBanner: false,
        home: const MainPage());
  }
}

Then I want to access one of the variable defined in my app_en.arb to display a text on my signin page.

The app_en.arb is as below:

{
    "signIn": "Sign In",
    "@signIn": {
        "description": "Text for SignIn button"
    }
}

So I did in signin.dart:

import "dart:async";
import "dart:ui";
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

...

Widget emailTextField(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 25.0),
      child: Container(
        decoration: BoxDecoration(
          color: Colors.white70,
          borderRadius: BorderRadius.circular(10),
        ),
        child: Padding(
          padding: const EdgeInsets.only(left: 20.0),
          child: TextField(
            controller: _emailController,
            decoration: const InputDecoration(
              border: InputBorder.none,
              hintText: AppLocalizations.of(context).signIn
            ),
          ),
        ),
      ),
    );
  }

AppLocalizations.of(context).signIn remain underlined in red with the note: Invalid constant value.dart(invalid_constant)

and below is a screenshot of my folders

I have added all required package in my pubspec.yaml.

Any idea why I cannot access my string >

Answer 1

Your localized string isn’t a constant value so you have to remove const modifier before InputDecoration.

decoration: const InputDecoration

To

decoration: InputDecoration