I have an app where I am converting English to Arabic. I am using easy localization package. The problem I am facing is, I am only able to convert one page (the page in which I choose the English is turning to Arabic) but when I go to another page, no translation is being done. The current code is this:

main.dart

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyLocalization.ensureInitialized();

  runApp(EasyLocalization(
    supportedLocales: [
      Locale("en"),
      Locale("ar"),
    ],
    path: 'assets/languages',
    saveLocale: true,
    fallbackLocale: Locale('en'),
    child:  MyApp(),
  ));
}

class MyApp extends StatelessWidget {

   MyApp({Key? key}) : super(key: key);
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
      
        primarySwatch: Colors.blue,
      ),
      localizationsDelegates: context.localizationDelegates,
      supportedLocales: context.supportedLocales ,
      locale: context.locale,
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

This is the code in which I am converting the language from English to Arabic (I am using a drop down to change):

    String? dropdownvalue = 'English';
    Locale? lang = Locale("en");

    // List of items in our dropdown menu

    final language = Material(
      elevation: 0.9,
      borderRadius: BorderRadius.circular(10),
      child: Container(
        width: width*0.95,
        height: height*0.13,

        decoration:  BoxDecoration(
          borderRadius: BorderRadius.circular(150),),

        child: SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: Container(


            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Container(
                  height: height*0.13,


                  width: width*0.16,

                  child:
                  Image.asset('assets/images/fa_language.png'),
                  decoration: BoxDecoration(
                    color: Color(0xFFF9F2E7),

                    borderRadius: BorderRadius.circular(10),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.only(top: 8.0,bottom: 8.0,left: 15.0,right: 15.0),
                  child: Row(
                    children: [
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          SizedBox(height: 10,),
                          Text("Language".tr().toString(),style: GoogleFonts.barlow(textStyle:  TextStyle(fontFamily: 'Barlow',fontSize: 14,fontWeight: FontWeight.w500,fontStyle: FontStyle.normal,color:Color(0xFF222222) ),),
                          ),SizedBox(height: height*0.01,),
                          Container(
                            width: width*0.69,
                            decoration: BoxDecoration(
                              border: Border.all(width: 1.4, color: Color(0xFFEEEEEE)),

                              borderRadius: BorderRadius.all(Radius.circular(4)),
                            ),

                            child: Row(
                              children: [
                                SizedBox(
                                  height: 32,
                                  child: DropdownButtonHideUnderline(
                                    child: DropdownButton(
                                      iconSize: 0.0,
                                      // Initial Value
                                      value: lang,
                                      // Down Arrow Icon

                                      // Array list of items
                                        items: [
                                    DropdownMenuItem( value: Locale( 'en' ),
                                    child: Text( '   English',    style: GoogleFonts.barlow(textStyle:  TextStyle(fontFamily: 'Barlow',fontSize: 14,fontWeight: FontWeight.w500,fontStyle: FontStyle.normal,color:Color(0xFF222222) ),),),),
                              DropdownMenuItem( value: Locale( 'ar' ),

                                child: Text( '  العربية'),),

                                  ],

                                      onChanged: (Locale? newValue) {
                                        setState(() {
                                          // lang = newValue! as Locale?;
                                          dropdownvalue="ej";
                                          context.locale = newValue!;

                                        });
                                      },
                                    ),
                                  ),
                                ),
                                SizedBox(width: width*0.47,),
                                ImageIcon(AssetImage("assets/images/downArrow.png")),
                              ],
                            ),
                          ),



                        ],
                      ),

                    ],
                  ),
                ),

              ],
            ),

          ),
        ),
      ),
    );

To change the language in this page I just add this to change the language:

Text("hello".tr().toString());

and it works. But if I do the same thing in another page it does not. Can someone help me please?

CodePudding user response：

It is because you are not setting the app locale to your selected locale language.

Use the following code in your onChanged function in your dropDown:

context.setLocale(Locale('en', 'US'));