转发请保持地址:http://blog.csdn.net/stalendp/article/details/30989295

本文将介绍怎么通过alpha通道来隐藏信息。并实现卡牌特效。

执行效果例如以下:

代码例如以下:

Shader "stalendp/imageShine" {
Properties {
_MainTex ("image", 2D) = "white" {}
_NoiseTex("noise", 2D) = "bump" {}
_percent("percent", Range(-0.3, 1)) = 0
_DefColor ("defalutColor", COLOR) = ( 0, .8, .4, 1)
} CGINCLUDE
#include "UnityCG.cginc" sampler2D _MainTex;
sampler2D _NoiseTex;
float _percent;
fixed4 _DefColor; struct v2f {
half4 pos:SV_POSITION;
half4 uv : TEXCOORD0;
}; v2f vert(appdata_full v) {
v2f o;
o.pos = mul (UNITY_MATRIX_MVP, v.vertex);
o.uv.xy = v.texcoord.xy;
o.uv.zw = v.texcoord.xy + _Time.xx ;
return o;
} fixed4 frag(v2f i) : COLOR0 {
// 原始卡牌, 把alpha设置为1。屏蔽掉alpha通道信息
fixed4 tex0 = tex2D(_MainTex, i.uv.xy);
tex0.a = 1;
// 透明躁动卡牌; 使用alpha通道信息。设置显示颜色,并增加躁动。
half3 noise = tex2D(_NoiseTex, i.uv.zw );
fixed4 tex1 = tex2D(_MainTex, i.uv.xy + noise.xy * 0.05 - 0.025);
tex1.rgb = _DefColor.rgb; return lerp(tex0, tex1, smoothstep(0, 0.3, i.uv.y-_percent));
}
ENDCG SubShader {
Tags {"Queue" = "Transparent"}
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha
Pass {
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#pragma fragmentoption ARB_precision_hint_fastest ENDCG
}
}
FallBack Off
}

素材准备:

1)在本例中,在photoshop中处理图片。在alpha通道中存放了例如以下的信息图:

然后导出图片成为 tif格式。

2)准备一张噪声图片,并在unity下转化为Normal Map类型(改成NormalMap,会有对应的參数能够调节,对于这里的shader能够省略)。例如以下图:

3)用Quad来測试当前shader。

填写shader參数例如以下:

调节percent。就能够看到文章开头的那个特效。

原理解析:

1)透明躁动图片,这是在alpha图片的基础上增加躁动得到的结果。代码例如以下:
half3 noise = tex2D(_NoiseTex, i.uv.zw );
fixed4 tex1 = tex2D(_MainTex, i.uv.xy + noise.xy * 0.05 - 0.025);
tex1.rgb = _DefColor.rgb;
图片扭曲过程的解释:
a)因为_NoiseTex所表示的噪声图片的每一个像素点的值在区间[0,1]之内。即noise.xy的值在[0,1]之间。

b)  noise.xy * 0.05 的区间为[0,0.05];
c)noise.xy * 0.05-0.025的区间为[-0.025,0.025]

d)i.uv.xy + noise.xy * 0.05 - 0.025 表示对原来图片的uv进行[-0.025,0.025]之间随意值的一次偏移(取决于噪声图),这样就形成了图像扭曲效果。
e)又因为i.uv.zw受时间支配,所以noise的值也随时间变化。这样整个图片的扭曲。也随时间变化,就形成了液化的效果。
当中0.05和0.025的值是实验得出的。能够更具实际情况改变来达到不同的效果。

2)两个图片的叠加;通过比較uv中的v 和 _percent。来融合处理后的alpha通道和rgb通道。

lerp(tex0, tex1, smoothstep(0, 0.3, i.uv.y-_percent));

延伸:

当然也能够仅仅对图片的局部进行处理。

比方下图对闪电的处理,把闪电信息存放到alpha通道,然后就能够在shader做对应的处理了:



本文主要介绍如何利用图片的alpha通道来隐藏信息。能够节省资源。

这种运用会有非常多,有机会以后多加介绍。



