《OpenGL ES应用开发实践指南:Android卷》—— 3.5 在屏幕上绘制

简介:

本节书摘来自华章出版社《OpenGL ES应用开发实践指南:Android卷》一 书中的第3章,第3.5节,作者:(美)Kevin Brothaler ,更多章节内容可以访问云栖社区“华章计算机”公众号查看。

3.5 在屏幕上绘制

随着完成这些最后的连接,我们现在就准备好开始在屏幕上绘制了!我们将先画桌子,然后画分隔线和木槌。
3.5.1 绘制桌子
在onDrawFrame()结尾处,让我们在glClear()调用之后加入如下代码:
screenshot

我们首先通过调用glUniform4f()更新着色器代码中的u_Color的值。与属性不同,uniform的分量没有默认值,因此,如果一个uniform在着色器中被定义为vec4类型,我们需要提供所有四个分量的值。我们想要以画一张白桌子作为开始,因此,我们把红色、绿色和蓝色的值设置为代表完全亮度的值1.0f;阿尔法的值无关紧要,但是我们还是要指定它,因为一个颜色有四个分量。
一旦指定了颜色,接下来就可以用glDrawArrays(GLES20.GL_TRIANGLES, 0, 6)绘制桌子了;第一个参数告诉OpenGL,我们想要画三角形。而要画三角形,我们需要给每个三角形传递进去至少三个顶点;第二个参数告诉OpenGL从顶点数组的开头处开始读顶点;而第三个参数是告诉OpenGL读入六个顶点。因为每个三角形有三个顶点,这个调用最终会画出两个三角形。
让我们快速看一下本章起始处定义的顶点数组:
screenshot
screenshot

当我们调用glVertexAttribPointer()方法的时候,记得我们曾告诉OpenGL每个顶点的位置包含两个浮点数分量。glDrawArrays()调用让OpenGL使用前六个顶点绘制三角形,因此,OpenGL会使用下面这些位置绘制它们:
screenshot

第一个被绘制的三角形由点(0, 0)、(9, 14)和(0, 14)围成,而第二个由点(0, 0)、(9, 0)及(9, 14)围成。

3.5.2 绘制分隔线

下一步是绘制跨越桌子中间的中心分隔线。
在onDrawFrame()方法的结尾处加入如下代码:
screenshot

通过传递1.0f给第一个分量(红色)及传递0.0f给绿色和蓝色,我们把颜色设为红色;但这次需要OpenGL画线;我们从六个顶点后的第一个顶点开始读入两个顶点,OpenGL就可以画出线了。正如Java数组一样,这里使用基于0的编号规则:0、1、2、3、4、5、6,数字6就是六个顶点后的第一个顶点,或者是第七个顶点。因为每条线有两个顶点,最终用这些位置可以画出一条线:
screenshot

OpenGL会从(0, 7)到(9, 7)画一条线。

3.5.3 把木槌绘制为点

最后要做的就是画两个木槌;在onDrawFrame()结尾处加入如下代码:
screenshot

通过传递GL_POINTS给glDrawArrays()方法,我们让OpenGL绘制点。对于第一个木槌,我们设置其颜色为蓝色,从偏移位置8开始,并用一个顶点绘制一个点;对于第二个木槌,我们设置其颜色为红色,以偏移位置9开始,并用一个顶点绘制一个点。我们将使用下面这些位置绘制这两个点:

f872e80cd345b4e5564d06d48f46af0f4bae380f

OpenGL会在(4.5, 2)绘制第一个点,在(4.5, 12)绘制第二个点。

3.5.4 目前为止我们得到了什么

让我们运行这个程序,看看屏幕上会出现什么。按“Ctrl+F11”键让程序运行,观察设备上或模拟器里会显示什么。你的屏幕看起来应该与图3-1相似。如果碰到了什么问题,首先在Eclipse里尝试选择“Project->Clean”,清理这个程序。

12fb3471c752c29b969f5561e44580db8989e650

哦,看起来,哪里不太对!这个背景还是我们在第1章中使用的扎眼的红色,对于那个空气曲棍球桌子,我们为什么只看到一个角呢?在讨论这个之前,让我们来修复这个清屏用的颜色。在onSurface-Created()方法的开始处,找到glClearColor()的调用,把它更新成如下代码:
screenshot

当glClear()方法被调用的时候,这会告诉OpenGL把屏幕清除成黑色,而不是红色。现在我们已经修复了那个扎眼的红颜色,需要看一下为什么我们只能看见空气曲棍球桌子的一个角了。

