Android自定义View 一附<点,线,矩形,扇形和文字的简单用法>

点和线

Paint paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setStrokeWidth(10);
        //一个点 前两个参数为坐标
        canvas.drawPoint(100,100,paint);
        //多个点,数组值为俩俩一组分别表示每个点的所在XY坐标
        float[] pts = {0,0,100,100,100,100,200,100,200,100,500,600};
        canvas.drawPoints(pts,paint);
        //一条线.参数分别为起止点和终止点的XY坐标
        canvas.drawLine(500,500,800,800,paint);
        //多条线,数组值四个为一组分别表示起止点的XY和终止点的XY
        float[] pts2 = {0,0,100,100,100,100,200,100,200,100,500,600};
        canvas.drawLines(pts,paint);

矩形和椭圆

        //画一个矩形需要一个Rectf类型的对象 构造参数就是矩形左上角以及右下角的XY坐标值
        RectF refct = new RectF(0,100,100,500);
        //也可以直接把坐标写在方法的参数里面 含义是一样的
        //canvas.drawRect(100,100,500,500,paint);
        //画一个椭圆同样需要一个Rectf,参数表示椭圆四个点的位置
        canvas.drawOval(refct,paint);

弧形

弧形可以看做是椭圆的扩展

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
 /*因为这种写法对API有要求所以这里加了个if,当然也可以用RectF 这个就对API要求没那么高了
  *解释下四个参数前两个表示左上角的坐标 后两个表示右下角的坐标
  *其实就是在一个矩形里面画圈
  * 第五和第六表示弧度制表示从第五个数值偏转第六个数值
  *boolean值表示是否连接中心点
 */
            //光这么说可能有些蒙 结合图来看看就很清晰了
            canvas.drawArc(0,0,200,200,0,270,true,paint);
        }

前四个参数好理解就是这个弧形(圆形)的最大边框的矩形的左上和右下的坐标
主要是第五个和第六个 我这里只能说说自己的理解我这个例子写的是从零度转,转270度.我们可以拿表盘来参考以下就很容易理解了,0度其实就是圆心水平的那条线的右点,就好比表盘的3点位置,那么与之对应的9点就是180度,同理6点和12点分别就是90度和270度 所以我这个0到270度的例子其实就是从3点开始到12点结束的这么一个扇形
这里写图片描述
如果我想画一个从5点到11点的扇形的话,5点是60度的位置,11点是240度的位置所
中间差了180度,也就是说我需要从60度开始转并且转180度代码如下

canvas.drawArc(0,0,200,200,60,180,true,paint);

这里写图片描述
再比如想画一个从7点到3点的扇形的话,7点是120度的位置,3点是0度也就是360度,中间差了240度,也就是说我需要从120度开始转并且转到240度代码如下

canvas.drawArc(0,0,200,200,120,240,true,paint);

这里写图片描述
这样来想是不是很容易理解了呢,下面说那个boolean的值,它表示是否与圆心连接,也就是这个扇形的起止点和终止点是否和圆心连上线,以上的例子我都是用的true也就是连上线 下面我用一个不连线的例子一看就明白了

  canvas.drawArc(0,0,200,200,120,240,false,paint);

还是刚才的从7点到3点 只是改成了false来看下效果
这里写图片描述
这个就是那两个点不和圆心连接因为我用的是填充所以它俩个点连上了,设置成描边模式后
这里写图片描述
就是缺一块的圆,缺的那部分就是那两个角度值指定的,这样的图有没有很眼熟?就是很常见的进度圈动画,转圈圈.

文字

先来一个最简单的

paint.setTextSize(100);
        paint.setStrokeWidth(2);
        paint.setStyle(Paint.Style.STROKE);
String text = "好好学习 天天向上";
        canvas.drawText(text,100,600,paint);

第一个参数为内容,第二个和第三个表示起始点的坐标
这里写图片描述

RectF refct = new RectF(300,600,800,1500);
String text = "好好学习 天天向上";
        Path path = new Path();
        path.addRect(refct, Path.Direction.CW);
        canvas.drawTextOnPath(text,path,0,0,paint);

drawTextOnPath可以将一段文字绘制到一个path上,这个例子我用了一个矩形,第三个和第四个参数表示XY的偏移量 这里先给定0;path.addRect的第一个参数我们刚才说到了就是矩形的位置,第二个参数表示文字显示的放心其中CW表示顺时针 CCW表示逆时针 效果如下
这里写图片描述
下面这个例子我们来说下偏移量的使用


        RectF refct = new RectF(200,200,1000,1000);
        String text = "好好学习 天天向上";
        Path path = new Path();
        path.addArc(refct,120,240);
        canvas.drawArc(refct,120,300,false,paint);
        canvas.drawTextOnPath(text,path,0,0,paint);

代码很简单 就是把一个文本沿着一个扇形显示出来效果如下
这里写图片描述
现在吧X轴的偏移量改成500
这里写图片描述
依然是沿着这个扇形展示 但是位置变了 顺着X轴方向偏移量,看上去还往上走了但其实这个偏移量是针对path的内容说的,文本内容对这个扇形只有X轴方向的便宜 并没有Y轴 我们现在把Y轴也改一下 X轴还是500 Y轴给100 效果如下
这里写图片描述
偏移量均可设置负值 Y轴设置为-100
这里写图片描述
这都是一些简单地用用法,各种方法搭配起来可以实现很多效果.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值