在 Flutter 中客製化特定多語系字串參數的樣式

前言

最近在工作上碰到了這樣的需求,原本一開始以為滿容易的。

但後來想想在多語系字串及 Text 之間的實現上好像有點麻煩。

那我們直接來看看圖片,是碰到怎麼樣的問題。

多語系與設計圖之間的碰撞

Image

Image

上面兩張圖是設計圖的構想,主要的目的是要把小孩的名字們加粗或使用不一樣的字體來做突出。

在不同語言的情況下,名詞所在的位置多有不同。

且由於有些參數必須由外部帶入,所以要在多語系裡面建立參數。

用以下這個例子來說明,「kidsText」在英文的話是這樣:

Image

而在中文的話是這樣:

Image

這就會衍生另一個問題,在使用多語系字串時很難各別客製化某個參數的 Style:

Image

解決方式

後來在 Stackoverflow 查了滿久的,才終於發現有人推薦使用 styled_text 來做相關的處理。

簡單來說就是使用客製化的 tag 在你想要的字串上:

Image

即可達成上方設計圖所想要的樣子。

Hexo 常用指令記載

評論

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×