Master Flutter Localization: Multi-Language Setup & Best Practices Urdu/Hindi

[@jawadaslam8537]

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:youtube/providers.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
class FirstScreen extends StatelessWidget {
AppLocalizations? translatesText;
TextStyle myStyle= const TextStyle(fontSize: 34,fontWeight: FontWeight.bold);
@override
Widget build(BuildContext context) {
translatesText=AppLocalizations.of(context);
return Scaffold(
appBar: AppBar(title: Text(translatesText?.welcome??'',style: myStyle,),),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
languageDropdown(context),
customButton(text: translatesText?.login??"",onTap: (){}),
customButton(text: translatesText?.register??"",onTap: (){}),
customButton(text: translatesText?.logout??"",onTap: (){}),
CupertinoButton(child: Text(translatesText?.welcome??''), onPressed: (){})
],
),
),
);
}
Widget customButton({required String text,required Function() onTap}){
return Container(
height: 120,
width: 200,
padding: const EdgeInsets.symmetric(vertical: 20),
child: ElevatedButton(onPressed: onTap, child:
Text(text,style: myStyle,),),
);
}
Widget languageDropdown(BuildContext context) {
return Consumer(
builder: (context, languageProvider, child) {
return DropdownButton(
value: languageProvider.language,
onChanged: (String? newValue) {
print(newValue.toString());
context.read().setLanguage(newValue.toString());
},
items: ['English','اردو', 'हिन्दी']
.map((String value) {
return DropdownMenuItem(
value: value,
child: Text(value,style: myStyle),
);
}).toList(),
);
},
);
}
}

[@jawadaslam8537]

First screen Ui

[@jawadaslam8537]

import 'package:flutter/material.dart';
class LanguageProvider with ChangeNotifier {
Locale locale = const Locale('en', '');
String language='English';
final Map _localeMap = {'English': const Locale('en', ''),
'اردو': const Locale('ur', ''), 'हिन्दी': const Locale('hi', ''),};
void setLanguage(String newLanguage) {
language=newLanguage;
locale=_localeMap[newLanguage] ?? const Locale('en', '');
print('locale is $locale $language');
notifyListeners();
}
}

[@jawadaslam8537]

Provider

[@jawadaslam8537]

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'first_screen.dart';
import 'providers.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider(create: (context) => LanguageProvider(),)
],
child: Consumer(
builder: (context, languageProvider, child) {
return MaterialApp(
localizationsDelegates: const [
AppLocalizations.delegate,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],
locale: languageProvider.locale ,
supportedLocales: const [
Locale('en', ''), // English
Locale('ur', ''), // Urdu
Locale('hi', ''), // Hindi
],
debugShowCheckedModeBanner: false,
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: false,
),
home: FirstScreen(),
);
},
),
);
}
}

[@jawadaslam8537]

Main