Flutter에서 외국어 번역/적용시키기(easy localization)

Flutter로 앱이나 웹을 만들 때 한국어, 영어.. 등등 그 외 각종 언어도 지원이 되게끔 만들어야할 때가 있다.

이때 사용해야하는 라이브러리가 easy localization이라는 라이브러리이다.

 

우선 공식문서는 아래를 참고하면 된다.

https://pub.dev/packages/easy_localization

easy_localization | Flutter Package

사실 포스팅하기에 너무 간단한 라이브러리라 공식문서를 보는 것만으로 충분히 구현할 수 있을 거라 생각한다.

 

일단 pubspec.yaml에 easy_localization을 추가하고 pub get을 해줘야 한다.

dependencies:
  easy_localization: ^3.0.0

 

이후에 main.dart에 아래와 같이 코드를 추가해주면 된다.

Future<void> main() async {
  // 아래 두줄 추가 
  WidgetsFlutterBinding.ensureInitialized();
  await EasyLocalization.ensureInitialized();

  runApp(
      // 통째로 추가
      EasyLocalization(
        saveLocale: true,
        useOnlyLangCode: true,
        // 언어는 본인이 필요한 거에 맞게 작성(추후에 만들 json파일과 관련이 있음)
        supportedLocales: [Locale('en'), Locale('ko')], 
        path: 'assets/translations',
        fallbackLocale: Locale('en'),
        child: MyApp(),
      )
  );
  //runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    ...
    };

    return MaterialApp(
      // 아래 두줄 추가
      localizationsDelegates: context.localizationDelegates,
      supportedLocales: context.supportedLocales,
      locale: context.locale,
      title: "Localization",
      theme: ThemeData(
        ...
      ),
    );
  }
}

en, ko 이런식으로 작성한 것은 언어 번역을 작성한 파일명과 동일하다.

ex) 영어의 경우 en.json파일이면 en이라 작성

 

path는 자신의 json파일이 담길 파일경로를 적어주면 된다.

 

이제 json파일 작성법을 보자. en.json을 작성한다 쳤을 때 아래와 같이 예시로 작성해보았다.

{
    "hi" : "HI",
    "name" : "Name",
    "age" : "Age"
}

 

왼쪽에 작성한 것("hi", "name", "age")은 다른 json파일과 동일하게 통일시켜줘야한다 실제 구현시 이걸 써야하기 때문이다.

 

그렇다면 ko.json은 이런식으로 작성할 수 있다.

{
    "hi" : "안녕",
    "name" : "이름",
    "age" : "나이"
}

 

이렇게 작성하면 이제 쓰기만 하면 된다.

예를 들어 텍스트가 영어로 보일 땐 "HI", 한국어로 보일 땐 "안녕"으로 보여야 한다 치면

tr("hi") 이렇게 써주면 자동으로 환경에 따라 알맞는 언어로 보일 것이다. 

혹시 이해가 안되었을 경우 더 쉽게 설명하자면

Text("HI") 혹은 Text("안녕")이라고 써야할 것을 Text(tr("hi"))라고 쓰면 되는 것이다.

 

이게 easy_localization을 쓰는 방법이다.

참고로 이게 적용시간이 좀 있기때문에 json파일을 작성하고 바로 적용이 안될 수도 있다.