Canvas关于Path的解析

来源:互联网 发布:最新office办公软件 编辑:程序博客网 时间:2024/06/06 15:35

最近的项目里面用到了surface绘制动态走势图,里面就使用了Path相关的知识。这里总结一下以后回来查看

        reset()                         //恢复初始状态        lineTo(float x, float y)        //去连接下一个点        moveTo(float x, float y)        //移动第一个点的位置        close()                         //当前path为闭合状态        //下面就是一些实际场景应用,接下来一个个解析        path.addArc(oval, startAngle, sweepAngle)        arcTo(RectF oval, float startAngle, float sweepAngle)        quadTo(float x1, float y1, float x2, float y2)        addCircle(float x, float y, float radius, Direction dir)        addOval(RectF oval, Path.Direction dir)        addPath(Path src, float dx, float dy)

有标识,不解释


直接上代码,一个个解析下

//初始化的代码一笔 带过

    private void init() {        paint = new Paint();        paint.setColor(Color.RED);        paint.setStrokeWidth(3);  //设置画笔宽度        paint.setAntiAlias(true);   //消除锯齿        paint.setStyle(Paint.Style.STROKE);     //设置镂空(方便查看效果)    }


先来绘制最简单的折线

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Path path = new Path();        path.moveTo(100, 100);  //移动第一个位置        path.lineTo(300, 500);  //连接第二个点        path.lineTo(500, 200);  //连接第三个点        path.close();           //闭合当前        canvas.drawPath(path, paint);    }




=========================================================================================================

Path 绘制圆弧

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Rect rect = new Rect(100, 200, 600, 500);  //绘制圆弧的范围        path.addArc(new RectF(rect), 0, 180);      //添加到路径        canvas.drawPath(path, paint);              //绘制路径    }


=========================================================================

Path 使用之arcTo(RectF oval, float startAngle, float sweepAngle)

arcTo(RectF oval, float startAngle, float sweepAngle)方法:arcToaddArc的区别:        1.addArc可以直接加入一段椭圆弧。使用arcTo还需要使用moveTo指定当前点的坐标。         2.arcTo如果当前点坐标和曲线的起始点不是同一个点的话,还会自动添加一条直线补齐路径。

看代码

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Rect rect = new Rect(100, 200, 600, 400);        path.moveTo(900, 300);        path.arcTo(new RectF(rect), 0, 90);        canvas.drawPath(path, paint);    }


=============================================================

Path使用之 

quadTo(float x1, float y1, float x2, float y2)

一般绘制贝塞尔曲线或者画板会用到这个方法

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        path.moveTo(20, 100);   //第一个点的位置        path.quadTo(40, 400, 600, 100);        //第一二个参数为控制点  ,第三四个参数是终点        canvas.drawPath(path, paint);    }






============================================================================

Path 绘制圆形 ,绘制椭圆方法一样 ,这里写一起

 addCircle(float x, float y, float radius, Direction dir)
 addOval(float left, float top, float right, float bottom, Direction dir)

第一个和第二个参数是圆心的位置,第三个参数是半径,Direction为绘制的方向

       Diection.CCW逆时针方向

       Diection.CW   顺时针方向

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        path.addCircle(500, 500, 50, Path.Direction.CW);        canvas.drawPath(path, paint);    }




========================================================================================

Path 解析之

addPath(Path src, float dx, float dy)

偏移路径

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        path.addCircle(500, 500, 50, Path.Direction.CW);        canvas.drawPath(path, paint);        path.addPath(path,300,0);        canvas.drawPath(path, paint);    }















原创粉丝点击