iOS | 一些多國語系遇到的小事
--
隨著公司的新專案進度穩定,最近做了多國語系的功能,也踩到了一些小坑,趁著記憶猶新時,趕緊來記錄一下。
前言:Localization 方式
這篇並不是教學文,只想先簡單提一下常見的兩種做法:一為在 Storyboard ,另一則是利用 code ,兩者都是根據某個 key 值在不同語系去做字串替換。
前者,是根據 Storyboard 中 inspector 的 Object ID 當作 key,如下圖的Ny4-FQ-WkU
。但這一來要在 Storyboard 設定,載入速度慢,且資料分散又不易閱讀,所以我們是使用 code 去處理。
Placeholder 顏色
確認完文字後,意外發現顏色居然跑掉了。而且只有 UITextField Placeholder 的顏色有色差,其他 UILabel 和 UIButton 都沒事。
下了一些關鍵字: UITextfield
, placeholder
, font color
, localization
, different
後,發現這篇的狀況跟我很像,但也沒有解法。
UITextField placeholder is in different color when app is localized
後來在 Debug Layer 時,比對了左右顏色,發現右邊 R:0, G:0, B:0.1, A:0.22
這個設定其實是系統預設的,所以進一步去思考究竟為什麼會這樣 🤔
在厲害的同事分析後,發現:因為我們建立一個繼承自 UITextField
的物件去客製化符合設計檔 placeholder 的顏色 R:1, G:1, B:1, A:0.5
,同時會在 init UITextField 時 setup 顏色。
var placeholderColor: UIColor = UIColor.white {
didSet {
attributedPlaceholder = NSAttributedString(string: placeholder ?? "", attributes: [NSAttributedString.Key.foregroundColor: placeholderColor])
}
}
而我們在設定多國語系時,是在 ViewController 去替換字串,但儘管我們抽換了不同語系,都不會觸發它改色(只在 init 跑過一次),所以最後採用的解法是 → 手動 override placeholder
override var placeholder: String? {
didSet {
attributedPlaceholder = NSAttributedString(string: placeholder ?? "", attributes: [NSAttributedString.Key.foregroundColor: placeholderColor])
}
}
再試一次,就大功告成了! 👏
(但有發現 iOS 13 之後就沒這問題了,應該是 🍎 fix 了?)
圖片 Localize
另外,有些圖片我們是存在 Assets,而不同語系也有不同的圖片。
網路上最常見的是把圖片拉到資料夾中跟 AppDelegate 同層的位置,點選 localize 後會生成不同資料夾,再一一放同檔名不同語系的圖片在各自的資料夾。
但,這資料夾結構真的很醜啊!
而且,他還有很多限制,比如 Assets 裡頭你可以定義 resizing
, scales
等等,但它放在外面就只是一個檔案, pdf
沒辦法直接轉成圖片(還是我用錯?)動態調整圖片尺寸也不行。
好吧再查查… 咦,可以直接在 Assets 裡面做 Localization?
嗯,原來是 Creating Great Localized Experiences with Xcode 11
因為要先近期出版,所以最後折衷參考文字的 localize 方法,一樣存了一個圖片 key,對應的圖片檔名就根據不同語系有不同的字尾,ex: _zh
。
以上兩個是目前在做多國語系所遇到的兩件小事,其他還有像是 layout constraint
也是遇到單字較長的國家時必須要檢查的,容易擠壓到或是疊在一起(誰叫你以前不好好對齊 QQ),之後如果有 RTL 語系,也要檢查類似 leading
和 trailing
的設定。
身為一個很常使用 Stack overflow 的人,最後也分享我第一次使用回覆的功能,就在上面連結的下方,雖然也不知道有沒有人會看到 XD 但希望能夠幫助到跟我一樣碰到的人 😌
Feel free to leave any comment or feedback.
如果覺得文章不錯的話,歡迎幫我拍拍手👏🏻👏🏻👏🏻