android 自定义控件--Path 基本用法

最新推荐文章于 2024-07-20 15:26:14 发布
最新推荐文章于 2024-07-20 15:26:14 发布
阅读量511 收藏 3
点赞数 1
分类专栏： android 文章标签： android path
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hjiangshujing/article/details/76615796
版权

Path 使用方法详解

此篇是看了一名来自2.5次元的魔法师的文章后做的笔记，原文http://www.gcssloop.com/customview/Path_Bezier，大家可以看下，文很棒

1. 第一组：moveTo、setLastPoint 、lineTo 、close

方法：lineTo

public void lineTo (float x, float y)

例：画两条线

 public PathView1(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        //初始化画笔
        mPaint = new Paint();             // 创建画笔
        mPaint.setColor(Color.BLACK);           // 画笔颜色 - 黑色
        mPaint.setStyle(Paint.Style.STROKE);    // 填充模式 - 描边
        mPaint.setStrokeWidth(10);              // 边框宽度 - 10

    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        //获取宽高
        width = h;
        height = w;
        super.onSizeChanged(w, h, oldw, oldh);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心(宽高数据在onSizeChanged中获取)

        Path path = new Path();                     // 创建Path

        path.lineTo(200, 200);                      // lineTo 从默认点0,0到 200，200
        path.lineTo(200, 0);                        //再从200，200 到点 200,0

        canvas.drawPath(path, mPaint);              // 绘制Path
    }

结果如图,黑色线图像为结果，图中添加坐标系，有利于理解

这里写图片描述

Path 默认点是坐标原点0,0
事例代码中调用了两次lineTo,

第一次：path.lineTo(200, 200); //从0,0 到点A(200,200)的连线
第二次：path.lineTo(200, 0);//从A(200,200) 到点 B(200,0)的连线
方法 moveTo 和 setLstPoint
// moveTo
public void moveTo (float x, float y)

// setLastPoint
public void setLastPoint (float dx, float dy)
方法名简介是否影响之前操作是否影响之后操作
moveTo移动下一次操作的起点位置否是
setLastPoint设置之前操作的最后一个点位置是是

方法 moveTo

例：

canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心(宽高数据在onSizeChanged中获取)
Path path = new Path();                     // 创建Path
path.lineTo(200, 200);                      // lineTo 从默认点0,0到 200，200
path.moveTo(200, 100);                      // moveTo 改变下一个点开始的位置
path.lineTo(200, 0);                        // 由于moveTo改变了开始位置，所以从200，100 到点 200,0
canvas.drawPath(path, mPaint);              // 绘制Path

这里写图片描述

moveTo只改变下次操作的起点，在执行完第一次LineTo的时候，本来的默认点位置是A(200,200),但是moveTo将其改变成为了C(200,100),所以在第二次调用lineTo的时候就是连接C(200,100) 到 B(200,0) 之间的直线

方法setLstPoint

例：

canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心(宽高数据在onSizeChanged中获取)
        Path path = new Path();                     // 创建Path
        path.lineTo(200, 200);                      // lineTo 从默认点0,0到 200，200
//        path.moveTo(200, 100);                      // moveTo 改变下一个点开始的位置
        path.setLastPoint(200,100);                 // setLastPoint 改变上一个点结束的位置
        path.lineTo(200, 0);                        // 由于moveTo改变了开始位置，所以从200，100 到点 200,0
        canvas.drawPath(path, mPaint);              // 绘制Path

效果：
这里写图片描述

在执行完第一次的lineTo的时候，最后一个点是A(200,200),而setLastPoint更改最后一个点为B(200,200)为(200,100),所以在实际执行的时候，第一次的lineTo就不是从原点O到A(200,200)的连线了，而变成了从原点O到C(200,100)之间的连线了。

方法 close

public void close()

用于连接当前最后一个点和最初的点（如果两个点不重合），形成一个闭合的图形

结果：
这里写图片描述

