Android 앱용 맞춤 언어 선택기를 만드는 방법

🔎 그렇다면 왜 언어 전환기를 구현해야 할까요?

예, 시스템 언어를 기반으로 사용자의 로케일을 결정하고 그에 따라 영어로 대체하여 설정하면 완료됩니다. 그리고 언어 전환이 모든 사용자에게 필요한 것은 아니지만 일부 사용자에게는 편리합니다. 왜요?

생각할 거리:

유사한 언어: 서로의 언어를 이해하는 두 개의 이웃 국가를 상상해 보십시오. 하지만 그 중 하나는 앱에서 사용할 수 없습니다. 따라서 한 국가의 사용자는 선호하는 이웃 국가의 언어 대신 영어로 앱을 사용해야 합니다.

이중 언어 사용자 및 학습자: 시스템 언어를 더 잘 배우고 싶은 언어로 전환하는 것을 좋아하는 사람들이 있습니다. 그러나 앱이 복잡하거나 콘텐츠가 풍부한 경우 아직 완전히 이해하지 못하는 언어로 앱을 사용하고 싶어하지 않을 수 있습니다.

이것은 언어 전환이 UX에 좋은 두 가지 예일 뿐입니다.

이 항목에 대해 자세히 알아보고 간단한 개선으로 사용자 경험을 어떻게 개선할 수 있는지 알아보십시오.

Read the article on why it is important to let users switch the language of your app

🕹️ 초기 설정

사용자 정의 언어 선택기를 만들려면 먼저 Localazy Gradle plugin을 구현해야 합니다. 그 이유는 Localazy의 readKey 및 writeKey를 앱에 추가해야 하기 때문입니다. 이러한 키는 소스를 포함하여 언어 목록을 검색하는 데 필요합니다.

우선 Localazy에서 set up a new account을 생성하고 아직 생성하지 않았다면 new application을 생성해 보겠습니다. 앱 생성을 진행하고 통합 화면에서 Android을 선택한 후 단계를 따릅니다. 키를 어딘가에 기록하고 구성에 넣습니다. 앱에 일부 언어를 자유롭게 추가하여 선택기가 실제로 작동하는지 확인할 수 있습니다.

중요한 것! 이전에 아래 구성으로 Localazy Gradle 플러그인을 이미 구성한 경우 injection 블록을 제거하거나 삽입을 허용하십시오. 비활성화되어 있지 않은지 확인하십시오.
injection 섹션에서는 Android 라이브러리가 앱에 통합되는 방식을 구성할 수 있습니다.

localazy {
    injection {
            enabledForRelease false
            enabledForDebug false
            library "none"
        }

        download {
            enabledForRelease false
            enabledForDebug false
        }
    }

injection 구성에 대한 자세한 내용을 보려면 read the documentation.을 참조하십시오.

Localazy가 업데이트된 번역 ​​및 새 언어를 가져오려면 인터넷 권한이 필요하므로 아직 권한이 없는 경우 인터넷 권한을 추가하는 것을 잊지 마십시오.
<uses-permission android:name="android.permission.INTERNET" />

🎚️ 선택기 만들기

설정을 마친 후에는 사용 가능한 모든 언어와 현재 선택된 언어를 표시하는 간단한 레이아웃을 만들어야 합니다.

<LinearLayout
   android:id="@+id/select_language"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:background="?attr/selectableItemBackground"
   android:paddingStart="18dp"
   android:paddingEnd="18dp"
   android:orientation="horizontal">

   <TextView
       android:id="@+id/language"
       android:layout_width="0dp"
       android:layout_height="48dp"
       android:layout_marginStart="8dp"
       android:layout_weight="1"
       android:gravity="center_vertical"
       android:text="Select app language" />

   <ImageView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="center_vertical"
       android:layout_marginEnd="8dp"
       android:src="@drawable/ic_arrow_down" />

</LinearLayout>

이제 선택기의 핵심은 OTA Updates 에 연결된 공식 Localazy 라이브러리를 사용합니다.

// Variables
private SharedPreferences preferences;
public LinearLayout selectLanguage;
private TextView language;
private Map<LocalazyLocale, String> languagesLocalazy;

// Initialize views
selectLanguage = findViewById(R.id.select_language);
language = findViewById(R.id.language);

languagesLocalazy = new HashMap<>();


// This will help us manipulate the “UI”, we won’t allow showing current language before we actually set it. If we skip this, “Select app language” won’t be visible
if (!preferences.getBoolean("language_selected", false)) {
   LocalazyLocale currentLocale = Localazy.getCurrentLocalazyLocale();
   language.setText(currentLocale.getLocalizedName());
}

이제 Localazy에서 사용 가능한 로케일 목록을 가져와야 합니다. 그런 다음 for 루프를 사용하여 HashMap<>() 를 채워야 합니다.
getLocalizedName()는 자체 언어 eq로 로케일을 반환합니다. 'cs_CZ'는 '체슈티나(Česko)'입니다.

List<LocalazyLocale> locales = Localazy.getLocales();

for (LocalazyLocale locale : locales) {
   String localizedName = locale.getLocalizedName();
   languagesLocalazy.put(locale, localizedName);
}

이제 마지막 부분인 언어 선택입니다. 이 예에서는 AlertDialog를 사용하여 사용 가능한 언어 목록을 표시합니다.

먼저 HashMap<>() 가 null 이 아닌지 확인하고, 그 직후에 사용 가능한 언어가 두 개 이상인지 확인해야 합니다.

그런 다음 AlertDialog를 사용 가능한 언어로 채우고 언어가 선택되도록 기본 설정을 지정하고 마지막으로 선택한 언어를 forceLocale()로 설정해야 합니다.

변경 사항을 표시하려면 활동을 다시 만들어야 합니다.

if (languagesLocalazy != null) {
   if (languagesLocalazy.size() > 1) {
       selectLanguage.setOnClickListener(v -> {
           AlertDialog.Builder builder = new AlertDialog.Builder(context);
           builder.setTitle(“Set language”));

           LocalazyLocale[] langArray;
           langArray = languagesLocalazy.keySet().toArray(new LocalazyLocale[0]);

           String[] languageName = new String[langArray.length];
           for (int i = 0; i < langArray.length; i++) {
               languageName[i] = langArray[i].getLocalizedName();
           }

           builder.setItems(languageName, (dialog, which) -> {
               preferences.edit().putBoolean("language_selected", true).apply();

               Localazy.forceLocale(langArray[which].getLocale(), true);
               recreate();
           });

           AlertDialog dialog = builder.create();
           dialog.show();
       });
   }
}

그리고 그게 다야!

🗃️ Localazy 카드 라이브러리

사용자 정의 언어 선택기가 실제로 어떻게 작동하는지 확인하려면 더 나은 디자인과 더 많은 기능으로 코어가 동일한 Localazy 카드 라이브러리를 확인할 수도 있습니다.

Localazy 카드 라이브러리 저장소https://github.com/Paget96/Localazy-Card를 참조하십시오.

📚 당신은 또한 좋아할 수도 있습니다

이 짧은 가이드가 마음에 드셨기를 바랍니다. 다음은 여러분이 좋아할 만한 다른 Android 튜토리얼입니다.

시리즈: How to make floating windows on Android

Top 10 Tools for Multilingual Android Development

How to integrate Android app with Localazy

또는 Android 앱 이외의 프로젝트에 대해 Localazy CLI에서 자동화된 언어 전환기에 대한 지원을 추가하는 방법을 알아보세요. 😉

Read the article: Localazy CLI Tips: Automated language switcher