Android带下划线的TextView

前段时间做项目需要做一个待下划线的TextView,于是研究了下,通过万能的搜索找到这么几个方法:

1.设置TextView的Paint属性

 tv3.getPaint().setFlags(Paint. UNDERLINE_TEXT_FLAG );

2.用Html类的fromHtml()方法格式化要放到TextView里的文字 ,与第1种一样,只是是用代码动态设置

 tv1.setText(Html.fromHtml("<u>"+"北京雾霾“净化”塔更名“警示”塔"+"<u/>"));

3.使用SpannableString类

‘String text="北京雾霾“净化”塔更名“警示”塔";
 SpannableString content = new SpannableString(text);
 content.setSpan(new UnderlineSpan(), 0, text.length(), 0);
 tv4.setText(content);     
效果图如下:

下划线

然而恕小弟愚钝还是没有找到办法只修改下划线颜色的方法,所以只能自定义TextView,又继续扣代码,找到TextView下列属性:

TextView 的 layout里面包含各种获取字符位置、行数、列数等的方法
layout.getLineForOffset 获取该字符所在行数.
layout.getLineBounds获取该行的外包矩形(Rect) 这样 这个字符的顶部Y坐标就是rect的top 底部Y坐标就是rect的bottom
layout.getPrimaryHorizontal获取该字符左边的X左边
layout.getSecondaryHorizontal获取该字符字符的右边X坐标

示例代码如下:
int position = 第几个字符
Layout layout = textView.getLayout();Rect bound = new Rect();
int line = layout.getLineForOffset(position);
layout.getLineBounds(line, bound);
yAxisTop = bound.top;//字符顶部y坐标
yAxisBottom = bound.bottom;//字符底部y坐标
xAxisLeft = layout.getPrimaryHorizontal(position);//字符左边x坐标
xAxisRight = layout.getSecondaryHorizontal(position);//字符右边x坐标
最后实现的代码如下:
public class UnderLineTextView extends TextView {

private Rect mRect;
private Paint mPaint;
private int mColor;
private float density;
private float mStrokeWidth;

public UnderLineTextView(Context context) {
    this(context, null, 0);
}
public UnderLineTextView(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
}
public UnderLineTextView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(context, attrs, defStyleAttr);
}

private void init(Context context, AttributeSet attrs, int defStyleAttr){
      //获取屏幕密度
    density=context.getResources().getDisplayMetrics().density;
    //获取自定义属性
    TypedArray array=context.obtainStyledAttributes(attrs,R.styleable.UnderlinedTextView,defStyleAttr,0);
    mColor=array.getColor(R.styleable.UnderlinedTextView_underlineColor,0xFFFF0000);
    mStrokeWidth=array.getDimension(R.styleable.UnderlinedTextView_underlineWidth,density*2);
    array.recycle();

    mRect=new Rect();
    mPaint =new Paint();
    mPaint.setStyle(Paint.Style.STROKE);
    mPaint.setColor(mColor);
    mPaint.setStrokeWidth(mStrokeWidth);

    }

@Override
protected void onDraw(Canvas canvas) {
    //得到TextView显示有多少行
    int count=getLineCount();

    //得到TextView的布局
    final Layout layout=getLayout();

    float x_start,x_stop,x_diff;
    int firstCharInLine, lastCharInLine;

    for (int i = 0; i < count; i++) {

        //getLineBounds得到这一行的外包矩形,
        // 这个字符的顶部Y坐标就是rect的top 底部Y坐标就是rect的bottom
        int baseline=getLineBounds(i,mRect);
        firstCharInLine=layout.getLineStart(i);
        lastCharInLine = layout.getLineEnd(i);

        //要得到这个字符的左边X坐标 用layout.getPrimaryHorizontal
        //得到字符的右边X坐标用layout.getSecondaryHorizontal
        x_start = layout.getPrimaryHorizontal(firstCharInLine);
        x_diff = layout.getPrimaryHorizontal(firstCharInLine + 1) - x_start;
        x_stop = layout.getPrimaryHorizontal(lastCharInLine - 1) + x_diff;

        canvas.drawLine(x_start,baseline + mStrokeWidth,x_stop, baseline + mStrokeWidth, mPaint);


    }
    super.onDraw(canvas);

}

public int getUnderLineColor() {
    return mColor;
}

public void setUnderLineColor(int mColor) {
    this.mColor = mColor;
    invalidate();
}

public float getUnderlineWidth() {
    return mStrokeWidth;
}

public void setUnderlineWidth(float mStrokeWidth) {
    this.mStrokeWidth = mStrokeWidth;
    invalidate();
}

ps:在xml使用范例为:

<talon.com.underlineText.UnderLineTextView
android:id="@+id/tv_underline"
android:layout_width="match_parent"
app:underlineWidth="2dp"
app:underlineColor="@color/colorAccent"
android:text="我很好我很好我很好"
android:layout_height="wrap_content"/>

其中自定义属性

app:underlineWidth设置下划线宽度
app:underlineColor设置下划线的颜色

至此带下划线的TextView大功告成。效果图如下:
UnderLineTextView

注:童鞋们想要便捷的使用如何破呢?在gradle中加入一行代码,就可以使用啦,如下:

compile 'talon.com:underlineText:1.0.0'

附上github地址,欢迎star.

展开阅读全文

没有更多推荐了,返回首页