Flutter 번역 적용기
이번에 Flutter 에 언어 기능을 첨가했다.
언어는 최대 3가지로
한국어
영어
일본어 이다.
RTL? LTR?같은 어려운 부분은 적용하지 않아서.. 비교적 쉽게? 진행되었다.
과거에 배웠던 기술과
https://docs.flutter.dev/development/accessibility-and-localization/internationalization
구글링을 통해 제작된 내용을 공유한다.
처음에는 언어 정의가 안되어서 검색해 보니까
Intl.defaultLocale = "ko_KR";
라는 항목을 통해서 언어를 변경해 주어야 했다.
(이 부분때문에 진짜 한시간넘게 구글링을 했다 ㅜㅜ)
class BayabasLocalization {
static Future<BayabasLocalization> load(Locale locale) {
final String name =
locale.countryCode == null ? locale.languageCode : locale.toString();
final String localeName = Intl.canonicalizedLocale(name);
return initializeMessages(localeName).then((bool _) {
Intl.defaultLocale = localeName;
return new BayabasLocalization();
});
}
static BayabasLocalization? of(BuildContext context) {
return Localizations.of<BayabasLocalization>(context, BayabasLocalization);
}
String get korean{
return Intl.message(
'korean',
name: 'korean',
desc: '한국어',
);
}
}
class AppLocalizationDelegate extends LocalizationsDelegate<BayabasLocalization> {
final Locale overriddenLocale;
const AppLocalizationDelegate(this.overriddenLocale);
@override
bool isSupported(Locale locale) {
return ['en', 'ko'].contains(locale.languageCode);
}
@override
Future<BayabasLocalization> load(Locale locale) {
return BayabasLocalization.load(locale);
}
@override
bool shouldReload(LocalizationsDelegate<BayabasLocalization> old) {
return false;
}
}
String get korean{
return Intl.message(
'korean',
name: 'korean',
desc: '한국어',
);
}
이 부분이 번역에 사용될 녀석이다.
첫 매개변수인 korean이 약간 변경되는 키? 값 같은느낌이고
name이 영어로 나올 내용이며
desc는 약간 설명? 같은 느낌으로 제작되었다.
내용이 추가된다면 저런형태의 녀석들을 잔뜩 추가하고
en,ko 파일(하단부에 설명)에도 내용들을 추가해주면된다.
해당 번역기능을 사용하여 텍스트에 표시해줄때는
BayabasLocalization.of(context)!.korean
해당 구문처럼 사용해주면된다.
BayabasLocalization 이 부분은 각자 맞는 이름으로 바꾸어주면 되겠다...
예시가 있으니 비교적 쉽게 따라할 수 있다고 생각된다.
final messages = new MessageLookup();
typedef String MessageIfAbsent(String messageStr, List<dynamic> args);
class MessageLookup extends MessageLookupByLibrary {
String get localeName => 'ko';
final messages = _notInlinedMessages(_notInlinedMessages);
static _notInlinedMessages(_) => <String, Function>{
"korean": MessageLookupByLibrary.simpleMessage("한국어"),
};
}
이 부분이
korean 이라는 키 값이 어떻게 번역되는지 나오는 부분이다.
뒤에 있는 simplMessage 속에 값을 넣어주면 그 내용으로 번역되어서 나온다.
AppLocalizationDelegate _bayabasOverrideDelegate =
const AppLocalizationDelegate(Locale('ko', 'KR'));
MaterialApp(
localizationsDelegates: [_bayabasOverrideDelegate],
supportedLocales: [
const Locale("ko", "KR"),
const Locale("en", ""),
],
MaterialApp
부분에서
localizationsDelegates 이곳에 초기값?을 넣어주고
supportedLocales 이곳에는 번역이 될 값들을 넣어주었다.
아직 일본어까지는 진행전이여서 한국어와 영어만 적용하였다.
파일 및 폴더 구조는
locale - messages_all.dart
- message_en.dart
- message_ko.dart
- message_messages.dart
- localization.dart
로 되어져 있다.
localization에는
BayabasLocalization 를 구현해놓았고
아래에는 각각 파일에 알맞는 코드들을 넣어주었다.
messages_all.dart
// DO NOT EDIT. This is code generated via package:intl/generate_localized.dart
// This is a library that looks up messages for specific locales by
// delegating to the appropriate library.
// Ignore issues from commonly used lints in this file.
// ignore_for_file:implementation_imports, file_names, unnecessary_new
// ignore_for_file:unnecessary_brace_in_string_interps, directives_ordering
// ignore_for_file:argument_type_not_assignable, invalid_assignment
// ignore_for_file:prefer_single_quotes, prefer_generic_function_type_aliases
// ignore_for_file:comment_references
import 'dart:async';
import 'package:intl/intl.dart';
import 'package:intl/message_lookup_by_library.dart';
import 'package:intl/src/intl_helpers.dart';
import 'messages_messages.dart' as messages_messages;
import 'messages_ko.dart' as messages_ko;
import 'messages_en.dart' as messages_en;
typedef Future<dynamic> LibraryLoader();
Map<String, LibraryLoader> _deferredLibraries = {
'messages': () => new Future.value(null),
'ko': () => new Future.value(null),
'en': () => new Future.value(null),
};
MessageLookupByLibrary _findExact(String localeName) {
switch (localeName) {
case 'messages':
return messages_messages.messages;
case 'ko':
return messages_ko.messages;
case 'en':
return messages_en.messages;
default:
return messages_messages.messages;
// return null;
}
}
/// User programs should call this before using [localeName] for messages.
Future<bool> initializeMessages(String localeName) async {
var availableLocale = Intl.verifiedLocale(
localeName, (locale) => _deferredLibraries[locale] != null,
onFailure: (_) => null);
if (availableLocale == null) {
return new Future.value(false);
}
var lib = _deferredLibraries[availableLocale];
await (lib == null ? new Future.value(false) : lib());
initializeInternalMessageLookup(() => new CompositeMessageLookup());
messageLookup.addLocale(availableLocale, _findGeneratedMessagesFor);
return new Future.value(true);
}
bool _messagesExistFor(String locale) {
try {
return _findExact(locale) != null;
} catch (e) {
print(" (11) ]-----] error [-----[ : $e");
return false;
}
}
MessageLookupByLibrary _findGeneratedMessagesFor(String locale) {
var actualLocale =
Intl.verifiedLocale(locale, _messagesExistFor, onFailure: (_) => null);
// if (actualLocale == null) return null;
return _findExact(actualLocale!);
}
message_en.dart
import 'package:intl/intl.dart';
import 'package:intl/message_lookup_by_library.dart';
final messages = new MessageLookup();
typedef String MessageIfAbsent(String messageStr, List<dynamic> args);
class MessageLookup extends MessageLookupByLibrary {
String get localeName => 'en';
final messages = _notInlinedMessages(_notInlinedMessages);
static _notInlinedMessages(_) => <String, Function>{
"korean": MessageLookupByLibrary.simpleMessage("korean"),
};
}
message_ko.dart
import 'package:intl/intl.dart';
import 'package:intl/message_lookup_by_library.dart';
final messages = new MessageLookup();
typedef String MessageIfAbsent(String messageStr, List<dynamic> args);
class MessageLookup extends MessageLookupByLibrary {
String get localeName => 'ko';
final messages = _notInlinedMessages(_notInlinedMessages);
static _notInlinedMessages(_) => <String, Function>{
"korean": MessageLookupByLibrary.simpleMessage("한국어"),
};
}
message_messages.dart
import 'package:intl/intl.dart';
import 'package:intl/message_lookup_by_library.dart';
final messages = new MessageLookup();
typedef String MessageIfAbsent(String messageStr, List<dynamic> args);
class MessageLookup extends MessageLookupByLibrary {
String get localeName => 'messages';
final messages = _notInlinedMessages(_notInlinedMessages);
static _notInlinedMessages(_) => <String, Function>{
"aboutCompanyAndService":
MessageLookupByLibrary.simpleMessage("About company and service"),
};
}
해당 자료가 도움이 되면 좋겠다 ㅜㅜ
Author And Source
이 문제에 관하여(Flutter 번역 적용기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@kindcode/Flutter-번역-적용기저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)