2. 第二组：addXxx 与 arcTo

第一类(基本形状)

// 圆形
public void addCircle (float x, float y, float radius, Path.Direction dir)
// 椭圆
public void addOval (RectF oval, Path.Direction dir)
// 矩形
public void addRect (float left, float top, float right, float bottom, Path.Direction dir)
public void addRect (RectF rect, Path.Direction dir)
// 圆角矩形
public void addRoundRect (RectF rect, float[] radii, Path.Direction dir)
public void addRoundRect (RectF rect, float rx, float ry, Path.Direction dir)

最后一个参数都是Path.Direction，意思是方向，绘制时点是你是逆时针还是顺时针，在添加图形时确定闭合顺序(各个点的记录顺序)

类型含义
CW顺时针
CCW逆时针

例子：画一个矩形，顺时针

canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心
Path path = new Path();
path.addRect(-200, -200, 200, 200, Path.Direction.CW);//顺时针
canvas.drawPath(path, mPaint);

结果：
这里写图片描述

其实顺时针和逆时针的表面结果是一样的，只是过程不同，是怎么画成的

第二类方法(Path)

// path
public void addPath (Path src)
public void addPath (Path src, float dx, float dy)
public void addPath (Path src, Matrix matrix)

第一个方法：将两个Path合并成为一个

第二个方法比第一个方法多出来的两个参数是将src进行了位移之后再添加进当前path中。

第三个方法是将src添加到当前path之前先使用Matrix进行变换。

例子：

       canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心
        canvas.scale(1,-1);                         // <-- 注意 翻转y坐标轴

        Path path = new Path();
        Path src = new Path();

        path.addRect(-200,-200,200,200, Path.Direction.CW);//绘制一个矩形
        src.addCircle(0,0,100, Path.Direction.CW);//坐标原点绘制一个圆形

        path.addPath(src,0,200);//将圆形添加到矩形的上 0,200的位置

        canvas.drawPath(path,mPaint);

结果：
这里写图片描述

第三类方法(addArc与arcTo)

// addArc
public void addArc (RectF oval, float startAngle, float sweepAngle)
// arcTo
public void arcTo (RectF oval, float startAngle, float sweepAngle)
public void arcTo (RectF oval, float startAngle, float sweepAngle, boolean forceMoveTo)

方法区别

名称作用区别
addArc添加一个圆弧到path直接添加一个圆弧到path中
arcTo添加一个圆弧到path添加一个圆弧到path,如果圆弧的起点和上次最后一个坐标点不相同，就连接两个点

参数含义

参数含义
oval圆弧的外切矩形
startAngle开始角度
sweepAngle扫过角度（-360 <= sweepAngle < 360）
forceMoveTo是否强制使用MoveTo

sweepAngle取值范围是 [-360, 360)，不包括360，当 >= 360 或者 < -360 时将不会绘制任何内容， 对于360，你可以用一个接近的值替代，例如: 359.99

foreMoveTo含义等价方法
true将最后一个点移动到圆弧起点，即不连接最后一个点与圆弧起点public void addArc (RectF oval, float startAngle, float sweepAngle)
false不移动，而是连接最后一个点与圆弧起点public void arcTo (RectF oval, float startAngle, float sweepAngle)

例子（addArc）：

canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心
canvas.scale(1,-1);                       // <-- 注意 翻转y坐标轴
Path path = new Path();
path.lineTo(100,100);                       //先画个线

RectF oval = new RectF(0,0,300,300);        //确定圆弧的外切矩形的位置

path.addArc(oval,0,270);                    //在已有的线的基础上添加圆弧
 // path.arcTo(oval,0,270,true);             // <-- 和上面一句作用等价

 canvas.drawPath(path,mPaint);

结果：
这里写图片描述

