1、贝塞尔曲线:http://baike.baidu.com/view/60154.htm,在这里理解什么是贝塞尔曲线
2、直接上图:
3、100多行代码就可以画出贝塞尔曲线,直接上代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
package
com.example.bezier;
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import
android.graphics.Paint;
import
android.graphics.Paint.Style;
import
android.graphics.Path;
import
android.os.Bundle;
import
android.view.View;
import
android.view.Window;
import
android.view.WindowManager;
public
class MainActivity extends
Activity {
@Override
public
void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView( new
BezierView( this ));
}
} class
BezierView extends
View {
/**
*
* @author liqiongwei
* @param context
*
*/
public
BezierView(Context context) {
super (context);
}
protected
void onDraw(Canvas canvas) {
List<Float> points = new
ArrayList<Float>();
Paint paint = new
Paint();
// 添加第一个点(118.0, 294.0),
points.add(( float ) 118.0 ); // X轴
points.add(( float ) 294.0 ); // Y轴
// 添加第二个点
points.add(( float ) 206.0 );
points.add(( float ) 294.0 );
// 添加第三个点
points.add(( float ) 294.0 );
points.add(( float ) 118.0 );
// 添加第四个点
points.add(( float ) 382.0 );
points.add(( float ) 206.0 );
points.add(( float ) 470.0 );
points.add(( float ) 118.0 );
// 通过画折线和贝塞尔曲线可以知道,点得位置是不一样的。
// 画折线
for
( int i = 0 ; i < points.size() - 2 ; i = i + 2 ) {
canvas.drawLine(points.get(i), points.get(i + 1 ), points.get(i + 2 ), points.get(i + 3 ), paint);
canvas.drawCircle(points.get(i), points.get(i + 1 ), 3 , paint);
}
canvas.drawCircle(points.get(points.size() - 2 ), points.get(points.size() - 1 ), 3 , paint);
// 贝塞尔曲线
paint.setColor(Color.BLUE);
Path p = new
Path();
Point p1 = new
Point();
Point p2 = new
Point();
Point p3 = new
Point();
float
xp = points.get( 0 );
float
yp = points.get( 1 );
// 设置第一个点开始
p.moveTo(xp, yp);
canvas.drawCircle(xp, yp, 5 , paint);
int
length = points.size();
// 设置第一个控制点33%的距离
float
mFirstMultiplier = 0 .3f;
// 设置第二个控制点为66%的距离
float
mSecondMultiplier = 1
- mFirstMultiplier;
for
( int b = 0 ; b < length; b += 2 ) {
int
nextIndex = b + 2
< length ? b + 2
: b;
int
nextNextIndex = b + 4
< length ? b + 4
: nextIndex;
// 设置第一个控制点
calc(points, p1, b, nextIndex, mSecondMultiplier);
// 设置第二个控制点
p2.setX(points.get(nextIndex));
p2.setY(points.get(nextIndex + 1 ));
// 设置第二个控制点
calc(points, p3, nextIndex, nextNextIndex, mFirstMultiplier);
// 最后一个点就是赛贝尔曲线上的点
p.cubicTo(p1.getX(), p1.getY(), p2.getX(), p2.getY(), p3.getX(), p3.getY());
// 画点
canvas.drawCircle(p3.getX(), p3.getY(), 5 , paint);
}
// 设置为线
paint.setStyle(Style.STROKE);
canvas.drawPath(p, paint);
invalidate();
}
/**
* 计算控制点,此方法来源于Achartengine
* @param points
* @param result
* @param index1
* @param index2
* @param multiplier
*/
private
void calc(List<Float> points, Point result, int
index1, int
index2, final
float multiplier) {
float
p1x = points.get(index1);
float
p1y = points.get(index1 + 1 );
float
p2x = points.get(index2);
float
p2y = points.get(index2 + 1 );
float
diffX = p2x - p1x;
float
diffY = p2y - p1y;
result.setX(p1x + (diffX * multiplier));
result.setY(p1y + (diffY * multiplier));
}
} |
4、定义点的类
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
package
com.example.bezier;
import java.io.Serializable;
/** * 点的类,来源于Achartengine
*/
public final class Point implements
Serializable {
private
float mX;
private
float mY;
public
Point() {
}
public
Point( float
x, float
y) {
mX = x;
mY = y;
}
public
float getX() {
return
mX;
}
public
float getY() {
return
mY;
}
public
void setX( float
x) {
mX = x;
}
public
void setY( float
y) {
mY = y;
}
} |
5、下载地址:http://files.cnblogs.com/liqw/Bezier.zip
本文来源于:http://www.cnblogs.com/liqw/p/3631137.html
有问题,请提问,大家一起研究!