博客也开了挺长时间了,一直都没有来写博客,主要原因是自己懒~~~此篇博客算是给2017年一个好的开始,同时也给2016年画上一个句点,不留遗憾。

那就让我们正式进入今天的主题:贝塞尔曲线。

首先,让我们来了解下什么是贝塞尔曲线。

贝塞尔曲线(Bézier curve),又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线。贝塞尔曲线于1962,由法国工程师皮埃尔·贝塞尔(Pierre Bézier)所广泛发表,他运用贝塞尔曲线来为汽车的主体进行设计。贝塞尔曲线最初由Paul de Casteljau于1959年运用de Casteljau演算法开发,以稳定数值的方法求出贝兹曲线。

  

了解了什么是贝塞尔曲线,接下来我们来看看贝塞尔曲线的分类。再讲分类之前,首先要提到的两个概念:数据点和控制点。

数据点:曲线的起始点和终点。

控制点:顾名思义,就是控制曲线的弯曲程度的点。

曲线主要有以下分类:

一阶曲线:

  公式:

  动态图:

  原理:从P0(起始点)到P1(终点)之间连续的点组成的一条直线。一阶曲线是没有控制点的。

二阶曲线:

  公式:

  静态图:

  动态图:

  原理:点Q0(t)的变化从P0到P1,描述一个线性Bézier曲线。

      点Q1(t)的变化从P1到P2,描述了一个线性Bézier曲线。

      B点(t)的变化从Q0(t)到Q1(t),描述了一个二次Bézier曲线。

      P0为起始点,P2为终点,P1为控制点。

三阶曲线: 

  公式: 

  静态图:  

  动态图:

  原理:其原理和二阶曲线的原理类似,主要是多了个控制点。

除了以上三种贝塞尔曲线的分类,当然还有四阶曲线、五阶曲线...........

说了这么多了,那我们到底该如何使用贝塞尔曲线呢,有没有方法提供给我们呢?

当然有提供给我们的,在我们自定义View的时候,会用到一个叫Path的类,在这个类中,存在两个方法:quadTo(绘制二阶曲线), cubicTo(绘制三阶曲线)。这两个方法我会简单的用两段代码来说明下。这里我会贴出主要的代码:

二阶曲线主要代码块:

@Override
protected void onDraw(Canvas canvas) {
//画直线
mPaint.setColor(Color.BLACK);
mPaint.setStrokeWidth(4);
canvas.drawLine(firstPoint.x,firstPoint.y,midPoint.x,midPoint.y,mPaint);
canvas.drawLine(lastPoint.x,lastPoint.y,midPoint.x,midPoint.y,mPaint);
//画点
mPaint.setStrokeWidth(20);
canvas.drawPoint(firstPoint.x,firstPoint.y,mPaint);
canvas.drawPoint(lastPoint.x,lastPoint.y,mPaint);
canvas.drawPoint(midPoint.x,midPoint.y,mPaint);
//画二阶曲线
mPaint.setColor(Color.BLUE);
mPaint.setStrokeWidth(8);
Path path = new Path();
path.moveTo(firstPoint.x,firstPoint.y);
path.quadTo(midPoint.x,midPoint.y,lastPoint.x,lastPoint.y);
canvas.drawPath(path,mPaint);
}

效果图:(ps:不会在手机上弄动态图)

三阶曲线主要代码块:

@Override
protected void onDraw(Canvas canvas) {
mPaint.setColor(Color.BLACK);
//画直线
mPaint.setStrokeWidth(4);
canvas.drawLine(firstPoint.x,firstPoint.y,control1.x,control1.y,mPaint);
canvas.drawLine(midPoint1.x,midPoint1.y,midPoint2.x,midPoint2.y,mPaint);
canvas.drawLine(midPoint2.x,midPoint2.y,lastPoint.x,lastPoint.y,mPaint);
//画点
mPaint.setStrokeWidth(20);
canvas.drawPoint(firstPoint.x,firstPoint.y,mPaint);
canvas.drawPoint(lastPoint.x,lastPoint.y,mPaint);
canvas.drawPoint(midPoint1.x,midPoint1.y,mPaint);
canvas.drawPoint(midPoint2.x,midPoint2.y,mPaint);
//画三阶曲线
mPaint.setColor(Color.BLUE);
mPaint.setStrokeWidth(8);
Path path = new Path();
path.moveTo(firstPoint.x,firstPoint.y);
path.cubicTo(midPoint1.x,midPoint1.y,midPoint2.x,midPoint2.y,
lastPoint.x,lastPoint.y);
canvas.drawPath(path,mPaint);
}

效果图:(ps:还是不会在手机上弄动态图)  

好了,至此,贝塞尔曲线的浅析已经讲完了,如还想更多去了解贝塞尔曲线,可以看看这个网站:

https://en.wikipedia.org/wiki/B%C3%A9zier_curve

