HƯỚNG DẪN THỰC HIỆN ỨNG DỤNG MOBILE HỖ TRỢ ĐA NGÔN NGỮ

by DaoNM2
297 views

Trong thời đại công nghệ 4.0, các công ty đua nhau chuyển đổi số, vì vậy có rất nhiều những ứng dụng di động được phát triển để giúp tiếp cận người dùng một cách dễ dàng hơn. Để những ứng dụng có thể vươn xa ra tầm thế giới, tiếp cận được với những người dùng nước ngoài, thì ứng dụng đó cần phải hỗ trợ đa ngôn ngữ. Vì vậy hôm nay mình sẽ hướng dẫn các bạn một số cách thực hiện một ứng dụng iOS hỗ trợ đa ngôn ngữ.

Cài đặt dự án hỗ trợ đa ngôn ngữ

Bước 1: Thực hiện thêm ngôn ngữ hỗ trợ bằng cách Chọn Project -> Info(thông tin) -> Bấm nút +

Thêm ngôn ngữ
Bỏ tích ở các file storyboard để xCode không gen ra các file String cho các files storyboard

Bước 2: Tạo file String để chứa nội dung theo các ngôn ngữ New File… -> tìm string và chọn Strings File -> Next

Bước 3: Localize file string vừa mới tạo Chọn File vừa tạo -> Bấm vào nút Localize… -> Popup hiển thị lên thì chọn Localize

Bước 4: Tích vào ngôn ngữ bạn hỗ trợ, Chọn File String localize vừa được tạo -> Ở menu bên phải mục Localization tích vào những ngôn ngữ mà ứng dụng của bạn hỗ trợ.

Chọn ngôn ngữ hỗ trợ

Vậy là việc cài đặt đa ngôn ngữ cho ứng dụng của bạn đã hoàn thành.

Thực hiện đa ngôn ngữ với các chuỗi (Localize String)

  1. Để tránh các lỗi sai chính tả và việc thực hiện đa ngôn ngữ trở nên dễ dàng hơn thì chúng ta sẽ tạo ra một enum Localization để liệt kê các item/string dưới dạng keyword để sử dụng như sau:

enum Localization {
    static let helloWorld: String = "Hello"
    static let buttonChangeLanguageTitle: String = "btn.changeLanguage"
}

Với mỗi 1 key của string chúng ta cần tạo ra value tương ứng với nó ở trong file Localizable mà chúng ta đã tạo.

Thêm key/value cho các file ngôn ngữ tương ứng:

Thêm key/value cho ngôn ngữ Tiếng Anh
Thêm key/value cho ngôn ngữ Tiếng Việt

NOTE:
– Kết thúc của dòng code phải là dấu chấm phẩy “;” nếu 1 dòng code bị thiếu nó sẽ khiến ứng dụng của bạn hiển thị không đúng ngôn ngữ.
– Key phải trùng với giá trị của enum Localization

2. Tạo một file chung để quản lí ngôn ngữ như đoạn code dưới đây

// for manage language
class LanguageManager {
    static let shared = LanguageManager()
    private init(){}
    
    // save language to UserDefault
    func changeLanguage(_ language: Language) {
        UserDefaults.standard.set(language.rawValue, forKey: "APP_LANGUAGE")
    }
    
    /// Get language of set on app, if nil use device language
    /// - Returns: current language of application
    func getAppLanguage() -> Language {
        if let language = UserDefaults.standard.value(forKey: "APP_LANGUAGE") as? String {
            return Language(rawValue: language) ?? .english
        } else {
            // default lan is english
            let currentLanguage: String = Locale.current.languageCode ?? Language.english.rawValue
            return Language(rawValue: currentLanguage) ?? .english
        }
    }
    
    // define enum language
    enum Language: String {
        case vietnamese = "vi"
        case english = "en"
    }
}

Ở đây mình tạo ra một file quản lí ngôn ngữ nhằm mục đích tập trung tất cả những tính năng liên quan tới ngôn ngữ: thay đổi, lấy ra ngôn ngữ …

Chúng ta cần lưu ngôn ngữ của ứng dụng vào Local Storage để khi người dùng tắt ứng dụng vào lại thay đổi vẫn được áp dụng. Trong trường hợp này mình chọn cách dùng UserDefault vì những lí do sau:
– Dễ sử dụng
– Dữ liệu cần lưu không yêu cầu bảo mật
– Dữ liệu lưu có dung lượng nhỏ

3. Vậy là chúng ta đã tạo xong file quản lí ngôn ngữ. Tiếp đến để việc sử dụng localization dễ dàng chúng ta sẽ tạo ra một var localized trong extension String như sau:


extension String {
    var localized: String {
        let currentLanguage = LanguageManager.shared.getAppLanguage().rawValue
        guard let bundlePath = Bundle.main.path(forResource: currentLanguage, ofType: "lproj"), let bundle = Bundle(path: bundlePath) else {
            return self
        }
        return NSLocalizedString(self, tableName: nil, bundle: bundle, value: "", comment: "")
    }
}

Sau khi tạo xong extension thì việc thực hiện code localized trở nên rất dễ dàng. Khi cần sử dụng chúng ta chỉ cần .localized là xong.

4. Demo và cách sử dụng:

Trong ví dụ này mình sẽ tạo ra 1 label hiển thị text và một nút để thay đổi ngôn ngữ của ứng dụng. Sau đó mình tạo ra một func setDataForUI() nhằm mục đích set tất cả các data liên quan tới localization ở đây. Nếu sau đó đổi ngôn ngữ ta chỉ cần gọi lại hàm này để thực hiện set lại.

    private func setDataForUI() {
        lbHello.text = Localization.helloWorld.localized
        btnChangeLanguage.setTitle(Localization.buttonChangeLanguageTitle.localized, for: .normal)
    }

    @IBAction func changeLanguage(_ sender: Any) {
        if LanguageManager.shared.getAppLanguage() == .english {
            LanguageManager.shared.changeLanguage(.vietnamese)
        } else {
            LanguageManager.shared.changeLanguage(.english)
        }
        setDataForUI()
    }

Kết quả

Vậy là chúng ta đã hoàn thành việc thực hiện localize String cho ứng dụng. Mình hi vọng bài viết này có thể giúp được chút gì đó cho các bạn. Cảm ơn các bạn đã đọc bài viết này, chúc các bạn thành công!

Leave a Comment

* By using this form you agree with the storage and handling of your data by this website.

You may also like