自定义View之绘图篇（三）：文字（Text）

来源：互联网发布：北京淘宝美工培训学校编辑：程序博客网时间：2024/05/17 07:00

顺境也好，逆境也好，人生就是一场对种种困难无尽无休的斗争，一场以寡敌众的战斗。——泰戈尔

自定义View之绘图篇（一）：基础图形的绘制

自定义View之绘图篇（二）：路径（Path）

一、文字

1、文本绘图样式

先来看看下面这个例子：

        mPaint.setStrokeWidth(5);        mPaint.setTextSize(80);        //设置绘图样式 为填充        mPaint.setStyle(Paint.Style.FILL);        canvas.drawText("我是一颗小小的石头", 100,100, mPaint);        //设置绘图样式 为描边        mPaint.setStyle(Paint.Style.STROKE);        canvas.drawText("我是一颗小小的石头", 100,300, mPaint);        //设置绘图样式 为填充且描边        mPaint.setStyle(Paint.Style.FILL_AND_STROKE);        canvas.drawText("我是一颗小小的石头", 100,500, mPaint);

效果图：

2、setTextAlign(Paint.Align align) 文字的对齐方式

        mPaint.setStyle(Paint.Style.FILL);        mPaint.setTextSize(80);        //设置对齐方式  左对齐        mPaint.setTextAlign(Paint.Align.LEFT);        canvas.drawText("小小的石头", 500,100, mPaint);//点（500,100）在文本的左边        //设置对齐方式  中间对齐        mPaint.setTextAlign(Paint.Align.CENTER);        canvas.drawText("小小的石头", 500,200, mPaint);//点（500,100）在文本的中间        //设置对齐方式  右对齐        mPaint.setTextAlign(Paint.Align.RIGHT);        canvas.drawText("小小的石头", 500,300, mPaint);//点（500,100）在文本的右边

3、文字样式设置

        canvas.drawText("小小的石头", 200, 100, mPaint); //不带任何效果        mPaint.setFakeBoldText(true);//是否粗体文字        mPaint.setUnderlineText(true);//设置下划线        mPaint.setStrikeThruText(true);//设置删除线效果        canvas.drawText("小小的石头", 200, 200, mPaint);

4、文字倾斜度设置

        mPaint.setTextSkewX(-0.25f);        canvas.drawText("小小的石头", 100, 100, mPaint);        mPaint.setTextSkewX(0.25f);        canvas.drawText("小小的石头", 100, 200, mPaint);        mPaint.setTextSkewX(-0.5f);        canvas.drawText("小小的石头", 100, 300, mPaint);

可见普通斜体字是-0.25f，大于-0.25f 向左倾斜，小于 -0.25f 向右倾斜。

5、水平拉伸设置

        mPaint.setTextScaleX(1);//不拉伸        canvas.drawText("小小的石头", 100, 100, mPaint);        mPaint.setTextScaleX(2);//水平方向拉伸2倍        canvas.drawText("小小的石头", 100, 200, mPaint);        mPaint.setTextScaleX(3);//水平方向拉伸3倍        canvas.drawText("小小的石头", 100, 300, mPaint);

由上可以发现，仅是水平方向拉伸，高度并未改变。

canvas绘制文字

1、drawText

方法预览：

drawText(String text, float x, float y, Paint paint)drawText(char[] text, int index, int count, float x, float y, Paint paint)drawText(CharSequence text, int start, int end, float x, float y, Paint paint)drawTextRun(char[] text, int index, int count, int contextIndex, int contextCount, float x, float y, boolean isRtl, Paint paint)drawTextRun(CharSequence text, int start, int end, int contextStart, int contextEnd, float x, float y, boolean isRtl, Paint paint)

第一个构造函数：是最普通的。
第二个构造函数： text 字节数组；index 表示第一个要绘制的文字索引；count 需要绘制的文字个数。
第三个构造函数： text 表示字符（注意与上面比较）；start 开始截取字符的索引号；end 结束截取字符的索引号。（注意和上面的区别） [start , end ) 包含 start 但不包含 end

