【旧博客转移 - 2016年1月13日 13:18 】

前面的话:

本来我是想写一个水的原理的,但是发现涉及的知识太多,还有好多不懂的,所以就先一步一步来
最近呢,我在网上捡到了一本《热扭曲秘籍》,修炼数日,甚觉精妙
这次分享一个很简单的热扭曲原理
 

先看效果:

1.这是原图
 
2.加了特效之后~显得很亮,很柔..

3.这个神秘的图,才是效果的关键

 

扰动图:

扰动图其实是把offset信息写入到R,G通道中的图片
下面我们拿一个“照妖镜”随便找一个像素看一下它的真面目
 
可以看到像素值为#946A00, R通道94,G通道6A,而B通道没有值,是00,因为这里暂时用不到B
float4 disTex = tex2D(_DistortionMap, i.uv);
float2 offsetUV = float2(disTex.r, disTex.g);
通过tex2D采样,就可以取出扰动偏移量了
 
但是呢,颜色值是【0到1】,而扰动向量的值是【-1到1】
所以还需要转换一下
offsetUV = (offsetUV-0.5)*;

改变原图

float4 bgTex = tex2D(_Background, i.uv + offsetUV);
直接加上uv偏移量就行了
 

总结

看到这里,你已经掌握了扭曲图片的基本原理,没错就是这么简单~
偏移uv坐标,把偏移信息生成到一张图片中,就叫扰动图
 
热扭曲秘籍:链接:http://pan.baidu.com/s/1jH1nMqq 密码:zxfb

本文源码

Shader "lijia/Refractor1" {

    Properties {
_Background ("Background", 2D) = "" {} //背景纹理
_BackgroundScrollX ("X Offset", float) = //背景偏移
_BackgroundScrollY ("Y Offset", float) =
_BackgroundScaleX ("X Scale", float) = 1.0 //背景缩放
_BackgroundScaleY ("Y Scale", float) = 1.0
_Refraction ("Refraction", float) = 1.0 //折射值
_DistortionMap ("Distortion Map", 2D) = "" {} //扭曲
_DistortionScrollX ("X Offset", float) =
_DistortionScrollY ("Y Offset", float) =
_DistortionScaleX ("X Scale", float) = 1.0
_DistortionScaleY ("Y Scale", float) = 1.0
_DistortionPower ("Distortion Power", float) = 0.08
} SubShader {
Tags {"Queue" = "Geometry" "RenderType" = "Opaque"} Pass { Cull Off
ZTest LEqual
ZWrite On
AlphaTest Off
Lighting Off
ColorMask RGBA
Blend Off CGPROGRAM
#pragma target 2.0
#pragma fragment frag
#pragma vertex vert
#include "UnityCG.cginc" uniform sampler2D _Background;
uniform sampler2D _DistortionMap;
uniform float _BackgroundScrollX;
uniform float _BackgroundScrollY;
uniform float _DistortionScrollX;
uniform float _DistortionScrollY;
uniform float _DistortionPower;
uniform float _BackgroundScaleX;
uniform float _BackgroundScaleY;
uniform float _DistortionScaleX;
uniform float _DistortionScaleY;
uniform float _Refraction; struct AppData {
float4 vertex : POSITION;
half2 texcoord : TEXCOORD0;
}; struct VertexToFragment {
float4 pos : POSITION;
half2 uv : TEXCOORD0;
}; VertexToFragment vert(AppData v) {
VertexToFragment o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv = v.texcoord.xy;
return o;
} fixed4 frag(VertexToFragment i) : COLOR {
float2 bgOffset = float2(_BackgroundScrollX,_BackgroundScrollY);
float2 disOffset = float2(_DistortionScrollX,_DistortionScrollY);
float2 disScale = float2(_DistortionScaleX,_DistortionScaleY);
float2 bgScale = float2(_BackgroundScaleX,_BackgroundScaleY); float4 disTex = tex2D(_DistortionMap, disScale * i.uv+disOffset); float2 offsetUV = (-_Refraction*(disTex * _DistortionPower - (_DistortionPower*0.5))); return tex2D(_Background, bgScale * i.uv + bgOffset + offsetUV);
} ENDCG
}
}
}

