1. 程式人生 > >Android文字基線(Baseline)演算法

Android文字基線(Baseline)演算法

原文連結:https://blog.csdn.net/hailuoli/article/details/78558594

引言
Baseline是文字繪製時所參照的基準線,只有先確定了Baseline的位置,我們才能準確的將文字繪製在我們想要的位置上。Baseline的概念在我們使用TextView等系統控制元件直接設定文字內容時是用不到的,但是如果我們想要在Canvas畫布上面繪製文字時,Baseline的概念就必不可少了。 
我們先了解一下Android中Canvas畫布繪製文字的方法,如下圖: 

引數示意:

text,文字內容
x,文字從畫布上開始繪製的x座標(Canvas是一個原點在左上角的平面座標系)
y,Baseline所在的y座標,不少人已開始以為y是繪製文字區域的底部座標,其實是不正確的,這是兩個概念
paint,畫筆,設定的文字的大小顏色等屬性 
瞭解了文字繪製的方法,我們現在就瞭解一下這個引數y(Baseline)的計算方法。
Baseline的概念
我們先看一行文字各區域的分佈示意圖 


 
從上圖來看,Baseline不難理解,它就是E和h的下邊界線。我們還可以得出一個結論,文字的高度=Descent+Ascent。 
然而,上面這個公式並不完全準確,我們再看一個圖: 

我們看到,如果文字的上方有一些特殊的符號,比如上圖中的~或者是我們漢語拼音中的聲調時,文字區域又會多出一部分Leading。 
因此,完整的公式應該是文字的高度=Descent+Ascent+Leading。 
那麼,為什麼第一幅圖中沒有說明Leading的存在呢,原因是我們通常在繪製一行英文或者中文時,Leading的高度為0。我們看一個證據圖,下圖是在繪製英文文字時除錯取得的資料。 
 æå­ååºåæ°å¼å³ç³»å¾.png


其中leading=0,所以我們在文字繪製時不需要考慮Leading,圖中的數值都是距離Baseline的距離,在Baseline上方為負值,下方為正值。

Baseline位置(y軸座標)的計算
為了方便我們對計算過程進行理解,我畫了一幅幫助圖,如下:

假設我們是在畫布Canvas的頂部繪製一行文字,規定一行文字的高度是y,文字區域的高度是Height(TOP和BOTTOM之間,TOP到0和BOTTOM到y的距離相等,這樣文字才看起來是居中)。因此,0到y和TOP到BOTTOM的中線是重合的,y軸座標都是y/2。 
我們要繪製一行文字時,設計必然會告訴我們0到y的距離,所以中線的位置也是固定的y/2,那麼我們設定了Paint的文字大小後,Ascent和Descent又能直接得到,就可以算出中線到基線的距離,公式如下: 
基線到中線的距離=(Descent+Ascent)/2-Descent 
注意,實際獲取到的Ascent是負數。公式推導過程如下: 
中線到BOTTOM的距離是(Descent+Ascent)/2,這個距離又等於Descent+中線到基線的距離,即(Descent+Ascent)/2=基線到中線的距離+Descent。 
有了基線到中線的距離,我們只要知道任何一行文字中線的位置,就可以馬上得到基線的位置,從而得到Canvas的drawText方法中引數y的值。


Android獲取中線到基線距離的程式碼,Paint需要設定文字大小textsize。

    /**
     * 計算繪製文字時的基線到中軸線的距離
     * 
     * @param p
     * @param centerY
     * @return 基線和centerY的距離
     */
    public static float getBaseline(Paint p) {
        FontMetrics fontMetrics = p.getFontMetrics();
        return (fontMetrics.descent - fontMetrics.ascent) / 2 -fontMetrics.descent;
    }