Andriod自定义View二:canvas.drawText参数的介绍以及绘制一个文本居中的案例

首先,我们看下这个方法参数的含义:canvas.drawText(text, x, y, paint),第一个参数是我们需要绘制的文本,第四个参数是我们的画笔,这两个不用多说,主要是第二和第三个参数的含义,这两个参数在不同的情况下的值还是不一样的

x默认是这个字符串的左边在屏幕的位置,如果设置了paint.setTextAlign(Paint.Align.CENTER);那就是字符的中心.

y是指定这个字符baseline在屏幕上的位置,大家记住了,不要混淆,y不是这个字符中心在屏幕上的位置,而是baseline在屏幕上的位置。

那么什么是baseline呢?

Andriod自定义View二:canvas.drawText参数的介绍以及绘制一个文本居中的案例_第1张图片
Paste_Image.png

下面我们来看一下例子

先看一下onDraw的代码如下

protected void onDraw(Canvas canvas) {  
    super.onDraw(canvas);    
    String testString = "测试:gafaeh:1234";  
    Paint mPaint = new Paint();   
    mPaint.setStrokeWidth(3);    
    mPaint.setTextSize(40);    
    mPaint.setColor(Color.RED);  
    mPaint.setTextAlign(Align.LEFT);  
    Rect bounds = new Rect();  
    mPaint.getTextBounds(testString, 0, testString.length(), bounds);  
    canvas.drawText(testString, getMeasuredWidth()/2 - bounds.width()/2, getMeasuredHeight()/2 + bounds.height()/2, mPaint);  
}  

效果如下,很明显这个效果不对

Andriod自定义View二:canvas.drawText参数的介绍以及绘制一个文本居中的案例_第2张图片
Paste_Image.png

这个文本不是垂直居中,往下偏了一点,我前面说了y不是这个字符中心在屏幕上的位置,而是baseline在屏幕上的位置,而我们的代码canvas.drawText(testString, getMeasuredWidth()/2 - bounds.width()/2, getMeasuredHeight()/2 + bounds.height()/2,mPaint);是y在垂直的中央,这是不对的,现在代码修改如下:

protected void onDraw(Canvas canvas) {  
    String testString = "测试:gafaeh:1234";  
    Paint mPaint = new Paint();  
    mPaint.setStrokeWidth(3);  
    mPaint.setTextSize(40);  
    mPaint.setColor(Color.RED);  
    mPaint.setTextAlign(Align.LEFT);  
    Rect bounds = new Rect();  
    mPaint.getTextBounds(testString, 0, testString.length(), bounds);  
    FontMetricsInt fontMetrics = mPaint.getFontMetricsInt();  
    int baseline = (getMeasuredHeight() - fontMetrics.bottom + fontMetrics.top) / 2 - fontMetrics.top;  
    canvas.drawText(testString,getMeasuredWidth() / 2 - bounds.width() / 2, baseline, mPaint);  
}  
Andriod自定义View二:canvas.drawText参数的介绍以及绘制一个文本居中的案例_第3张图片
Paste_Image.png

本文博客地址:
http://blog.csdn.net/e_Inch_Photo/article/details/60981766

你可能感兴趣的:(Andriod自定义View二:canvas.drawText参数的介绍以及绘制一个文本居中的案例)