플러터에서 Easy Localization 사용법

2024. 5. 21. 02:23Flutter/Flutter Programming

반응형

Flutter에서 Easy Localization 사용하기: 초보자를 위한 완벽 가이드

Easy Localization은 Flutter 앱을 다국어로 쉽게 만들 수 있도록 도와주는 인기 있는 패키지입니다. 이 블로그 게시글에서는 Easy Localization 사용법을 단계별로 안내하고, 다양한 기능과 활용법을 살펴보겠습니다. 걱정하지 마세요! 초보자라도 쉽게 이해할 수 있도록 자세히 설명드리겠습니다.

1. Easy Localization 설치 및 기본 설정:

  • pubspec.yaml 파일에 Easy Localization 추가:
dependencies:
  easy_localization: ^2.4.2
 
  • Flutter pub get 실행:
flutter pub get
 
  • lib/main.dart 파일에 Easy Localization 설정:
import 'package:flutter/material.dart';
import 'package:easy_localization/easy_localization.dart';

// 앱에서 지원하는 언어 목록
final supportedLocales = [
  Locale('ko', 'KR'), // 한국어
  Locale('en', 'US'), // 영어
];

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyLocalization.ensureInitialized(); // Easy Localization 초기화

  runApp(
    EasyLocalization( // Easy Localization 감싸기
      supportedLocales: supportedLocales, // 지원 언어 목록 설정
      path: 'assets/translations', // 번역 파일 경로 설정
      fallbackLocale: Locale('en', 'US'), // 기본 언어 설정
      startLocale: Locale('ko', 'KR'), // 초기 언어 설정 (선택사항)
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 기본적으로 필요한 언어 설정
      localizationsDelegates: context.localizationDelegates,
      supportedLocales: context.supportedLocales,
      locale: context.locale,
      home: MyHomePage(),
    );
  }
}
 

2. 번역 파일 만들기:

  • assets/translations 폴더 생성:
mkdir assets/translations
 
  • 각 언어별 JSON 파일 만들기:
    • ko-KR.json:
    JSON
    {
        "hello": "안녕",
        "name": "이름",
        "clear": "청소",
        "welcome": "환영합니다!"
    }
    
     
    • en-US.json:
    JSON
    {
        "hello": "Hello",
        "name": "Name",
        "clear": "Clear",
        "welcome": "Welcome!"
    }
    
     

3. 번역 문자열 사용하기:

  • Text Widget에 tr() 함수 사용:
  • Dart
    Text('hello'.tr()), // 현재 언어로 "안녕" 또는 "Hello" 출력
    
     
  • String Extension 사용:
     
    print('name'.tr()); // 현재 언어로 "이름" 또는 "Name" 출력
    
     

4. 파라미터 전달:

  • 순서대로 파라미터 전달:
     
    Text('welcome'.tr(args: ['Easy Localization', 'Flutter'])), // "Easy Localization을 Flutter에 환영합니다!" 출력
    
     
  • 이름 명시된 파라미터 전달:
     
    Text('product_name'.tr(namedArgs: {'name': '제품 이름'})), // "제품 이름을 구매하셨습니다!" 출력
    
     

5. 중첩 문자열 처리:

  • Map 형식으로 데이터 전달:
     
    Text('gender'.tr(gender: _gender ? 'female' : 'male')), // "여성입니다" 또는 "남성입니다" 출력
    
     

6. 활용 예시:

  • 사용자 이름 표시:
    Text('my_name'.tr(args: [_user.name])), // "사용자 이름님, 안녕하세요!" 출력
    
     
  • 제품 가격 표시:
    Text('price'.tr(args: [product.price.toString()])), // "제품 가격: 10,000원" 출력
    
     

7. 추가 기능:

  • 플랫폼별 언어 설정 지원:
    • deviceLocale 속성을 사용하여 기기의 언어를 기본 언어로 설정할 수 있습니다.
    • useDeviceLocale 속성을 사용하여 기기 언어를 우선적으로 사용하도록 설정할 수 있습니다.
  • RTL 언어 지원:
    • rtl: true 속성을 사용하여 RTL 언어(예: 아랍어, 히브리어)를 지원하도록 설정할 수 있습니다.
  • 번역 문자열 포맷팅:
    • plural 키를 사용하여 복수형 형태의 번역 문자열을 정의할 수 있습니다.
    • gender 키를 사용하여 성별에 따른 번역 문자열을 정의할 수 있습니다.
    • argsnamedArgs 매개 변수와 함께 포맷팅 문자열을 사용하여 동적인 번역 문자열을 표현할 수 있습니다.
  • 번역 문자열 캐싱:
    • Easy Localization은 번역 문자열을 캐싱하여 앱 성능을 향상시킵니다.
  • 번역 파일 자동 로드:
    • assets/translations 폴더에 있는 모든 JSON 파일을 자동으로 로드합니다.

8. 예시 코드:

  • 플랫폼별 언어 설정:
EasyLocalization(
  supportedLocales: supportedLocales,
  path: 'assets/translations',
  fallbackLocale: Locale('en', 'US'),
  useDeviceLocale: true, // 기기 언어 우선 사용
  child: MyApp(),
);
 
  • RTL 언어 지원:
EasyLocalization(
  supportedLocales: supportedLocales,
  path: 'assets/translations',
  fallbackLocale: Locale('en', 'US'),
  rtl: true, // RTL 언어 지원
  child: MyApp(),
);
 
  • 번역 문자열 포맷팅 (복수형):
{
  "items": {
    "zero": "상품이 없습니다.",
    "one": "상품 1개",
    "other": "상품 {count}개"
  }
}
 
 
Text('items'.tr(args: [_itemCount])), // _itemCount가 0이면 "상품이 없습니다.", 1이면 "상품 1개", 2 이상이면 "상품 2개" 출력
 
  • 번역 문자열 포맷팅 (성별):
JSON
{
  "greeting": {
    "male": "안녕하세요, {name} 님!",
    "female": "안녕하세요, {name} 씨!"
  }
}
 
 
Text('greeting'.tr(namedArgs: {'name': _user.name, 'gender': _user.gender})), // _user.gender가 "male"이면 "안녕하세요, 김철수 님!", "female"이면 "안녕하세요, 김영희 씨!" 출력
 

9. 결론:

Easy Localization은 Flutter 앱을 다국어로 쉽게 만들 수 있도록 도와주는 강력하고 유연한 도구입니다. 이 블로그 게시글을 통해 Easy Localization 사용법을 기본적으로 이해하셨기를 바랍니다. Easy Localization을 활용하여 다양한 언어를 지원하는 사용자 친화적인 앱을 개발하시기 바랍니다.

 

참고자료:

주의:

  • 이 블로그 게시글은 Easy Localization의 기본적인 사용법만을 다룹니다. 더 많은 기능과 사용법은 공식 문서를 참고하시기 바랍니다.
  • Easy Localization은 지속적으로 업데이트되고 있습니다. 최신 버전의 문서를 참고하여 사용하시기 바랍니다.
반응형