前言
不曉得你們有沒有遇過這種狀況：
|
1 2 3 4 5 6 |
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center_vertical" android:drawableRight="@mipmap/arrow" android:text="免費註冊取得更多功能"/> |
在 TextView 的屬性設定了 android:gravity="center_vertical"，
結果一旁的 Drawable 卻沒有置中對齊，變成這樣：
TextView 總是對不齊 Drawable
這是因爲字型設計時，文字會有筆畫延伸高度：
上延筆畫（ascender）
下延筆畫（descender）
而 Android 會針對這兩個高度去畫額外的留白空間，
此時就會導致視覺上文字無法跟圖片垂直置中。
設計師看到就會訐譙你這跟他畫的 mockup 不一樣。
解決方法
|
1 2 3 4 5 6 7 8 9 |
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center_vertical" android:drawableRight="@mipmap/arrow" android:includeFontPadding="false" android:text="免費註冊取得更多功能"/> |
設定 android:includeFontPadding="false" 這項屬性，
先來看看 Android 官方文件如何說明這項設定：
Leave enough room for ascenders and descenders instead of using the font ascent and descent strictly. (Normally true).
預設為 true，此時會連同額外的留白空間一起畫，
也就是說，當屬性設定為 false 時，
應可預期那些額外的留白會消失，
讓 TextView 的 Drawable 可以垂直置中對齊 。
參考資料
http://circlezine.com/2015/07/30/mix-match-01/
http://blog.justfont.com/2012/11/latin-type-design-1/