【OpenGL】Shader实例分析(六)- 卡牌特效的更多相关文章

  1. 【OpenGL】Shader实例分析(七)- 雪花飘落效果

    转发请保持地址:http://blog.csdn.net/stalendp/article/details/40624603 研究了一个雪花飘落效果.感觉挺不错的.分享给大家,效果例如以下: 代码例如 ...

  2. 【OpenGL】Shader实例分析(九)- AngryBots中的主角受伤特效

    转发请保持地址:http://blog.csdn.net/stalendp/article/details/40859441 AngryBots是Unity官方的一个非常棒的样例.非常有研究价值. 曾 ...

  3. 「Unity卡牌自走棋」项目NABCD分析

    项目 内容 这个作业属于哪个课程 2021学年春季软件工程(罗杰 任健) 这个作业的要求在哪里 团队项目-初次邂逅,需求分析 在这个课程的目标是 锻炼在大规模开发中的团队协作能力 这个作业在哪个具体方 ...

  4. gpgpu-sim卡分配程序设计实例分析

    gpgpu-sim卡分配程序设计实例分析 运行代码地址:https://github.com/gpgpu-sim/gpgpu-sim_distribution 一.概述 此文件包含有关安装.生成和运行 ...

  5. input子系统学习笔记六 按键驱动实例分析下【转】

    转自:http://blog.chinaunix.net/uid-20776117-id-3212095.html 本文接着input子系统学习笔记五 按键驱动实例分析上接续分析这个按键驱动实例! i ...

  6. Hive(六)hive执行过程实例分析与hive优化策略

    一.Hive 执行过程实例分析 1.join 对于 join 操作:SELECT pv.pageid, u.age FROM page_view pv JOIN user u ON (pv.useri ...

  7. MIME协议(六) -- MIME实例分析

    MIME实例分析 了解MIME协议的基本组织结构后,下面用Outlook Express撰写出一封显示效果如图4所示的电子邮件,然后分析该邮件的源文件,以便读者更加深入地了解MIME协议. 1. 启动 ...

  8. 在WebGL场景中管理多个卡牌对象的实验

    这篇文章讨论如何在基于Babylon.js的WebGL场景中,实现多个简单卡牌类对象的显示.选择.分组.排序,同时建立一套实用的3D场景代码框架.由于作者美工能力有限,所以示例场景视觉效果可能欠佳,本 ...

  9. 使用UIKit制作卡牌游戏(三)ios游戏篇

    译者: Lao Jiang | 原文作者: Matthijs Hollemans写于2012/07/13 转自朋友Tommy 的翻译,自己只翻译了这第三篇教程. 原文地址: http://www.ra ...

随机推荐

  1. c编程:僵尸吃大脑

    第一行输入一个正整数n 以下每一行输入僵尸已经吃了的大脑数量a,和需要生存必需要吃的大脑数量b.总共n行. 例子输入 3 4 5 3 3 4 3 例子输出 NO BRAINS MMM BRAINS M ...

  2. cocos2d-x 一些实用的函数

    1.  自己主动释放粒子内存的函数      setAutoRemoveOnFinish(bool var) 2. 解决使用tiled出现像素线的问题在代码中搜索"CC_FIX_ARTIFA ...

  3. stm32单片机时钟中断的配置

    原作者:http://www.eeworld.com.cn/mcu/article_2016082828940.html 配置流程:   1:系统时钟初始化,包括系统时钟和要开放的IO口或者功能的时钟 ...

  4. angular 引入material-ui

    第一步:安装material和cdk和animations,一个也不能缺,否则会报错. npm install --save @angular/material @angular/cdk @angul ...

  5. Win10系统如何设置所有程序默认以管理员身份运行?

    原文:Win10系统如何设置所有程序默认以管理员身份运行? 在win10系统中有些用户发现一些程序只有使用管理员身份运行能才打开,这样的话就感觉会麻烦很多,那么有没有办法设置所有程序都默认以管理员身份 ...

  6. 【z07】机器翻译

    [题目链接]:http://noi.qz5z.com/viewtask.asp?id=z07 [题解] 可以理解为一直往一个队列里面加东西: 然后每次查找一个东西在不在队列的最尾部长度为m的区间范围内 ...

  7. 最正经的php post get

    https://www.cnblogs.com/ps-blog/p/6732448.html /** * 模拟post进行url请求 * @param string $url * @param str ...

  8. MCI

    MCI(Media Control Interface)媒体控件接口是Mircrosoft提供的一组多媒体和文件的标准接口.它的好处是可以方便地控制绝大多数多媒体设备 包括音频,视频,影碟,录像等多媒 ...

  9. cmder显示UTF-8字体

    https://blog.csdn.net/x_iya/article/details/50627829 WIN+ALT+P打开配置 搜索chcp chcp 65001

  10. Ubuntu10.04下安装Qt4和创建第一个Qt程序

    1.首先安装Qt4并采用Qt Creator进行开发演示 (1)在Terminal中输入: sudo apt-get install qt4-dev-tools qt4-doc qt4-qtconfi ...