Android Canvas的drawText()和文字居中方案

自定義View是繪制文本有三類方法

// 第一類
public void drawText (String text, float x, float y, Paint paint)
public void drawText (String text, int start, int end, float x, float y, Paint paint)
public void drawText (CharSequence text, int start, int end, float x, float y, Paint paint)
public void drawText (char[] text, int index, int count, float x, float y, Paint paint)

// 第二類
public void drawPosText (String text, float[] pos, Paint paint)
public void drawPosText (char[] text, int index, int count, float[] pos, Paint paint)

// 第三類
public void drawTextOnPath (String text, Path path, float hOffset, float vOffset, Paint paint)
public void drawTextOnPath (char[] text, int index, int count, Path path, float hOffset, float vOffset, Paint paint)

其中drawText()最常用流纹,drawPosText ()是根據(jù)一個個坐標(biāo)點(diǎn)指定文字位置,drawTextOnPath ()是根據(jù)路徑繪制。但drawText()的x,y參數(shù)是干嘛的呢秧廉?

先來測試下

Paint paint=new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setStrokeWidth(12);
        paint.setTextSize(100);

        String text="測試:my text";
        canvas.drawText(text, 200, 400, paint);

        //畫兩條線標(biāo)記位置
        paint.setStrokeWidth(4);
        paint.setColor(Color.RED);
        canvas.drawLine(0, 400, 2000, 400, paint);
        paint.setColor(Color.BLUE);
        canvas.drawLine(200, 0, 200, 2000, paint);
左對齊-left

可以看到柜砾,x,y并不是指定文字的中點(diǎn)位置稳其,并且x,y與文字對齊方式有關(guān)(通過setTextAlign()指定,默認(rèn)為left)

居中對齊-center
右對齊-right

(為了使文字完整耕驰,上面調(diào)整了下x,y的值)

從上面三種情況得出結(jié)論爷辱,x所對應(yīng)的豎線:

  • 左對齊 — 文字的左邊界
  • 居中對齊 — 文字的中心位置
  • 右對齊 — 文字的左邊界

y對應(yīng)的橫線并不是文字的下邊界,而是基準(zhǔn)線Baseline

看下面這張圖

紅色的Baseline是基準(zhǔn)線,紫色的Top是文字的最頂部饭弓,也就是在drawText()中指定的x所對應(yīng)双饥,橙色的Bottom是文字的底部。
拿這些值如何獲取呢示启?

Paint.FontMetrics fontMetrics=paint.getFontMetrics();
        fontMetrics.top
        fontMetrics.ascent
        fontMetrics.descent
        fontMetrics.bottom

記得要在設(shè)置完P(guān)aint的文字大小兢哭,寬度之類屬性后再獲取FontMetrics,
baseline對應(yīng)對應(yīng)值為0夫嗓,在它下面的descent和bottom值為正迟螺,top和ascent為負(fù)。那文字的高度為bottom - top

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

好啦矩父,把drawText()中x,y參數(shù)講清楚后實(shí)現(xiàn)文字居中就很容易了
直接上代碼

//矩形背景
        Paint bgRect=new Paint();
        bgRect.setStyle(Paint.Style.FILL);
        bgRect.setColor(Color.YELLOW);
        RectF rectF=new RectF(200, 200, 800, 600);
        canvas.drawRect(rectF, bgRect);

        Paint textPaint=new Paint();
        textPaint.setStyle(Paint.Style.FILL);
        textPaint.setStrokeWidth(8);
        textPaint.setTextSize(50);
        textPaint.setTextAlign(Paint.Align.CENTER);

        String text="測試:my text";
        //計(jì)算baseline
        Paint.FontMetrics fontMetrics=textPaint.getFontMetrics();
        float distance=(fontMetrics.bottom - fontMetrics.top)/2 - fontMetrics.bottom;
        float baseline=rectF.centerY()+distance;
        canvas.drawText(text, rectF.centerX(), baseline, textPaint);

效果

將對齊方式設(shè)置為center,那要讓文字居中顯示排霉,x值就為矩形中心x值窍株,y值也就是baseline的計(jì)算看下圖

y = 矩形中心y值 + 矩形中心與基線的距離

距離 = 文字高度的一半 - 基線到文字底部的距離(也就是bottom)
     = (fontMetrics.bottom - fontMetrics.top)/2 - fontMetrics.bottom
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市攻柠,隨后出現(xiàn)的幾起案子球订,更是在濱河造成了極大的恐慌,老刑警劉巖瑰钮,帶你破解...
    沈念sama閱讀 218,682評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件冒滩,死亡現(xiàn)場離奇詭異,居然都是意外死亡浪谴,警方通過查閱死者的電腦和手機(jī)开睡,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來苟耻,“玉大人篇恒,你說我怎么就攤上這事⌒渍龋” “怎么了胁艰?”我有些...
    開封第一講書人閱讀 165,083評論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長官卡。 經(jīng)常有香客問我蝗茁,道長,這世上最難降的妖魔是什么寻咒? 我笑而不...
    開封第一講書人閱讀 58,763評論 1 295
  • 正文 為了忘掉前任哮翘,我火速辦了婚禮,結(jié)果婚禮上毛秘,老公的妹妹穿的比我還像新娘饭寺。我一直安慰自己阻课,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,785評論 6 392
  • 文/花漫 我一把揭開白布艰匙。 她就那樣靜靜地躺著限煞,像睡著了一般。 火紅的嫁衣襯著肌膚如雪员凝。 梳的紋絲不亂的頭發(fā)上署驻,一...
    開封第一講書人閱讀 51,624評論 1 305
  • 那天,我揣著相機(jī)與錄音健霹,去河邊找鬼旺上。 笑死,一個胖子當(dāng)著我的面吹牛糖埋,可吹牛的內(nèi)容都是我干的宣吱。 我是一名探鬼主播,決...
    沈念sama閱讀 40,358評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼瞳别,長吁一口氣:“原來是場噩夢啊……” “哼征候!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起祟敛,我...
    開封第一講書人閱讀 39,261評論 0 276
  • 序言:老撾萬榮一對情侶失蹤疤坝,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后馆铁,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體卒煞,經(jīng)...
    沈念sama閱讀 45,722評論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年叼架,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片衣撬。...
    茶點(diǎn)故事閱讀 40,030評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡乖订,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出具练,到底是詐尸還是另有隱情乍构,我是刑警寧澤,帶...
    沈念sama閱讀 35,737評論 5 346
  • 正文 年R本政府宣布扛点,位于F島的核電站哥遮,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏陵究。R本人自食惡果不足惜眠饮,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,360評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望铜邮。 院中可真熱鬧仪召,春花似錦寨蹋、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,941評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至召娜,卻和暖如春运褪,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背玖瘸。 一陣腳步聲響...
    開封第一講書人閱讀 33,057評論 1 270
  • 我被黑心中介騙來泰國打工秸讹, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人店读。 一個月前我還...
    沈念sama閱讀 48,237評論 3 371
  • 正文 我出身青樓嗦枢,卻偏偏與公主長得像,于是被迫代替她去往敵國和親屯断。 傳聞我的和親對象是個殘疾皇子文虏,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,976評論 2 355

推薦閱讀更多精彩內(nèi)容