上一篇介绍了[自定义view需要知道的基本函数](http://blog.csdn.net/wingichoy/article/details/50487009)。新开一篇献给借给我vpn的深圳_奋斗小哥。
转载请注明出处:http://blog.csdn.net/wingichoy/article/details/50492828
今天给大家介绍一个非常神奇的曲线,贝塞尔曲线。相信大家之前都有耳闻。
很久之前就久闻该线大名,但是一直不是很了解,在经过一番谷歌之后,有了初步的概念:三点确定一条曲线:起点,终点,辅助点。
三个点的基本关系如下:
![](https://box.kancloud.cn/2016-03-21_56efaea473a05.jpg)
当初看这图我也看了老半天,只知道是非常平滑,不知道三个点的具体关系,于是变写了一段程序来测试辅助点与始终点的关系。
Android 的Path类提供了绘制二阶贝塞尔曲线的方法,使用方法如下:
~~~
//设置起点
path.moveTo(200,200);
//设置辅助点坐标 300,200 终点坐标400,200
path.quadTo(300, 200, 400, 200);
~~~
这里我将贝塞尔曲线的辅助点y轴和起始点设置相同,draw以后效果如下:
![](https://box.kancloud.cn/2016-03-21_56efaea49b770.jpg)
看到是一条直线,这是因为他y轴没有拉伸,只是x轴进行了拉伸。把辅助点y+100尝试
![](https://box.kancloud.cn/2016-03-21_56efaea4ad267.jpg)
看到已经拉伸。。其实这样还是不能很好的体现 贝塞尔曲线的规律。 所以要持续改变,研究他的规律,这里重写onTouchEvent,让触摸点的位置作为辅助点。观察变化。
~~~
@Override
protected void onDraw(Canvas canvas) {
Paint p = new Paint();
p.setStyle(Paint.Style.STROKE);
p.setStrokeWidth(10);
Path path = new Path();
path.moveTo(200, 200);
path.quadTo(mSupX, mSupY, 400, 200);
canvas.drawPath(path,p);
super.onDraw(canvas);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()){
case MotionEvent.ACTION_MOVE:
mSupX = event.getX();
mSupY = event.getY();
invalidate();
}
return true;
}
~~~
![](https://box.kancloud.cn/2016-03-21_56efaea4bf762.jpg)
可以看到 是根据鼠标位置变化的曲线,可是现在还是不能很好的表现曲线的突出点和辅助点关系,接下来把辅助点也画出来,方便观察。
~~~
canvas.drawPoint(mSupX,mSupY,p);
~~~
![](https://box.kancloud.cn/2016-03-21_56efaea4d97ef.jpg)
这下,辅助点和曲线的关系就很明显了。
许多炫酷的效果都离不开贝塞尔曲线,贝塞尔曲线的应用:[仿360内存清理效果](http://blog.csdn.net/wingichoy/article/details/50500479)。
- 前言
- android自定义viewgroup初步之一----抽屉菜单
- Android 自定义view --圆形百分比(进度条)
- Android 自定义View -- 简约的折线图
- 新手自定义view练习实例之(一) 泡泡弹窗
- 新手自定义view练习实例之(二) 波浪view
- 手把手带你画一个 时尚仪表盘 Android 自定义View
- 手把手带你画一个动态错误提示 Android自定义view
- 手把手带你做一个超炫酷loading成功动画view Android自定义view
- 关于Android自定义view 你所需要知道的基本函数
- Android自定义view进阶-- 神奇的贝塞尔曲线
- wing带你玩转自定义view系列(1) 仿360内存清理效果
- wing带你玩转自定义view系列(2) 简单模仿qq未读消息去除效果
- wing带你玩转自定义view系列(3)模仿微信下拉眼睛
- 手把手教你画一个 逼格满满圆形水波纹loadingview Android
- 有坑?? 为何wing坠入PorterDuffXferMode的万丈深渊(PorterDuffXferMode深入试验)
- 手把手带你画一个漂亮蜂窝view Android自定义view
- 一个炫字都不够??!!!手把手带你打造3D自定义view
- 恭喜发财! -- 手把手教你仿造一个qq下拉抢红包 Android自定义view