3.5.5 OpenGL如何把坐标映射到屏幕

目前为止,我们还没有解决的一个大问题就是:OpenGL是怎样把我们已经定义的坐标映射到屏幕上的实际物理坐标的?
这个问题的答案很复杂,随着后面章节的讲解,我们会了解到更多有关的内容;目前,我们只需要知道,无论是x还是y坐标,OpenGL都会把屏幕映射到[-1,1]的范围内。这就意味着屏幕的左边对应x轴的-1,而屏幕的右边对应+1;屏幕的底边会对应y轴的-1,而屏幕的顶边就对应+1,如图3-2所示。

5dd274a723426932c5dabafeb9005ba1cb1fbc98

不管屏幕是什么形状和大小,这个坐标范围都是一样的,如果我们需要在屏幕上显示任何东西,都需要在这个范围内绘制它们。让我们回到构造函数,把tableVertices-WithTriangles中定义的坐标更新为如下值:

beb8c7ebea92272e15794d4b9340f15dcb0460f9

让我们再次运行这个应用,我们应该看到与图3-3类似的屏幕:

7cf07c32463e17bbe1574e28ab8825237d4507d7

这看起来好多了,但是木槌哪去了?事实证明,对于点来说,OpenGL需要我们指定在屏幕上所显示的点的大小,但我们还没指定这个大小呢。

3.5.6 指定点的大小

我们可以更新代码,告诉OpenGL那些点在屏幕上所显示的大小。在simple_vertex_shader.glsl文件里,在gl_Position赋值后面,我们可以加入如下代码行指定其大小:
screenshot

通过给另外一个特殊的输出变量gl_PointSize赋值,我们告诉OpenGL这些点的大小应该是10。你可能会问,10个什么?当OpenGL把一个点分解为片段的时候,它会生成一些片段,它们是以gl_Position为中心的四边形,这个四边形的每条边的长度与gl_PointSize相等。gl_PointSize值越大,屏幕上绘出的点越大。
让我们再运行一次这个应用。我们应该能看到如图3-4所示的木槌,每个木槌都被渲染为单个的点。

04f2d3f7d2c67fac7d2758b8c3795416dd09f7d2

我们终于把它画出来了!休息一下,坐下来,回忆一下你在本章学过的内容。本章的内容很多,但是我们还是把它讲完了,而且想办法得到了我们要在屏幕上显示的东西。
如果你准备好了,让我们回顾一下学过的内容,再做两个后续的练习。

