android應用開發-從設計到實現 2-4 文字的使用

文字的使用

文字是應用當中使用最多的要素。顯示一段供用戶閱讀的文字，程序運行時的信息提示都離不開它。

文字是內容的實際體現者，因此設計師需要將用戶的注意力儘可能的吸引到文字當中。

字體可以分成兩種類型：有襯線的-serif；無襯線的-sans-serif，也簡稱sans。serif的筆劃端部會多出來一截修飾；sans的筆劃端部是平的。

在過去，serif通常用來做文章的內容，sans用來做標題；但是現在，內容也開始使用serif了，這是一種新的趨勢。在安卓系統中，就採用了sans字體做文字的默認顯示。

不同的文字內容，需要吸引用戶不同程度的注意力。例如，按鈕上的文字和內容都需要吸引用戶的注意力，但是它們的重要程度是不一樣的。這種吸引的程度可以通過字體的大小和字體的顏色來實現。

字體

前面提到的serif與sans-serif是通過襯線將字體分成了2類。接下來我們開始認識認識字體。

從文字的形狀出發，可以將文字分成三類，

1. English-like：英文、拉丁文等字母組合型的文字；

2. Tall：像阿拉伯文字、泰文這種像繪畫片段組合成的文字；

3. Dense：像中文、日文、韓文等具有高密度筆畫等文字；

我們主要進行中文應用的開發，所以會遇到很多Dense類型的字體。

字體和某個具體的字體是兩個不同的概念，前者是對具有相同間架結構文字的總稱，是個很寬泛的概念；而具體的字體指的是使用時，爲了顯示某個文字而具體使用的文字形狀。

例如Arial字體，它下面就擁有多個子項目-字體家族。

字體家族-font family是一個家族的名字，它的下面可以有多種字形-style。例如Arial字體家族，它就擁有多個字形：Regular-常規 Italic-斜體 Bold-粗體 Bold Italic-斜粗體，這幾種字形也是其他字體家族中最經常具有的。

某個具體的字體，例如Arial Regular，就是由它所在的字體家族和字形來決定。所以每說到一個具體的字體，都可以找到它對應的字體家族和字形。

例如下面的Arial Arial Black Arial Hebrew，分別對應着3種不同的字體家族；而每個字體家族下面都有各自具體的字型。

可以看到，有的字體家族下面可以只存在一種字形，也可以存在多種字形。這就完全看字體設計師的實現了。

例子裏面的字體都是Arial字體，它下面的子項名稱中雖然都有Arial，但都屬於不同的字體家族。

Noto

對於Dense類型的文字，安卓系統使用Google提供的開源字體Noto。

Noto字體家族本身擁有了很多字體：Noto Sans，Noto Serif，Noto Momo……。

Noto擁有從英文字母到漢字的所有文字，對於我們開發中文應用，完全沒有問題。顯示簡體中文的時候，使用的是Noto Sans CJK SC。

Noto有7種字形：Thin，Light，DemiLight，Regular，Medium，Bold，Black。它們對應的具體字體的粗細是各不相同。

關於Noto字體名字的由來，還有一個這樣的小故事：

電腦中顯示字符的時候，如果系統中沒有安裝對應的字體，那麼就會在屏幕上顯示一個空白的方框-口來代替。如果連續出現很多個不能顯示的文字，顯示的內容就像是口口口口口。外國人覺得這個方框像我們中國的豆腐，於是就叫它tofu。爲了消滅這些豆腐，No tofu的口號就成爲了Noto的名字。看來Noto爲此發了大願，消滅文字顯示中的一切盲區。

大家可以在Google提供的官方網站獲得Noto字體更爲細節的信息。

Roboto

對於English-like類型的文字，安卓系統使用Google提供的開源字體Roboto，它看上去要寬且圓潤，現在在很多平臺上得到了廣泛的應用。

Roboto有6種字形：Thin，Light，Regular，Medium，Bold，Black。

Roboto與Noto是兼容的，當選定Roboto的一種粗細的筆劃時，就能在Noto當中找到對應粗細的筆劃。

大家可以在Google提供的官方網站獲得Roboto字體更爲細節的信息。

大小

不同的位置，文字顯示的大小也可能有所不同。Material Design對界面上各個顯示元素中使用到的文字大小，作出了規定。

