一起学opengl android 贝赛尔曲线

贝塞尔曲线

弄了个贝赛尔曲线，更加坚定了我的美感不行，形容贝塞尔曲线都说的是曲线之美，咋我画出来就那么蛋疼呢。

在这里我用了一个动画来显示贝塞尔曲线，但是没有做循环显示，有兴趣的自己试罗。

public class Utils {

	public  static IntBuffer getIntBuffByArray(int[] temp){
		ByteBuffer vbb = ByteBuffer.allocateDirect(temp.length * 4);
		vbb.order(ByteOrder.nativeOrder());
		IntBuffer mVerBuffer = vbb.asIntBuffer();
		mVerBuffer.put(temp);
		mVerBuffer.position(0);
		return mVerBuffer;
	}
	
	public static FloatBuffer getFloatBuffByArray(float[] temp){
		ByteBuffer vbb = ByteBuffer.allocateDirect(temp.length * 4);
		vbb.order(ByteOrder.nativeOrder());
		FloatBuffer mVerBuffer = vbb.asFloatBuffer();
		mVerBuffer.put(temp);
		mVerBuffer.position(0);
		return mVerBuffer;
	}
	
	public  static ByteBuffer getByteBuffByArray(byte[] temp){
		ByteBuffer vbb = ByteBuffer.allocateDirect(temp.length);
//		vbb.order(ByteOrder.nativeOrder());
//		IntBuffer mVerBuffer = vbb.asIntBuffer();
		vbb.put(temp);
		vbb.position(0);
		return vbb;
	}
}

因为用这个平台字节转换的比较多，所以直接放在一个帮助类里面了，这个就没啥好说的

主要是public class Bezier extends GLSurfaceView implements Renderer这个类，我是绘制的三次贝赛尔曲线公式，其对应公式如下，具体推导那就各自找自己高中老师去了，反正我是看了半天才摸索清楚的
x(t) = (1-t)^3x0 + 3t(1-t)^2x1 + 3t^2(1-t)x2 + t^3x3
y(t) = (1-t)^3y0 + 3t(1-t)^2y1 + 3t^2(1-t)y2 + t^3y3

在这里既然用到了立方和乘我就直接定义了

//向量相加
		private Point Add(Point temp, Point temp1){
			Point mPointNew = new Point();
			mPointNew.x = temp.x + temp1.x;
			mPointNew.y = temp.y + temp1.y;
			return mPointNew;
		}
		
		//向量相乘
		private Point Multiply(float temp,float temp1, float var){
			Point mPointNew = new Point();
			mPointNew.x = temp * var;
			mPointNew.y = temp1 * var;
			return mPointNew;
		}

专门用来运算。然后就是套路的onSurface...onDrawFrame就不说了。

主要就是实现了一下上面的公式，具体如下

a[0] = Multiply(bezierArray[0],bezierArray[1],(float)Math.pow((1-interpolation), 3));
			a[1] = Multiply(bezierArray[2],bezierArray[3],(float)Math.pow((1-interpolation), 2) * 3 * interpolation);
			a[2] = Multiply(bezierArray[4],bezierArray[5],(float)Math.pow(interpolation, 2) * 3 * (1-interpolation));
			a[3] = Multiply(bezierArray[6],bezierArray[7],(float)Math.pow(interpolation, 3));
			
			mPointNew[2*i] = Add(Add(a[0],a[1]),Add(a[2],a[3])).x;
			mPointNew[2*i+1] = Add(Add(a[0],a[1]),Add(a[2],a[3])).y;
			
			mVertextBuff = Utils.getFloatBuffByArray(mPointNew);
			gl.glVertexPointer(2, GL10.GL_FLOAT, 0, mVertextBuff);
			gl.glLineWidth(5.0f);
			gl.glDrawArrays(GL10.GL_LINE_STRIP ,0, i+1);

其实主要的就这些了，我主要是看了网上讲贝塞尔曲线的那个gif动画挺好看的，所以我就依葫芦画瓢的把过渡的几条线也绘制上去了

//过渡用的两条线
			gl.glColor4x(0, 1, 1, 1);
			a[0] = Add(Multiply(bezierArray[0],bezierArray[1],1-interpolation),Multiply(bezierArray[2],bezierArray[3],interpolation));
			mTransition[0] = a[0].x;
			mTransition[1] = a[0].y;
			a[0] = Add(Multiply(bezierArray[2],bezierArray[3],1-interpolation),Multiply(bezierArray[4],bezierArray[5],interpolation));
			mTransition[2] = a[0].x;
			mTransition[3] = a[0].y;
			a[0] = Add(Multiply(bezierArray[4],bezierArray[5],1-interpolation),Multiply(bezierArray[6],bezierArray[7],interpolation));
			mTransition[4] = a[0].x;
			mTransition[5] = a[0].y;
			gl.glVertexPointer(2, GL10.GL_FLOAT, 0, Utils.getFloatBuffByArray(mTransition));
			gl.glLineWidth(3.0f);
			gl.glDrawArrays(GL10.GL_LINE_STRIP ,0, 3);
			
			//实际取的是该线上的点
			gl.glColor4x(0, 1, 1, 1);
			a[0] = Add(Multiply(mTransition[0],mTransition[1],1-interpolation),Multiply(mTransition[2],mTransition[3],interpolation));
			a[1] = Add(Multiply(mTransition[2],mTransition[3],1-interpolation),Multiply(mTransition[4],mTransition[5],interpolation));
			gl.glVertexPointer(2, GL10.GL_FLOAT, 0, Utils.getFloatBuffByArray(new float []{
					a[0].x,a[0].y,
					a[1].x,a[1].y
			}));
			gl.glLineWidth(2.0f);
			gl.glDrawArrays(GL10.GL_LINES ,0, 2);

具体看代码吧

源码地址http://download.csdn.net/detail/lishubing1126/3824354

http://blog.csdn.net/lishubing1126/article/details/6998638