相关文章
|
4月前
|
存储 XML 开发工具
探索安卓应用开发:从基础到进阶
在这篇文章中,我们将一起踏上安卓应用开发的旅程。不论你是编程新手还是希望提升技能的开发者,这里都有你需要的东西。我们会从最基础的概念开始,逐步深入到更复杂的主题。文章将涵盖开发环境设置、用户界面设计、数据处理以及性能优化等方面。通过理论与实践的结合,你将能够构建出既美观又高效的安卓应用。让我们一起开启这段技术之旅吧!
|
4月前
|
Android开发 Swift iOS开发
深入探索iOS与Android操作系统的架构差异及其对应用开发的影响
在当今数字化时代,移动设备已经成为我们日常生活和工作不可或缺的一部分。其中,iOS和Android作为全球最流行的两大移动操作系统,各自拥有独特的系统架构和设计理念。本文将深入探讨iOS与Android的系统架构差异,并分析这些差异如何影响应用开发者的开发策略和用户体验设计。通过对两者的比较,我们可以更好地理解它们各自的优势和局限性,从而为开发者提供有价值的见解,帮助他们在这两个平台上开发出更高效、更符合用户需求的应用。
|
5月前
|
Android开发 Swift iOS开发
iOS和安卓作为主流操作系统,开发者需了解两者差异以提高效率并确保优质用户体验。
【10月更文挑战第1天】随着移动互联网的发展,智能手机成为生活必需品,iOS和安卓作为主流操作系统,各有庞大的用户群。开发者需了解两者差异以提高效率并确保优质用户体验。iOS使用Swift或Objective-C开发,强调简洁直观的设计;安卓则采用Java或Kotlin,注重层次与动画。Swift和Kotlin均有现代编程特性。此外,iOS设备更易优化,而安卓需考虑更多兼容性问题。iOS应用仅能通过App Store发布,审核严格;安卓除Google Play外还可通过第三方市场发布,审核较宽松。开发者应根据需求选择合适平台,提供最佳应用体验。
119 3
|
5月前
|
存储 Android开发 开发者
深入理解安卓应用开发的核心组件
【10月更文挑战第8天】探索Android应用开发的精髓,本文带你了解安卓核心组件的奥秘,包括Activity、Service、BroadcastReceiver和ContentProvider。我们将通过代码示例,揭示这些组件如何协同工作,构建出功能强大且响应迅速的应用程序。无论你是初学者还是资深开发者,这篇文章都将为你提供新的视角和深度知识。
|
5月前
|
数据可视化 Android开发 开发者
安卓应用开发中的自定义View组件
【10月更文挑战第5天】在安卓应用开发中,自定义View组件是提升用户交互体验的利器。本篇将深入探讨如何从零开始创建自定义View,包括设计理念、实现步骤以及性能优化技巧,帮助开发者打造流畅且富有创意的用户界面。
164 0
|
3月前
|
搜索推荐 Android开发 开发者
安卓应用开发中的自定义控件实践
在安卓应用开发的广阔天地中,自定义控件如同璀璨的星辰,点亮了用户界面设计的夜空。它们不仅丰富了交互体验,更赋予了应用独特的个性。本文将带你领略自定义控件的魅力,从基础概念到实际应用,一步步揭示其背后的原理与技术细节。我们将通过一个简单的例子——打造一个具有独特动画效果的按钮,来展现自定义控件的强大功能和灵活性。无论你是初学者还是资深开发者,这篇文章都将为你打开一扇通往更高阶UI设计的大门。
|
4月前
|
缓存 监控 前端开发
探索Android应用开发之旅:从新手到专家
【10月更文挑战第42天】本文将带你踏上Android应用开发的旅程,无论你是初学者还是有经验的开发者。我们将一起探索如何从零开始创建你的第一个Android应用,并逐步深入到更高级的主题,如自定义视图、网络编程和性能优化。通过实际示例和清晰的解释,你将学会如何构建高效、吸引人的Android应用。让我们一起开启这段激动人心的旅程吧!
|
4月前
|
开发框架 前端开发 Android开发
探索安卓和iOS应用开发中的跨平台解决方案
【10月更文挑战第42天】在移动应用开发的广阔天地中,安卓和iOS系统如同两座巍峨的山峰,分别占据着半壁江山。开发者们在这两座山峰之间穿梭,努力寻找一种既能节省资源又能提高效率的跨平台开发方案。本文将带你走进跨平台开发的世界,探讨各种解决方案的优势与局限,并分享一些实用的代码示例,助你在应用开发的道路上更加游刃有余。
|
4月前
|
搜索推荐 前端开发 Android开发
安卓应用开发中的自定义视图实现
【10月更文挑战第30天】在安卓开发的海洋中,自定义视图是那抹不可或缺的亮色,它为应用界面的个性化和交互体验的提升提供了无限可能。本文将深入探讨如何在安卓平台创建自定义视图,并展示如何通过代码实现这一过程。我们将从基础出发,逐步引导你理解自定义视图的核心概念,然后通过一个实际的代码示例,详细讲解如何将理论应用于实践,最终实现一个美观且具有良好用户体验的自定义控件。无论你是想提高自己的开发技能,还是仅仅出于对安卓开发的兴趣,这篇文章都将为你提供价值。
|
4月前
|
传感器 XML IDE
探索安卓应用开发:从基础到进阶
【10月更文挑战第23天】在数字化时代的浪潮中,移动应用已成为人们日常生活的延伸。本文以安卓平台为例,深入浅出地介绍了如何从零开始构建一个安卓应用,涵盖了开发环境搭建、基本组件使用、界面设计原则以及进阶技巧等关键步骤。通过实例演示和代码片段,引导读者逐步掌握安卓应用开发的核心技能,旨在激发更多开发者对安卓平台的探索热情,并为初学者提供一条清晰的学习路径。

热门文章

最新文章

  • 1
    Android历史版本与APK文件结构
  • 2
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
  • 3
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 4
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 5
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
  • 6
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
  • 7
    【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
  • 8
    escrcpy:【技术党必看】Android开发,Escrcpy 让你无线投屏新体验!图形界面掌控 Android,30-120fps 超流畅!🔥
  • 9
    即时通讯安全篇(一):正确地理解和使用Android端加密算法
  • 10
    Android实战经验之Kotlin中快速实现MVI架构