泰然

 找回密码
 注册泰然

[ityran翻译]OpenGL ES for iPhone: Drawing a Circle - Part II

2011-9-12 18:18| 发布者: u0u0| 查看: 4681| 评论: 5|原作者: Jan Vantomme|来自: http://vormplus.be/

摘要: OpenGL ES for iPhone:画圆 第二节

原文地址:http://vormplus.be/blog/article/opengl-es-for-iphone-drawing-a-circle-part-ii


上一篇中,我们学习了怎么在iPhone上绘制一个圆,在这一篇中,我们将学习怎么样绘制一个更好的圆。

添加随机颜色

在实际使用中经常使用随机颜色,在iPhone上可以很容易的实现这个功能。我们可以把圆周分成360等份,在绘制圆时我们要把每一等分都分配一种随机颜色。每个随机颜色的值由4部分组成,分别是redgreenbluealpha,所以我们需要一个数组来存储圆的每一等份的4个值。下面的代码创建了一个GLfloat类型的数组,用来存放0.0~1.0之间的随机RGB值和固定为1.0不变的Alpha值。

 

// create empty array to store color values

GLfloat colors[1440];

// fill array with color values

for (int i = 0; i < 1440; i += 4) {

    // red value

    colors[i]   = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    // blue value

    colors[i+1] = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    // green value

    colors[i+2] = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    // alpha value

    colors[i+3] = 1.0;

}

 

如果要随机颜色来绘制圆的话,需要将原来的glColor4f()方法用glColorPointer()方法来替换。代码如下:

 

glColorPointer(4, GL_FLOAT, 0, colors);

glEnableClientState(GL_COLOR_ARRAY);

 

运行程序后,你将会看到如下所示的起点在右边的很奇怪的一副图:


如何绘制的起点在中间,使所有三角都一样大小,相信会好看得多。

画一个更好的圆

画一个更漂亮的圆其实是很容易的。你指需要将x=0.0y=0.0的地方设置为起点,那么所有的有绘制区域就都是从圆心到圆周了。我们发现,改变绘制方式以后数组的长度只有722了。

上一节教程的程序的这里有一个小小的bug,在这里你需要将等份的计算方法改为DEGREES_TO_RADIANS(i/2)来获得0~360之间的相位值。改变后的代码如下:

 

// create an array with a size of 722

GLfloat vertices[722];

// add 2 vertices at 0.0 (x and y for the first point)

vertices[0] = 0.0;

vertices[1] = 0.0;

// fill the rest of the array with x and y values

// on the perimeter of the circle.

for (int i = 0; i < 720; i += 2) {

    vertices[i+2] = (cos(DEGREES_TO_RADIANS(i/2)) * 1);

    vertices[i+3] = (sin(DEGREES_TO_RADIANS(i/2)) * 1);

}

// 2 vertices to close the circle so it looks perfect

vertices[719] = 0.0;

vertices[720] = 1.0;

You’ll also need to add one extra color to the colors array. Change the colors code to this:

GLfloat colors[1444];

for (int i = 0; i < 1444; i += 4) {

    colors[i]   = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    colors[i+1] = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    colors[i+2] = RANDOM_FLOAT_BETWEEN(0.0, 1.0);

    colors[i+3] = 1.0;

}

最后的一点小更改是为了告诉OpenGL要绘制361等份,不是360等份。

glDrawArrays(GL_TRIANGLE_FAN, 0, 361);

运行程序,一个漂亮的圆将会展现在你的眼前。


Downloads

你可以在这里下载教程的工程文档:openglcircle2.zip

partIII,我将会告诉你们怎样优化代码让程序运行的更加的流畅。

 

翻译:yuezang (ityran.com)

校对:u0u0 (ityran.com)

 

licensed under  Creative Commons license
2

鲜花

握手

雷人

路过

鸡蛋

刚表态过的朋友 (2 人)

发表评论

最新评论

引用 coolbabylch 2012-11-14 17:01
好东西,学习了
引用 yuiopnessiah 2012-2-20 16:23
好东西,学习了
引用 cl890305 2012-2-3 09:25
每天来学习
引用 panzhiccp 2011-12-28 10:40
我顶顶顶
引用 chichi1314 2011-12-28 04:13
学习

查看全部评论(5)

手机版|小黑屋|Archiver| 泰然论坛 ( 蜀ICP备13018980号-2 )

GMT+8, 2017-6-24 13:07 , Processed in 0.017150 second(s), 13 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

返回顶部