[flutter] flutter_localizations 패키지를 사용한 앱의 로그인 화면 다국어 지원 방법

다국어 지원은 앱을 국제 시장으로 확장할 때 중요한 부분입니다. Flutter 앱에서 flutter_localizations 패키지를 사용하여 로그인 화면의 다국어 지원을 구현하는 방법을 알아보겠습니다.

1. flutter_localizations 패키지 추가

먼저, pubspec.yaml 파일에 다음과 같이 flutter_localizations 패키지를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  ...

이후 패키지를 설치하기 위해 터미널에서 다음 명령어를 실행합니다.

flutter pub get

2. MaterialApp에 지역화 위임

다음으로, MaterialApp 위젯에 지역화 위임(delegate)을 설정합니다. 이를 통해 앱의 언어에 따라 적절한 지역화 데이터가 사용됩니다.

MaterialApp(
  localizationsDelegates: [
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
  ],
  supportedLocales: [
    const Locale('en', 'US'), // 영어
    const Locale('ko', 'KR'), // 한국어
    // 지원하는 다른 언어들
  ],
  ...
)

3. 다국어 문자열 추가

이제 lib/l10n 폴더를 생성하고 각 지원하는 언어별로 .arb 파일을 추가합니다.

예시 - app_en.arb(영어), app_ko.arb(한국어):

{
  "appTitle": "My App",
  "login": "Login",
  "username": "Username",
  "password": "Password",
  ...
}

4. 지역화 문자열 사용

로그인 화면 또는 해당 화면에 있는 문자열을 다국어로 표시하기 위해 AppLocalizations 클래스를 생성합니다.

class AppLocalizations {
  static const LocalizationsDelegate<AppLocalizations> delegate = _AppLocalizationsDelegate();
  ...
}

그리고 해당 문자열을 다음과 같이 사용합니다.

Text(AppLocalizations.of(context).login)

이제 로그인 화면에서 지역화된 문자열이 표시됩니다.

이러한 방법을 통해 flutter_localizations 패키지를 사용하여 앱의 로그인 화면을 다국어로 지원할 수 있습니다. 이를 통해 사용자는 원하는 언어로 앱을 사용할 수 있게 됩니다.

참고: flutter_localizations 패키지 공식 문서