由于第一次写博客,有些地方表达的不是很好,还请谅解。如有好的建议和不足之处还望指出,一定虚心更改。

Android 贝塞尔曲线的浅析的更多相关文章

  1. Android 贝塞尔曲线 折线图

    1.贝塞尔曲线:http://baike.baidu.com/view/60154.htm,在这里理解什么是贝塞尔曲线 2.直接上图: 3.100多行代码就可以画出贝塞尔曲线,直接上代码 packag ...

  2. Android -- 贝塞尔曲线公式的推导

    1,最近看了几个不错的自定义view,发现里面都会涉及到贝塞尔曲线知识,深刻的了解到贝塞尔曲线是进阶自定义view的一座大山,so,今天先和大家来了解了解. 2,贝塞尔曲线作用十分广泛,简单举几个的栗 ...

  3. Android -- 贝塞尔曲线公式的推导和简单使用

    1,最近看了几个不错的自定义view,发现里面都会涉及到贝塞尔曲线知识,深刻的了解到贝塞尔曲线是进阶自定义view的一座大山,so,今天先和大家来了解了解. 2,贝塞尔曲线作用十分广泛,简单举几个的栗 ...

  4. Android 贝塞尔曲线解析

    相信很多同学都知道"贝塞尔曲线"这个词,我们在很多地方都能经常看到.利用"贝塞尔曲线"可以做出很多好看的UI效果,本篇博客就让我们一起学习"贝塞尔曲线 ...

  5. Android 贝塞尔曲线库

    最近做的一个小项目需要绘制一些折线图,AChartEngine其实里面包含很多图,虽然是开源的,但毕竟不是自己写的,而且项目稍有点庞大,有些东西修改起来还是得花点时间的,所以最后打算自己写一个,参考了 ...

  6. Android 贝塞尔曲线

    博客图片备份位置:

  7. Android贝塞尔曲线应用-跳动的水滴

    主要通过6个控制点实现. val startPoint = PointF() val endPoint = PointF() val control1 = PointF() val control2 ...

  8. Android中贝塞尔曲线的绘制方法

    贝塞尔曲线,很多人可能不太了解,什么叫做贝塞尔曲线呢?这里先做一下简单介绍:贝塞尔曲线也可以叫做贝济埃曲线或者贝兹曲线,它由线段与节点组成,节点是可拖动的支点,线段像可伸缩的皮筋.一般的矢量图形软件常 ...

  9. android 利用Path.cubicTo 画 贝塞尔曲线

    Path.cubicTo void android.graphics.Path.cubicTo(float x1, float y1, float x2, float y2, float x3, fl ...

随机推荐

  1. lwip 分析一

    一.接收端 1.通过ehternetif_input void ethernetif_input(struct netif *netif) {   struct ethernetif *etherne ...

  2. Spring入门第七课

    Bean之间的关系:继承和依赖. 继承Bean配置 Spring允许继承bean的配置,被继承的bean称为父bean,继承这个父bean的Bean称为子Bean. 子Bean从父Bean中继承配置, ...

  3. 二十五种网页加速方法和seo优化技巧

    一.使用良好的结构 可扩展 HTML (XHTML) 具有许多优势,但是其缺点也很明显.XHTML 可能使您的页面更加符合标准,但是它大量使用标记(强制性的 <start> 和 <e ...

  4. SqlServer2012——多表连接查询

    1.基本连接 select A.姓名,A.性别,B.班级名,B.家庭住址 From 学生信息 A,班级信息 B where A.所属班级=B.班级编号 --把A表与B表连接起来 2.内连接 --内连接 ...

  5. HighChar

    chart: { type:'bar', borderWidth:2, borderColor: '#CA5100', backgroundColor: '#90ED7D', shadow: { // ...

  6. TSubclassOf的一些说明

    注:补充下SpawnActor的用法 TSubclassOf<AActor> TS = LoadClass<AActor>(NULL, TEXT("Blueprint ...

  7. codeforces590E Birthday【AC自动机+Floyd+匈牙利算法】

    因为没有重复串,所以把有包含关系的串连边之后是个DAG,也就是二分图,就变成求二分图的最大独立集=n-最小点覆盖=n-最大匹配 关于包含关系,建出AC自动机,然后把串放上去找子串,但是如果每次都一路找 ...

  8. 一文搞定 Redis 复制(全会的举个手看看)

    阅读本文大概需要 5 分钟. 本文大纲 复制过程 数据间的同步 全量复制 部分复制 心跳 异步复制 总结 一.复制过程 Step 1:从节点执行 slaveof 命令. Step 2:从节点只是保存了 ...

  9. pytest框架(五)

    代码示例一 # coding=utf-8 import pytest @pytest.fixture() def login(): print("输入账号,密码先登录") def ...

  10. PJzhang:子域名爆破工具wydomain(猪猪侠)

    猫宁!!! 参考链接:https://www.secpulse.com/archives/53182.html https://www.jianshu.com/p/65c85f4b7698 http: ...