android canvas drawText()文字居中效果

更新時間：2021年09月26日 14:59:16 作者：zhuliyuan丶

這篇文章主要為大家詳細(xì)介紹了android canvas drawText()文字居中效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文跟大家分享下我關(guān)于drawText()文字居中的方法。

先附上drawText()的方法說明

說實話當(dāng)時看了這個,我也沒明白這個x,y坐標(biāo)到底表達(dá)的啥意思,還一直以為是繪制文字中心的坐標(biāo),后來發(fā)現(xiàn)這個理解是錯誤的
要想理解這個首先看張圖

像圖上這樣安卓的文字繪制是相對于基線繪制的,也就是圖中的紅線,而top+bottom的長度就等于字體高度.即等于|top|+|bottom|絕對值

實際繪制的時候取決于基線上一個點(diǎn)來繪制文字,而這個點(diǎn)有三種分別對應(yīng)為left,center,right如下圖

而drawText()方法中x,y坐標(biāo)所指的點(diǎn)就是上圖基線上三個點(diǎn)中的一個,具體是哪一個根據(jù)paint的setTextAlign()方法設(shè)置,默認(rèn)為left
示例代碼如下

Rect rect = new Rect(100,100,500,500);//畫一個矩形 
    Paint rectPaint = new Paint(); 
    rectPaint.setColor(Color.BLUE); 
    rectPaint.setStyle(Paint.Style.FILL); 
    canvas.drawRect(rect, rectPaint); 
 
    Paint textPaint = new Paint(); 
    textPaint.setColor(Color.WHITE); 
    textPaint.setTextSize(50); 
    textPaint.setStyle(Paint.Style.FILL); 
    //該方法即為設(shè)置基線上那個點(diǎn)究竟是left,center,還是right 這里我設(shè)置為center 
    textPaint.setTextAlign(Paint.Align.CENTER); 
 
    Paint.FontMetrics fontMetrics = textPaint.getFontMetrics(); 
    float top = fontMetrics.top;//為基線到字體上邊框的距離,即上圖中的top 
    float bottom = fontMetrics.bottom;//為基線到字體下邊框的距離,即上圖中的bottom 
 
    int baseLineY = (int) (rect.centerY() - top/2 - bottom/2);//基線中間點(diǎn)的y軸計算公式 
 
    canvas.drawText("你好世界",rect.centerX(),baseLineY,textPaint);

這里有點(diǎn)要注意textPaint.getFontMetrics()這個方法一定要在設(shè)置字體大小或者樣式等等一系列會影響字體的方法后在調(diào)用,不然獲取到的top和bottom值不準(zhǔn).

效果如下

正好是在中間的,即證明等式是沒有問題的,再來分析這個等式是如何計算的

之所以drawText()方法中x,y指的是基線中間的那個點(diǎn),是因為setTextAlign(Paint.Align.Center)
那么要想在正中間顯示文字,x只要為矩形的中點(diǎn)x坐標(biāo)即可 x = rect.centerX()
要計算的就是基線中間圖上紅色點(diǎn)的y坐標(biāo)了,看圖可以發(fā)現(xiàn)紅色點(diǎn)的y為矩形中點(diǎn)黑色點(diǎn)的y坐標(biāo)+圖中黑色點(diǎn)和紅色點(diǎn)之間的距離
矩形y坐標(biāo)為 rect.centerY()
黑色點(diǎn)和紅色點(diǎn)之間的距離為相對于基線的(top+bottom)/2 - bottom
而 top是相對于基線的所以為負(fù)數(shù),所以公式為 (-top+bottom)/2 - bottom簡化下為-top/2 - bottom/2
所以最后計算為rect.centerY - top/2 - bottom/2.

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: