OpenGL ES 2.0 顶点着色器的妙用
1.飘扬的旗帜(水面起伏)
基本原理
绘制一帧画面时由顶点着色器根据一定的规则变换各个顶点的位置,即可得到旗帜迎风飘扬的效果。
为了使旗帜的飘动过程比较平滑,采用基于正弦曲线的顶点位置变换规则。
计算方法
- 传入顶点着色器的原始顶点的Z{X|Y|Z}坐标都是相同的(本案例为0),经过顶点着色器变换后顶点的Z{X|Y|Z}坐标是根据正弦曲线分布的
- 首先计算出当前处理顶点的X坐标与最左侧顶点X坐标的差值,即X距离
- 然后根据距离与角度的换算率将X距离换算为当前顶点与最左侧顶点的角度差(tempAngle)
- 接着将tempAngle加上最左侧顶点的对应角度(startAngle)即可得到当前顶点的对应角度(currAngle)
- 最后通过求currAngle的正弦值即可得到当前顶点变换后的Z坐标
距离与角度的换算率指的是由开发人员认为设定的一个值,将距离乘以其后就可以换算成角度值。
例如可以规定,X方向上距离4等于2PAI,则换算公式为:X距离x2PAI/4
2.扭动的软糖
基本原理
实现扭曲软糖的效果只要将代表软糖的长方体中各层顶点的X,Z坐标按照一定的规则根据顶点的Y坐标以及当前帧的控制参数进行变换即可。
计算步骤
- 首先,需要计算出当前顶点Y坐标与最下层顶点Y坐标的差值。
- 接着根据Y坐标的差值,角度换算比例以及本帧的总扭曲角度换算出当前顶点的扭曲角度,计算公式为currAngle=(currY-startY)/ySanxangleSpan.
- 最后根据当前顶点的X、Z坐标,扭曲的角度计算出变换后顶点的X、Z坐标,
X2 = xcosa-zsina
Z2 = xsina+zcosa
3.风吹椰林场泉的开发
基本原理
为了简化计算,采用的风向是与XOZ平面平行的。设当前风向与Z轴正方向的夹角为a,树干原始状态下与Y轴重合,点A为树干模型中的任一顶点,在风的吹动下偏转到A`点
则顶点着色器需要计算的问题为:已知A点坐标(X0,Y0,Z0)、当前风向与Z轴正方向的夹角a以及弧OA`所在圆的半径OO`,求A点偏转到A`后的坐标。
计算步骤:
......有时间补补数学吧
4.展翅飞翔的雄鹰
基本原理:
给顶点着色器提供动画中的每个关键帧对应的各个顶点的位置数据以及融合比例。顶点着色器根据两套位置数据及当前融合的比例融合出一套结果顶点位置数据。只要在绘制每一帧时提供不同的混合比例即可产生想要的动画。
5.二维扭曲
要想能对原始三角形实现扭曲处理,必须将大三角形切分为很多的小三角形。
OpenGL ES 2.0 顶点着色器的妙用的更多相关文章
- OpenGL ES 3.0顶点着色器(一)
OpenGL ES 3.0流程图 1.Vertex Shader(顶点着色器) 顶点着色实现了一种通用的可编程方法操作顶点. 顶点着色器的输入包括以下几个: • Shader program.程序的顶 ...
- OpenGL ES 3.0顶点着色器(二)
#version es uniform mat4 u_mvpMatrix; in vec4 a_position; in vec4 a_color;out vec4 v_color;void main ...
- OpenGL ES 3.0片段着色器(四)
片段着色器流程图 片段着色器(fragment shader)实现了一个通用的可编程操作片段的方法.片段着色器执行由 光栅化生成的每个片段. • Shader program(着色器程序)—片段着色器 ...
- OpenGL ES 3.0 顶点缓冲区VBO使用
一般情况下数据都是有CPU从RAM取数据 然后传给GPU去处理,相对于GPU速度要慢一些. 使用VBO技术 可以把数据存储到GPU的内存空间中,这样GPU可以直接从GPU的内存中取得数据进行处理 速度 ...
- OpenGL ES 3.0之Shading Language(八)
每个OpenGL ES 3.0程序要求一个顶点着色器和一个片段着色器去渲染一个图形.着色器概念是API 的中心,本篇将介绍着色器语言部分包含下面几项 1.变量和变量类型 2.矢量和矩阵创建及选择 3. ...
- OpenGL ES 3.0 点,线,三角形绘制形式总结
OpenGL ES 3.0 顶点 -1, 1, 0, -0.5f, 0, 0, 0, -1, 0, -1, 0, 0, 0.5f, 0, 0, 1, -1, ...
- 【Android 应用开发】OpenGL ES 2.0 -- 制作 3D 彩色旋转三角形 - 顶点着色器 片元着色器 使用详解
最近开始关注OpenGL ES 2.0 这是真正意义上的理解的第一个3D程序 , 从零开始学习 . 案例下载地址 : http://download.csdn.net/detail/han120201 ...
- OpenGL ES 2.0 -- 制作 3D 彩色旋转三角形 - 顶点着色器 片元着色器 使用详解
最近开始关注OpenGL ES 2.0 这是真正意义上的理解的第一个3D程序 , 从零开始学习 . 案例下载地址 : http://download.csdn.net/detail/han120201 ...
- OpenGL ES 3.0之顶点缓冲
所谓顶点缓冲就是直接将顶点数据存储在gpu的一段缓冲区,不需要从cpu拷贝到gpu.提高了程序的运行效率. 操作步骤 1.创建顶点缓冲对象 GLuint vertexBufferID; 2.分配空间 ...
随机推荐
- centos 下使用sublime
CentOS 之 Sublime text3 安装及配置(不支持中文输入) sublime text 的界面友好,自动补全功能也不错. (本来用vim+php_function.txt的形式进行补全的 ...
- android 模拟微信消息框 BaseAdapter()方法 [2]
在昨天的微信布局的基础上加内容 http://www.cnblogs.com/Seven-cjy/p/6098024.html 项目下/res/layout下创建一个 listview_layout. ...
- 基于CAShapeLayer和贝塞尔曲线的圆形进度条动画
通过CAShapeLayer和贝塞尔曲线搭配的方法,创建的简单的圆形进度条的教程先简单的介绍下CAShapeLayer1,CAShapeLayer继承自CALayer,可使用CALayer的所有属性2 ...
- Android 之Service
service是运行在后台的服务,你可以启动一个服务Service来播放音乐,或者记录你地理信息位置的改变,或者启动一个服务来运行并一直监听某种动作. 接下来分析一下service 的生命周期: 1: ...
- Spring MVC 如何防止XSS、SQL注入攻击
在Web项目中,通常需要处理XSS,SQL注入攻击,解决这个问题有两个思路: 在数据进入数据库之前对非法字符进行转义,在更新和显示的时候将非法字符还原 在显示的时候对非法字符进行转义 如果项目还处在起 ...
- HDOJ 1391 Number Steps(打表DP)
Problem Description Starting from point (0,0) on a plane, we have written all non-negative integers ...
- Android取得电池的电量
首先需要用到的是一个类继承BrocastReceiver 2 代码如下: public class Battery_Info extends BroadcastReceiver { @Override ...
- spring 学习2
package com.asm; //...省略导入的相关类 public class MessageController implements Controller { public ModelAn ...
- webpack之基础学习
webpack工作原理: 通过一个入口文件,main.js开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个浏览器可识别的JavaScript文件. Webpack的核心原理 ...
- 【实验 1-2】编写一个简单的 UDP 服务器和 UDPP 客户端程序。程序均为控制台程序窗口。
1.服务器 #include<winsock2.h> //包含头文件#include<stdio.h>#include<windows.h>#pragma comm ...