例子（arcTo）：

 canvas.translate(width / 2, height / 2);  // 移动坐标系到屏幕中心
 canvas.scale(1,-1);                         // <-- 注意 翻转y坐标轴

        Path path = new Path();
        path.lineTo(100,100);                       //先画个线

        RectF oval = new RectF(0,0,300,300);        //确定圆弧的外切矩形的位置

        path.arcTo(oval,0,270);                      //在已有的线的基础上添加圆弧,不移动，而是连接最后一个点与圆弧起点
        // path.arcTo(oval,0,270,false);             // <-- 和上面一句作用等价

        canvas.drawPath(path,mPaint);

结果：
这里写图片描述

3. isEmpty 、isRect、 isConvex、 set 、offset

方法： isEmpty

判断path中是否包含内容。

Path path = new Path();
Log.e("1",path.isEmpty()+"");

path.lineTo(100,100);
Log.e("2",path.isEmpty()+"");

结果：

com.sloop.canvas E/1: true
com.sloop.canvas E/2: false

方法：isRect

public boolean isRect (RectF rect)

判断path是否是一个矩形，如果是一个矩形的话，会将矩形的信息存放进参数rect中

path.lineTo(0,400);
path.lineTo(400,400);
path.lineTo(400,0);
path.lineTo(0,0);

RectF rect = new RectF();
boolean b = path.isRect(rect);
Log.e("Rect","isRect:"+b+"| left:"+rect.left+"| top:"+rect.top+"| right:"+rect.right+"| bottom:"+rect.bottom);

结果：

com.sloop.canvas E/Rect: isRect:true| left:0.0| top:0.0| right:400.0| bottom:400.0

方法：set

public void set (Path src)

将新的path赋值到现有path。

canvas.translate(mWidth / 2, mHeight / 2);  // 移动坐标系到屏幕中心
canvas.scale(1,-1);                         // <-- 注意 翻转y坐标轴

Path path = new Path();                     // path添加一个矩形
path.addRect(-200,-200,200,200, Path.Direction.CW);

Path src = new Path();                      // src添加一个圆
src.addCircle(0,0,100, Path.Direction.CW);

path.set(src);                              // 大致相当于 path = src;

canvas.drawPath(path,mPaint);

结果：
这里写图片描述

方法 offset

public void offset (float dx, float dy)
public void offset (float dx, float dy, Path dst)

对path进行一段平移，它和Canvas中的translate作用很像，但Canvas作用于整个画布，而path的offset只作用于当前path。

方法第最后的参数 Path dst 是存储平移后的path的

dst状态效果
dst不为null将当前path平移后的状态存入dst中，不会影响当前path
dat为空平移将作用于当前path，相当于第一种方法
// ＝＝＝＝＝＝ 方法 offset ＝＝＝＝＝＝＝＝
        canvas.translate(width/2 , height / 2);  // 移动坐标系到屏幕中心
        canvas.scale(1,-1);                         // <-- 注意 翻转y坐标轴

        Path path = new Path();                     // path中添加一个圆形(圆心在坐标原点)
        path.addCircle(0,0,100, Path.Direction.CW);

        Path dst = new Path();                      // dst中添加一个矩形
        dst.addRect(-200,-200,200,200, Path.Direction.CW);

        path.offset(250,0,dst);                     // 平移
        canvas.drawPath(path,mPaint);               // 绘制path
        mPaint.setColor(Color.BLUE);                // 更改画笔颜色
        canvas.drawPath(dst,mPaint);                // 绘制dst

结果：
平移之前：
这里写图片描述

平移后：
这里写图片描述

从运行效果图可以看出，虽然我们在dst中添加了一个矩形，但是并没有表现出来，所以，当dst中存在内容时，dst中原有的内容会被清空，而存放平移后的path。

