initalize static string member in dart with a localized value using flutter_intl localization lib

Question

I'm new to flutter and collecting fragments of code from here and there.

I have a class that holds some data that will be passed later to a widget and generate the UI based on the passed data

class OnBoardingViewModel with ChangeNotifier {

  final List<OnBoardingPageContent> onBoardingPages = [
    OnBoardingPageContent(
      image: ImageManager.onBoardingImage1,
      title: StringManager.onBoardingTitle1,// I want the text to be localized 
      subtitle: StringManager.onBoardingSubTitle1,
    ),
    OnBoardingPageContent(
      image: ImageManager.onBoardingImage2,
      title: StringManager.onBoardingTitle2,
      subtitle: StringManager.onBoardingSubTitle2,
    )
  ];
... some other code

the strings above are hardcoded with specific language I wanted them to be localized

the localization require

 S.of(context).yourKey

I thought of passing the key as a string and in UI build (where I will have the context) to do

 `S.of(context)[thePassedKeyStringVar]` // but that is wrong in Dart

I tried to pass the context to my Class OnBoardingViewModel so I could have

class OnBoardingViewModel with ChangeNotifier {
  static BuildContext context;

  final List<OnBoardingPageContent> onBoardingPages = [
    OnBoardingPageContent(
      title: S.of(context).onBoardingText1,

but it did not end well with me

here is the entry point of my app

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(
          create: (_) => OnBoardingViewModel(_),
        ),
        ...
      ],
      child: const MyApp(),
    ),
  );
}

any help on how to localize the strings in my static list in the above class?

Answer 1

Short answer : That is not possible with the library you're using (it is a strictly static-only localization library).

---

Detailed answer :

The way I handle translations when having to manipulate datas in a Controller/Presenter/ViewModel (call it whatever you want), is by returning the key to translate in my model.

You should be able to do what you want with the easy_localization package

/assets/translations/en.json

{[
  'my_key': 'The english value',
]}

class AccountController with ChangeNotifier {
  
  AccountObject accountObj = AccountObject();

  void updateObject() {
    accountObj.title = "my_key";
    notifyListeners();
  }

}

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

  @override
  Widget build(BuildContext context) {
    return Consumer<AccountController>(
        builder: (context, accountController, child) {
          return Center(
              child: Text(accountController.accountObj.title).tr
          );
        }
    );
  }
}

Another good practice is to keep your Widgets outside from your Controllers.
Use your Controllers to build the data and notify the Widget Tree when it should re-build (and keep your Widgets in your Widgets tree) :)

Also, keep in mind that your Context should stay in your Widgets (it'll save you from a lot of errors/weird behaviors :))