android canvas drawText()文字居中效果
本文跟大家分享下我關(guān)于drawText()文字居中的方法。
先附上drawText()的方法說明
說實話當(dāng)時看了這個,我也沒明白這個x,y坐標(biāo)到底表達(dá)的啥意思,還一直以為是繪制文字中心的坐標(biāo),后來發(fā)現(xiàn)這個理解是錯誤的
要想理解這個首先看張圖
像圖上這樣安卓的文字繪制是相對于基線繪制的,也就是圖中的紅線,而top+bottom的長度就等于字體高度.即等于|top|+|bottom|絕對值
實際繪制的時候取決于基線上一個點來繪制文字,而這個點有三種分別對應(yīng)為left,center,right如下圖
而drawText()方法中x,y坐標(biāo)所指的點就是上圖基線上三個點中的一個,具體是哪一個根據(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è)置基線上那個點究竟是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);//基線中間點的y軸計算公式 canvas.drawText("你好世界",rect.centerX(),baseLineY,textPaint);
這里有點要注意textPaint.getFontMetrics()這個方法一定要在設(shè)置字體大小或者樣式等等一系列會影響字體的方法后在調(diào)用,不然獲取到的top和bottom值不準(zhǔn).
效果如下
正好是在中間的,即證明等式是沒有問題的,再來分析這個等式是如何計算的
之所以drawText()方法中x,y指的是基線中間的那個點,是因為setTextAlign(Paint.Align.Center)
那么要想在正中間顯示文字,x只要為矩形的中點x坐標(biāo)即可 x = rect.centerX()
要計算的就是基線中間圖上紅色點的y坐標(biāo)了,看圖可以發(fā)現(xiàn)紅色點的y為矩形中點黑色點的y坐標(biāo)+圖中黑色點和紅色點之間的距離
矩形y坐標(biāo)為 rect.centerY()
黑色點和紅色點之間的距離為相對于基線的(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í)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android學(xué)習(xí)之Span的使用方法詳解
這篇文章主要為大家詳細(xì)介紹了Android中各種Span類的使用方法,文中的示例代碼講解詳細(xì),對我們學(xué)習(xí)Android有一定的幫助,需要的可以參考一下2022-06-06Android TextWatcher內(nèi)容監(jiān)聽死循環(huán)案例詳解
這篇文章主要介紹了Android TextWatcher內(nèi)容監(jiān)聽死循環(huán)案例詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08Adapter模式實戰(zhàn)之重構(gòu)鴻洋集團(tuán)的Android圓形菜單建行
這篇文章主要介紹了Adapter模式實戰(zhàn)之重構(gòu)鴻洋集團(tuán)的Android圓形菜單建行的相關(guān)資料,需要的朋友可以參考下2016-03-03