顯示English-like內容的時候，在中文系統中顯示英文：

顯示的位置	字體類型	字體大小
Display 4	Light	112sp
Display 3	Regular	56sp
Display 2	Regular	45sp
Display 1	Regular	34sp
Headline	Regular	24sp
Title	Medium	20sp
Subheading	Regular	16sp
Body 2	Medium	14sp
Body 1	Regular	14sp
Caption	Regular	12sp
Button	Meduim	14sp

顯示Dense內容的時候，在中文系統中顯示漢字：

顯示的位置	字體類型	字體大小
Display 4	Light	112sp
Display 3	Regular	56sp
Display 2	Regular	45sp
Display 1	Regular	34sp
Headline	Regular	24sp
Title	Medium	21sp
Subheading	Regular	17sp
Body 2	Medium	15sp
Body 1	Regular	15sp
Caption	Regular	13sp
Button	Meduim	15sp

規律就是，顯示正文時（從title開始），中文比顯示英文要大1sp。

Display對大家來說可能比較陌生：它的用法是將文字作爲一個大區域的顯示，例如手機待機時屏幕上顯示的時間信息，就是將文字當作Display來運用的。

格式

爲了便於用戶閱讀，讓用戶有良好的閱讀體驗，我們還要考慮文字當中，

• 行之間的間距。

• 每一行佔據的寬度。對於長段的內容，字符控制在60個每行；對於簡短的內容，字符控制在30個每行。

顏色

文字使用的顏色與背景的顏色相關，採用白色或者黑色，目的是提高文字的可讀性，不要讓文字的顏色和背景的顏色混在一起。

文字的顏色需要根據顯示的位置體現出不同的深淺顏色。這種顏色的深淺是通過調整字體的透明度實現的，而不是將字體設置成一種灰色。

字體顏色

安卓系統根據顯示內容的重要性，將文字主要分成了好些類：textColorPrimary textColorSecondary textColorPrimaryActivated textColorSecondaryInverse 等等。不過最重要的就是：

• textColorPrimary：就是Primary text-主要文字內容使用的顏色。它使用在文字的title，headline，subhead，Body1～2，Button這些位置。
• textColorSecondary：就是Secondary text-次要文字內容使用的顏色。它使用在Display 1～4，Caption這些位置。

淺色背景

對於淺色背景，字體使用純黑色-#000000，根據使用場景的不同，透明度不同，

使用的場景	透明度
Primary text	87%
Secondary text	54%
Disable text, Hint text	38%

假如文字需要與圖標配合使用，那麼文字的顏色也是使用純黑色-#000000，但是會根據圖片當前是否處於激活的狀態而不同，

圖標激活狀態	圖標對應文字的透明度
激活	54%
未激活	38%

深色背景

對於深色背景，字體使用純白色-#FFFFFF，根據使用場景的不同，透明度不同，

使用的場景	透明度
Primary text	100%
Secondary text	70%
Disable text, Hint text	50%

假如文字需要與圖標配合使用，那麼文字的顏色也是使用純白色-#FFFFFF，但是會根據圖片當前是否處於激活的狀態而不同，

圖標激活狀態	圖標對應文字的透明度
激活	100%
未激活	50%

字體的下載和使用

前面提到的Noto字體和Roboto字體，可以分別在
Noto的官網 和Robot的官網看到更爲詳細的介紹，並下載。

假如你的電腦上並沒有安裝這兩種字體，請去官網下載。

下載以後(這裏用安裝Noto的簡體中文字體來舉例),

1. 將得到的壓縮包解壓；

2. 依次雙擊字體文件*.ttf或*.otf；

這樣就可以將這些自己安裝到電腦上了，在設計的過程中，就能夠選擇到對應的字體了。

---

本文是《從設計到實現-手把手教你做android應用開發》系列文檔中的一篇。感謝您的閱讀和反饋，對本文有任何的意見和建議請留言，我都會盡量一一回復。

如果您覺得本文對你有幫助，請推薦給更多的朋友；或者加入我們的QQ羣348702074和更多的小夥伴一起討論；也希望大家能給我出出主意，讓這些文檔能講的更好，能最大化的幫助到希望學習開發的夥伴們。

除了CSDN發佈的文章，本系列最新的文章將會首先發布到我的專屬博客book.anddle.com。大家可以去那裏先睹爲快。