hjiangshujing
关注
专栏目录
Android自定义控件进阶05-Path之基本操作
鸿蒙开发知识记录
08-11 438
Android自定义控件进阶05-Path之基本操作 在上一篇Canvas之图片文字中我们了解了如何使用Canvas中绘制图片文字，结合前几篇文章，Canvas的基本操作已经差不多完结了，然而Canvas不仅仅具有这些基本的操作，还可以更加炫酷，本次会了解到path(路径)这个Canvas中的神器，有了这个神器，就能创造出更多**炫(zhuang)酷(B)**的东东了。 一.Path常用方法表 为了兼容性(偷懒) 本表格中去除了部分API21(即安卓版本5.0)以上才添加的方法。 作用 相
Android自定义控件--ProgressButton
HardWorkingAnt的博客
05-18 1342
相信大家在手机某个游戏APP的游戏列表中，都能看到这样类似的控件：大家可以看到在这个界面的右侧下载的图标在点击后就会变成这样一个进度条的样子，下载完成后又会显示为打开，这样的ProgressButton是不是很有意思。我们这篇博客就讲一讲如何实现一个类似的控件，我们要完成的效果如下：在显示为三角形的时候，下载暂停或者还没开始，点击开始会做一个放大淡出的动画，之后正方形的图片会出现做一个放大淡入的动画
Android自定义控件系列--Path综述
代码小疯子
01-14 1153
Android自定义控件系列–Path综述Path 中文 释义为路径 然而它在自定义控件中却有着神一样的着色，这个神，是创造神奇效果的意思 1 Path 的创建Path path = new Path();2 Path绘制单纯的直线2-1 从默认开始//操作一 path.lineTo(100,100);//操作二 path.lineTo(200,400);canvas.drawPath(path,
2024-07-20 如何在Android系统里面的PATH变量增加一个路径，增加一个LD_LIBRARY_PATH变量？
最新发布
海月汐辰
07-20 213
一、adb 进入系统后 busybox vi /system/etc/init/hw/init.rc 在on init里面修改二、重新开机运行查看系统环境变量，发现PATH环境变量没有变化，应该是另外一个地方赋值了，分析一下没有找到，算了。
Android 自定义控件：Path
接受自己的普通，然后拼尽全力去与众不同
10-05 249
在 Canvas 的学习中，只能画一些比较规则的图形，如方形，圆，弧线等。如果要画一些比较复杂的图形，只要计算好坐标，就需用到 Path 类就能做到，以及著名的贝塞尔曲线也是用 Path 来实现。这里列举下 Path 常用的方法。 画笔等相关设置为： private void init() { mPaint = new Paint(); mPaint....
Android自定义控件之路径（Path）
lijianbiao0的博客
01-30 510
直线路径的使用： Path path = new Path(); path.moveTo(160, 10); //设定起始点 path.lineTo(10, 100);//第一条直线的终点，也是第二条直线的起点 path.lineTo(300, 100);//第二条直线的终点，也是第三条直线的起点 path.close();//闭环(连接起始点)。 弧线路径： public void arcTo...
Android自定义控件系列——Path类全解析
mLuoya的博客
02-24 4544
Path 构造方法 public Path(); public Path(Path src); 通用API set(Path src); //构造或者设置一个Path对象 moveTo(float x, float y); //路径绘制的起点，从点(x, y)开始进行绘制 lineTo(float x, float y); //直线的结束点，又是下一次绘制直线路径的开始点 rM...
自定义控件之-高仿Path水滴下拉刷新 Android
04-06
总的来说，学习和理解PathRefresh项目不仅可以提升我们对Android自定义控件的理解，还能帮助我们掌握自定义动画、触摸事件处理、布局设计等关键技术。通过对源码的深入研究，开发者可以进一步提高自己的Android开发...
自定义控件--LOL能力雷达分配图
05-19
在Android开发中，自定义控件是提升应用界面独特性和用户体验的重要手段。本文将深入探讨如何创建一个...通过学习和实践，开发者可以更好地理解和掌握Android自定义控件的机制，实现更多创新和个性化的界面设计。
Android自定义控件-彩色进度条
Sam_as_Angela的博客
04-15 1411
入门级自定义控件 彩色进度条
自定义控件详解（二）：Path类 相关用法
defukwanmcth26174的博客
04-01 135
Path：路径 绘制路径：void drawPath (Path path, Paint paint) Path 可以绘制的路径 一、直线路径 　　1、基本方法　　　　　　 　　　　　　void moveTo (float startX, float startY) 　　　　　　　　直线的开始点；即将直线路径的绘制点定在（startX,startY）的位置； 　　　...
path菜单控件封装
01-03
path菜单控件封装
Android自定义控件之二 使用path绘图
a1984446211的博客
09-02 449
在上一篇博客中。我们探索了onDraw方法。使用Ondraw方法在屏幕上画了三个圆。并且实现了与用户的交互。不了解得同学可以看这里：点击打开链接 接下来我们使用path进行绘图。一个path可能包含很多线，点，甚至图形 定义一个path public class SimpleDrawingView extends View { // ... private Path path = n
Android自定义控件进阶07-Path之完结篇
鸿蒙开发知识记录
08-11 406
经历过前两篇 Path之基本操作 和 Path之贝塞尔曲线 的讲解，本篇终于进入Path的收尾篇，本篇结束后Path的大部分相关方法都已经讲解完了，但Path还有一些更有意思的玩法，应该会在后续的文章中出现。 一.Path常用方法表 为了兼容性(偷懒) 本表格中去除了在API21(即安卓版本5.0)以上才添加的方法。忍不住吐槽一下，为啥看起来有些顺手就能写的重载方法要等到API21才添加上啊。宝宝此刻内心也是崩溃的。 作用 相关方法 备注 移动起点 moveTo 移动下一次操作的起
闲聊自定义控件之基础——Path
遗忘的星星
05-14 1683
Path在自定义控件里的使用频率也相当的高，使用Path不仅能绘制矩形、圆形等常规图形，还能绘制比较复杂的组合路径。 基本方法 点的相关操作 moveTo：移动到哪一点 lineTo：连接到哪一点 rMoveTo：移动到哪一点（参考点为当前点） rlineTo：连接到哪一点（参考点为当前点） setLastPoint：设置终点位置 close：连接开始的点和末尾的点，使路径闭合 ...
Android Path的使用详解
热门推荐
数据结构和算法
10-13 1万+
尊重原创，转载请标明出处    http://blog.csdn.net/abcdef314159 这里来分析一下Android自定义控件中比较常用的另一个类Path/** * The Path class encapsulates compound (multiple contour) geometric paths * consisting of straight line segmen
android path平移,安卓自定义View进阶：Path基本操作（下）
weixin_36239768的博客
05-30 637
(点击上方公众号，可快速关注)来源：伯乐在线专栏作者 -GcsSloop链接：http://android.jobbole.com/83384/接上文第二类(Path)方法预览：// 第二类(Path)// pathpublicvoidaddPath(Pathsrc)publicvoidaddPath(Pathsrc,floatdx,floatdy)publicvoidaddPath(Pathsr...
Android绘图进阶之Path详解
chuanao8829的博客
06-05 264
例如圆形，矩形，弧线等等，这些都是 Android 预置好的绘图方法，但是如果我们想要绘制一些复杂的图形怎么办呢？例如绘制一个三角形，N变形，非规则图形呢？好在 Android 给我们提供了Canvas的drawPath(Path path, Paint paint)方法，这个Path...
Android Canvas之Path的详解与使用（二）
09-21 2656
Path类封装复合（多轮廓）几何路径由直线段、二次曲线和三次曲线组成。它可以用画布绘制。drawPath（路径、绘制），填充或笔划（基于绘画的样式），或者可以用于剪裁或绘制路径上的文本。 Path属于路径，路径走多了就变成一种套路，只要我们会解套，那这种套路就是高速公路。路径走完形成闭环，最终形成一个图形。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值