Opengl Shader发光线条实例
来源:互联网 发布:lte mrr弱覆盖优化 编辑:程序博客网 时间:2024/04/30 14:13
转发请保持地址:http://blog.csdn.net/stalendp/article/details/21993227
这篇文章主要分析一个Shader,从而感受shader的魅力,并学习相关shader的函数的用法。
先看Shader运行的效果:
下面是代码:
下面进行分析:
1. ComputeScreenPos的解析:
用于把三维的坐标转化为屏幕上的点。有两种方式,请参考 官方例子
ComputeScreenPos在UnityCG.cginc文件中定义如下:
原理解析(待续)2. 背景的绘制
2.1) fmod用于求余数,比如fmod(1.5, 1.0) 返回0.5;
2.2) step用于大小的比较,step(a,x) : 0 if x<a; 1 if x>=a; 比如: step(1, 1.2), 返回1; step(1, 0.8) 返回0;
2.3) 结合fmod和step可以得到一个虚线的效果。 比如要得到虚线段长度为1的代码如下:
c1 = fmod(x, 2*width); c1=step(width,c1); //其中width为1
那么如果x的范围是[0,1),c1的值为0;范围为[1,2),c1的值为1;2为一个周期;
那么fmod起到了制作周期的作用,step计算周期内的0和1;
2.4)把2.3中的知识运用到2维,就可以计算出方块。
lerp函数的用法:lerp( a , b ,f ), f为百分数(取值范围[0,1]);如果f为0,则lerp返回a,f为1,则返回b。f为0到1之间,就返回a到b之间的值。
代码中的 lerp(uv.x * COLOR1, uv.y * COLOR2, c1*c2); 其中c1和c2的取值不是为1,就是为0,所以就可以变成网格的情况。 背景绘制如下:
3. 波纹的绘制
3.1 ) 坐标的转化
uv = -1.0 + 2.0*uv; // 把原始的uv进行扩展和位移,得到新的uv。我们的操作就是在新的uv上进行的,最终显示时会映射到原来到uv,请参考下图
3.2 ) 画一条直线:
由于上面把y轴移动到屏幕的中心,所以屏幕的上半部分为正的,下半部分为负的,代码如下:
其中50.0是用来控制线的宽度的(数值越大,线越细),效果如下:3.3)把直线变为曲线,并使其动起来:
效果如下:3.4)多画几条曲线,形成波浪:
最终效果请见文章开头。其实写shader,很多时候都是要通过不断地效果叠加并调试来达到效果。
- Opengl Shader发光线条实例
- Shader实例:边缘发光和描边
- Shader 轮廓发光shader
- Unity Shader 二 发光Shader
- 外发光材质Shader
- 边缘发光shader
- 发光shader代码
- Unity3D 发光Shader
- 外边缘描边发光Shader
- shader forge 外发光
- unity shader-边缘发光
- 两种外发光shader的比较
- OpenGL Shader
- opengl shader
- opengl shader
- 【OpenGL】Shader实例分析(一)-Wave
- 【OpenGL】Shader实例分析(二)- Heart
- 【OpenGL】Shader实例分析(三)- 等待标识
- 总结 XSS 与 CSRF 两种跨站攻击
- ios UIAlertController
- 添加唤醒键
- 报错信息:Caused by: org.hibernate.NonUniqueObjectException: a different object with the same identifier
- PTA 求自定类型元素序列的中位数,冒泡超时,改为希尔排序
- Opengl Shader发光线条实例
- 博弈问题
- 个人常用JavaScript及React常用优化总结
- 安卓输入框,只输入中文,屏蔽中英文标点和表情
- 数字图像梯形畸变校正
- L1-011. A-B Java
- 异常处理
- http各个状态返回值
- Apache Ambari 02