Android Underline

以为手机UI设计里一般不会碰到使用下划线的情况,但断断续续还是有不少使用下划线的情况。

我是不太喜欢下划线的样式,以前搞前端时表现网页链接,也喜欢仅仅使用颜色区分。即使要使用下划线也避免用text-decoration:underline,而是使用border-bottom的绘制。

为了还原设计稿上的下划线,在Android上要实现类似border-bottom的下划线其实也不是很复杂。首先得了解一下字体相关的知识,默认的下划线一般是绘制在Baseline下,为了调整下划线和字体的间距,决定将下划线绘制在Descender Line下。

想了两套方案:

  1. 类似ImageSpan的形式:将要显示下划线的文字用图片绘制,同时绘制下划线,使用SpannableString替换TextView的文字。

    • 优点:灵活使用,可以在任意TextView或EditText中使用。
    • 缺点:不支持换行,文字不能编辑。文字转图片开销有点不划算。
  2. 自定义控件:在onDraw时绘制下划线。这种方式最简单啦,又能支持换行。(偷懒就让所有文字都显示下划线,要个别文字显示下划线还得查找字符测量宽度慢慢计算)。

具体代码参见 github,预览图:

截图

Author

Relex

Android Developer