[转载]OpenGL ES for iPhone: Drawing a Circle - Part II

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

 

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

添加随机颜色

在实际使用中经常使用随机颜色,在iPhone上可以很容易的实现这个功能。我们可以把圆周分成360等份,在绘制圆时我们要把每一等分都分配一种随机颜色。每个随机颜色的值由4部分组成,分别是red、green、blue和alpha,所以我们需要一个数组来存储圆的每一等份的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.0和y=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

转载于:https://www.cnblogs.com/PursuitOnly/archive/2013/02/07/2908895.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
将 `osgViewer::Viewer` 嵌入到 `QOpenGLWidget` 中,可以通过以下步骤实现: 1. 继承 `QOpenGLWidget` 类,并实现以下虚函数: ```cpp class OsgWidget : public QOpenGLWidget, protected QOpenGLFunctions { public: OsgWidget(QWidget* parent = nullptr); virtual ~OsgWidget(); protected: void initializeGL() override; void resizeGL(int w, int h) override; void paintGL() override; void paintEvent(QPaintEvent* event) override; void keyPressEvent(QKeyEvent* event) override; void keyReleaseEvent(QKeyEvent* event) override; void mousePressEvent(QMouseEvent* event) override; void mouseReleaseEvent(QMouseEvent* event) override; void mouseMoveEvent(QMouseEvent* event) override; bool event(QEvent* event) override; }; ``` 其中,`initializeGL`、`resizeGL` 和 `paintGL` 函数用于初始化 OpenGL 上下文并绘制场景,`paintEvent` 函数用于处理重绘事件,`keyPressEvent`、`keyReleaseEvent`、`mousePressEvent`、`mouseReleaseEvent` 和 `mouseMoveEvent` 函数用于处理键盘和鼠标事件,`event` 函数用于处理其他事件。 2. 在 `initializeGL` 函数中创建 `osgViewer::GraphicsWindow` 对象,并将其关联到 `osgViewer::Viewer` 对象中: ```cpp void OsgWidget::initializeGL() { // Create an OSG graphics context osg::ref_ptr<osg::GraphicsContext::Traits> traits = new osg::GraphicsContext::Traits; traits->windowName = "OSG Widget"; traits->x = 0; traits->y = 0; traits->width = width(); traits->height = height(); traits->doubleBuffer = true; traits->windowDecoration = false; traits->sharedContext = 0; // Create an OSG graphics window osg::ref_ptr<osgViewer::GraphicsWindow> gw = osg::GraphicsContext::createGraphicsWindow(traits.get()); // Create an OSG viewer osg::ref_ptr<osgViewer::Viewer> viewer = new osgViewer::Viewer; viewer->getCamera()->setGraphicsContext(gw); viewer->getCamera()->setViewport(new osg::Viewport(0, 0, traits->width, traits->height)); // Set the viewer's scene data osg::ref_ptr<osg::Node> scene = createSceneGraph(); viewer->setSceneData(scene.get()); // Save the viewer pointer for later use m_viewer = viewer; } ``` 其中,`createSceneGraph` 函数用于创建 OSG 场景图。 3. 在 `paintGL` 函数中将 `osgViewer::Viewer` 的帧缓冲区绑定到 `QOpenGLWidget` 的帧缓冲区,并使用 `osgViewer::Viewer::frame` 函数绘制一帧: ```cpp void OsgWidget::paintGL() { // Bind OSG's frame buffer object to the OpenGL context m_viewer->getCamera()->getGraphicsContext()->realizeOpenGLContext(); m_viewer->getCamera()->getGraphicsContext()->makeCurrent(); m_viewer->getCamera()->getGraphicsContext()->bindPBufferToTexture(); // Draw a frame m_viewer->frame(); // Swap the buffers m_viewer->getCamera()->getGraphicsContext()->swapBuffers(); } ``` 4. 在 `resizeGL` 函数中更新 `osgViewer::Viewer` 的视口: ```cpp void OsgWidget::resizeGL(int w, int h) { // Update OSG's viewport m_viewer->getCamera()->setViewport(new osg::Viewport(0, 0, w, h)); } ``` 5. 在 `paintEvent` 函数中强制刷新 `QOpenGLWidget`: ```cpp void OsgWidget::paintEvent(QPaintEvent* event) { // Force redraw update(); } ``` 6. 将 `OsgWidget` 添加到 `QMainWindow` 中: ```cpp int main(int argc, char** argv) { QApplication app(argc, argv); QMainWindow mainWindow; // Create an OSG widget OsgWidget* osgWidget = new OsgWidget(&mainWindow); // Add the OSG widget to the main window mainWindow.setCentralWidget(osgWidget); mainWindow.show(); return app.exec(); } ``` 通过以上步骤,就可以将 `osgViewer::Viewer` 嵌入到 `QOpenGLWidget` 中,并在 Qt 应用程序中显示 OSG 场景图了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值