第四个构造函数和第五个构造函数： contextIndex 和 index 相同； contextCount 大于等于 count ； isRtl 表示排列顺序，true 表示正序，false 表示倒序（这里的倒是指第一个字符变到最后一个字符，最后一个字符变到第一个字符）。注意了drawTextRun方法是在 skd23 才引入的方法。

       canvas.drawText("我是一颗小小的石头".toCharArray(), 1, 4, 100, 100, mPaint);        canvas.drawText("我是一颗小小的石头", 1, 4, 100, 200, mPaint);        //最小sdk23        canvas.drawTextRun("我是一颗小小的石头".toCharArray(), 1, 4, 1, 4, 100, 300, true, mPaint);        canvas.drawTextRun("我是一颗小小的石头".toCharArray(), 1, 4, 1, 4, 100, 400, false, mPaint);

2、drawPosText

方法预览：

drawPosText(String text, float[] pos, Paint paint)drawPosText(char[] text, int index, int count, float[] pos, Paint paint)

这里的参数含义和 drawText 方法的参数一样。我们来看个简单的例子：

        float[] pos = {100, 100, 200, 200, 300, 300, 400, 400, 500, 500, 600, 600};        canvas.drawPosText("我是一颗小小", pos, mPaint);

3、drawTextOnPath

方法预览：

drawTextOnPath(String text, Path path, float hOffset, float vOffset, Paint paint)drawTextOnPath(char[] text, int index, int count, Path path, float hOffset, float vOffset, Paint paint)

参数含义：

index，count ：和上面截取参数含义一样，这里不再累诉。

hOffset ：与路径起点的水平偏移量，正数向 X 轴正方
形移动（下移）；负数向 X 轴负方向移动
（上移）如果是圆弧：正数是顺时针的偏移
量；反之是逆时针的偏移量

vOffset ：与路径中心的垂直偏移量，正数向 Y 轴正方
形移动（右移）；负数向 Y 轴负方向移动
（左移）

        mPath.moveTo(100,100);        mPath.lineTo(800,100);        canvas.drawTextOnPath("我是一颗小小的石头",mPath,10,-10,mPaint);

路径为圆弧的例子：

        mPath.addCircle(500,500,200, Path.Direction.CW);        canvas.drawTextOnPath("我是一颗小小的石头",mPath,40,-20,mPaint);

4、Typeface（字体样式设置）

方法预览：

setTypeface(Typeface typeface)

Typeface是用来设置字体样式的，通过paint.setTypeface()来指定。可以指定系统中的字体样式，也可以指定自定义的样式文件中获取。要构建Typeface时，可以指定所用样式的正常体、斜体、粗体等，如果指定样式中，没有相关文字的样式就会用系统默认的样式来显示，一般默认是宋体。

参数类型是枚举类型，枚举值如下：

Typeface.NORMAL //正常体
Typeface.BOLD //粗体
Typeface.ITALIC //斜体
Typeface.BOLD_ITALIC //粗斜体

a、系统字体

方法预览：

create(String familyName, int style) //字体名create(Typeface family, int style)  //类型defaultFromStyle(int style)       //默认类型

我们来看一个简单的例子：

        typeface = Typeface.create("宋体", Typeface.NORMAL);        mPaint.setTypeface(typeface);        canvas.drawText("我是一颗小小的石头", 100, 100, mPaint);        typeface = Typeface.create("楷体", Typeface.NORMAL);        mPaint.setTypeface(typeface);        canvas.drawText("我是一颗小小的石头", 100, 200, mPaint);

从上图可以看出来，设置楷体根本没起作用，在系统的字体当中没有找到楷体。

b、自定义字体

方法预览：

createFromAsset(AssetManager mgr, String path) //Asset中获取createFromFile(File path) //文件路径获取createFromFile(String path) //外部路径获取

由于后面两个方法比较简单，主要来看一下第一个方法。

首先在main下创建assets文件夹，然后在assets文件夹创建fonts文件夹，最后在fonts文件夹下放入font1.ttf，如图：

        typeface = Typeface.createFromAsset(mContext.getAssets(), "fonts/font1.ttf");        //Typeface.createFromFile(mContext.getFilesDir()+"/font1.ttf")        mPaint.setTypeface(typeface);        canvas.drawText("我是一颗小小的石头", 100, 100, mPaint);        typeface = Typeface.createFromAsset(mContext.getAssets(), "fonts/font2.ttf");        mPaint.setTypeface(typeface);        canvas.drawText("我是一颗小小的石头", 100, 200, mPaint);

效果图：

好了，到这里就结束了。

2 0