自定義控件詳解（七）：drawText()

比較基礎的一個方法。即繪制文本

使用如下：

Paint paint = new Paint();   

paint.setColor(Color.RED);   // 紅色字型
paint.setStyle(Paint.Style.FILL); // 類型
paint.setStrokeWidth(1);       // 畫筆線條寬度
paint.setTextSize(60);         // 繪制文本大小

// 繪制内容
canvas.drawText("聽着music睡 ' blogs" , 100 , 200 , paint);      

效果;

  可以看下方法：

 這篇隻讨論第三個方法。

　可以看到 4個參數，第二個、第三個參數 是float類型，實際上就是 繪制的文本的繪制參考坐标。注意這個坐标 不是文本的左上角的那個點，float y 代表 基線的Y位置。

 驗證一下：

 繪制一條藍色的基線，繪制一個文本。

Paint paint = new Paint();
 
        paint.setColor(Color.RED);
        paint.setStyle(Paint.Style.FILL);
        paint.setStrokeWidth(1);
        paint.setTextSize(60);

        int baseLine = 100 ;// 基線的Y坐标
        canvas.drawText("abcdefghi",30 , baseLine , paint);  // 繪制 (30,baseLine) 為參考點的文本
        paint.setColor(Color.BLUE);
        canvas.drawLine(30,baseLine ,300,baseLine,paint); // 繪制基線      

 可以看到，繪制文本的參數(floatx , floaty) 指的是基線的左起點坐标而不是左上角。

擴充：

drawtext除了基線還有另外4條線，稱為4格線。

分别是ascent,descent,top,bottom

• ascent: 系統建議的，繪制單個字元時，字元應當的最高高度所線上
• descent:系統建議的，繪制單個字元時，字元應當的最低高度所線上
• top: 可繪制的最高高度所線上
• bottom: 可繪制的最低高度所線上

怎麼擷取這4個線的y軸坐标呢，有一個類 FontMetrics

這些屬性的值即 與基線的相對y軸距離(可能為負值)

示例：

int baseLineY = 100 ;

        Paint.FontMetrics fm = paint.getFontMetrics();
        float ascent = baseLineY + fm.ascent ; // 制頂線
        float descent = baseLineY+fm.descent ; //制低線
        float top = baseLineY + fm.top ; // 最頂線
        float bottom = baseLineY + fm.bottom ; // 最低限

        // 基線
        paint.setColor(Color.RED);
        canvas.drawLine(baseLineX , baseLineY , 1000 , baseLineY , paint);

        // 制頂線
        paint.setColor(Color.BLUE);
        canvas.drawLine(baseLineX,ascent , 1000 , ascent , paint);

        // 制底線
        paint.setColor(Color.GREEN);
        canvas.drawLine(baseLineX,descent , 1000 , descent , paint);

        // 最頂線
        paint.setColor(Color.YELLOW);
        canvas.drawLine(baseLineX,top,1000,top  , paint);

        // 最底線
        paint.setColor(Color.MAGENTA);
        canvas.drawLine(baseLineX  , bottom  , 1000 , bottom ,paint);

        //寫文字
        paint.setColor(Color.BLACK);
        canvas.drawText("聽着music睡 ' blogs" ,baseLineX,baseLineY , paint);      

可以看到：

黃色的最頂線top

藍色的制頂線ascent

紅色的基線baseline

綠色的制低線descent

粉色的最低限bottom