Unity3D-Shader-热扭曲效果的更多相关文章

  1. Unity3D Shader图像扭曲过场效果

    把脚本挂在摄像机上 using UnityEngine; using System.Collections; [RequireComponent(typeof(Camera))] public cla ...

  2. Unity3D Shader 空气扭动效果

    //预览图 //原理 一个摄像机CullingMask设置只可见"Distortion"的Layer(需要自己手动加),输入到一张RenderTexture,其实就是用于确定哪里要 ...

  3. unity shader 热扭曲 (屏幕后处理)

      效果: c# using System; using System.Collections; using System.Collections.Generic; using UnityEngine ...

  4. Unity3D Shader 马赛克后期效果

    //效果图 //Shader代码 Shader "Hidden/Mosaic" { Properties { _MainTex ("Texture", 2D) ...

  5. Unity3D Shader 模型流光效果

    Shader "Custom/FlowColor" { Properties { _MainTex ("Base (RGB)", 2D) = "whi ...

  6. (转)热空气扭曲效果shader

    转自:http://blog.sina.com.cn/s/blog_89d90b7c0102vaqy.html 热空气扭曲在大自然中形成是比较复杂的,这里只是通过取屏幕纹理和移动UV来模拟热扭曲效果. ...

  7. unity3D 涂涂乐使用shader实现上色效果

    unity3D 涂涂乐使用shader实现上色效果 之前我博文里面发过一个简单的通过截图方式来实现的模型上色方法,但是那个方法不合适商用,因为你需要对的很准确才可以把贴图完美截取下来,只要你手抖了一下 ...

  8. 【译】Unity3D Shader 新手教程(1/6)

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 刚开始接触Unity3D Shader编程时,你会发现有关shader的文档相当散,这也造成初学者对Unity3D ...

  9. Shader实例:扭曲,漩涡

    效果: 案例:新仙剑,王者之剑. 在切换场景的时候,就会有这样的全屏扭曲效果. 思路: 1.用GrabPass抓屏到一张纹理中. 2.进行扭曲,绘制到UGUI的Image上. 准备: 去官网下载Uni ...

随机推荐

  1. Python3网络爬虫

    # 最近在实验楼学习了爬取妹子图,发现在运行的时候不是很流畅,有些图片下 1 # coding: utf-8 # coding: utf-8 import re import threading fr ...

  2. JavaScript数组知识点

    强类型语言数组特点:连续的,指定好长度, 还要规定好数据类型弱类型语言数组特点:不一定是连续的 可以不用指定长度 不限定数据类型(可以存储任意类型的数据)数组定义方式:1.var arr=new Ar ...

  3. Asp.net MVC 如何对所有用户输入的字符串字段做Trim处理

    经常需要对用户输入的数据在插入数据库或者判断之前做Trim处理,针对每个ViewModel的字段各自做处理是我们一般的想法.最近调查发现其实也可以一次性实现的. MVC4.6中实现方式 1,实现IMo ...

  4. node项目的基本构建流程或者打开一个node项目的流程

    1.  确立项目所需要的所有依赖.框架(比如bootstrap,vue,angular等) 2. 在项目的根目录下创建一个package.json文件,package.json文件是项目的最重要文件之 ...

  5. ui-router 父子state共享数据

    如果ui-view是嵌套的,那么在子view中,可以直接引用 $scope.$parent 即可.

  6. python 文件操作(pickle)

    >>> with open('text.txt','wb') as data:pickle.dump(['a','b',2],data) 保存到文件 >>> wit ...

  7. 摘记:Web应用系统测试内容

    表示层: 内容测试,包括整体审美.字体.色彩.拼写.内容准确性和默认值 Web站点结构,包括无效的链接或图形 用户环境,包括Web浏览器版本和操作系统配置(每一个浏览器都有不同的脚本引擎或虚拟机在客户 ...

  8. 再谈AbstractQueuedSynchronizer:独占模式

    关于AbstractQueuedSynchronizer JDK1.5之后引入了并发包java.util.concurrent,大大提高了Java程序的并发性能.关于java.util.concurr ...

  9. docker私有库搭建过程(Registry)

    实验环境: CentOS7 1611 Docker 1.12.6 registry   2.0 1.安装并运行registry 安装: [root@docker01 ~]# docker pull r ...

  10. Swift基础语法

    简介 特点 (1)优于OC,快速,安全 (2)取消了预编译指令包括宏定义(OC用的太多了) (3)取消了OC指针和不安全访问的使用(看不到星星了) (4)舍弃 Objective-C 早期应用 Sma ...