UnityShader实现百叶窗效果

本文实例为大家分享了UnityShader百叶窗展示的具体代码,供大家参考,具体内容如下

shader实现以上百叶窗效果,主要通过shader实现C#只是做开关控制

看到一篇文章弄的比较复杂,觉得可以都通过shader来实现,就动手了。

shader定义了2张texture,自己随便找2张图片拖进去就行。

Shader "Unlit/NewUnlitShader"
{
 Properties
 {
 _MainTex ("Texture", 2D) = "white" {}
 _MainTex2 ("Texture2", 2D) = "white" {}
 _StartFlag("开始标记", float) = 0
 _SpeedFactor("速度",Range(0.01,10)) = 0.1
 _StartTime("时间初始标记,不要手动设置",float) = 1
 _Column("百叶窗的列数",float ) = 5
 }
 SubShader
 {
 Tags { "RenderType"="Opaque" }
 LOD 100

 Pass
 {
 CGPROGRAM
 #pragma vertex vert
 #pragma fragment frag
 // make fog work
 #pragma multi_compile_fog

 #include "UnityCG.cginc"

 struct appdata
 {
 float4 vertex : POSITION;
 float2 uv : TEXCOORD0;
 };

 struct v2f
 {
 float2 uv : TEXCOORD0;
 float4 vertex : SV_POSITION;
 };

 sampler2D _MainTex;
 float4 _MainTex_ST;

 sampler2D _MainTex2;
 float4 _MainTex2_ST;

 float _StartFlag;
 float _Column;
 float _SpeedFactor;
 float _StartTime;

 v2f vert (appdata v)
 {
 v2f o;
 o.vertex = UnityObjectToClipPos(v.vertex);
 o.uv = TRANSFORM_TEX(v.uv, _MainTex);
 return o;
 }

 fixed4 frag (v2f i) : SV_Target
 {
 fixed4 col = 0;
 //_StartFlag 通过C#监听键盘事件,设置为1,作为开始动画的标记
 //step(a,b) => if(b>=a) return 1 else return 0
 //i.uv.x % (1/_Column) i.uv.x范围是0-1,分成_Column份 每份(1/_Column)
 fixed result = _StartFlag * step( i.uv.x % (1/_Column) ,(_Time.y - _StartTime) * _SpeedFactor );

 if( result == 0 )
 {
 col = tex2D(_MainTex, i.uv);
 }
 else
 {
 col = tex2D(_MainTex2, i.uv);
 }

 return col;
 }
 ENDCG
 }
 }
}

C#控制开关,点击键盘任意按键。挂到panel上

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class baiyechuang : MonoBehaviour {

 // Use this for initialization
 Material mat;
 MeshRenderer meshRen;
 void Start () {
 meshRen = this.GetComponent<MeshRenderer> ();
 print (meshRen);
 mat = meshRen.material;
 print (mat);
 }

 void OnGUI() {
 if (Input.anyKeyDown)
 {
  Event e = Event.current;
  if (e.isMouse) {
  Debug.Log(e.button);
  }
  if (e.isKey)
  {
  if (e.keyCode == KeyCode.None)
   return;
  Debug.Log(e.keyCode);
 mat.SetFloat ("_StartTime", Time.timeSinceLevelLoad);
 mat.SetFloat ("_StartFlag", 1);
  }
 }
 }

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Unity shader实现百叶窗特效

    本文实例为大家分享了Unity shader百叶窗展示的具体代码,供大家参考,具体内容如下 1.将图片划分为水平N栏,代码如下: Shader "Unlit/BYCShader" { Properties { [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {} _Color ("Tint", Color) = (1,1,1,1) _StencilComp

  • UnityShader实现百叶窗效果

    本文实例为大家分享了UnityShader百叶窗展示的具体代码,供大家参考,具体内容如下 shader实现以上百叶窗效果,主要通过shader实现C#只是做开关控制 看到一篇文章弄的比较复杂,觉得可以都通过shader来实现,就动手了. shader定义了2张texture,自己随便找2张图片拖进去就行. Shader "Unlit/NewUnlitShader" { Properties { _MainTex ("Texture", 2D) = "whi

  • js实现横向百叶窗效果网页切换动画效果的方法

    本文实例讲述了js实现横向百叶窗效果网页切换动画效果的方法.分享给大家供大家参考.具体分析如下: 这是一款很简洁但是效果却不错的网页切换效果,点击新网页后,网页会出现蓝白相间的百叶窗线条自动切换,直到网页全部显示完全.代码如下: 复制代码 代码如下: <html> <head> <title>js网页百叶窗动态切换效果</title> <style> <!-- .intro{ position:absolute; left:0; top:0

  • jquery实现百叶窗效果

    今天试着用jq写了下图片百叶窗效果,就是鼠标经过那张图,那张图显示,其他图片缩小~ 最开始看效果的时候觉得好复杂,以为是宽度的变化写的动画,但是后来细想,如果是宽度变化,那么图片变窄的时候肯定会失真了,后来经过学习,发现原来原理很简单: 基本原理就是,将图片都绝对定位到盒子里,然后分别定位,平分整个盒子,图片就会显示一种层叠效果了(本案例是通过left值控制位置):然后通过jq控制,当鼠标经过某张图片的时候这张图片完全显示(即left值进行变化),其他图片的left值也进行相应的改变. 文字描述

  • 原生js实现百叶窗效果及原理介绍

    百叶窗大家都见过吧!如图: 原理: 如图所示,空心格子就好比是每个li,给它设定相对定位属性,设置overflow:hidden:黑块为li子元素,高度为li的2倍,设置absolute属性,我们正是要改变它的top值从而获得变化!(右上角多余块与本图无关) 布局分析: 注意top值得变化!默认top=0时候,显示的"一楼上铺",当top=-40px时候,li的子元素 上移40px,这时候显示的内容就为"一楼下铺"注意p元素的包裹层div JS分析: 1.要开多个定

  • jquery实现百叶窗效果(利用li的定位)

    本文实例为大家分享了jquery实现百叶窗效果的具体代码,供大家参考,具体内容如下 大概思路: 一个div(宽度为800px),里面包含ul和li,li的宽高分别设置为560px,300px(li里的图片也是这个宽高).li设置绝对定位,div设置相对定位. .no0{ left:0; } .no1{ left:160px; } .no2{ left:320px; } .no3{ left:480px; } .no4{ left: 640px; } 不动画的时候,每个li宽高为160px.(80

  • JS实现网页百叶窗效果

    网页百叶窗特效代码 window.innerHeight) clearInterval(stopit) } else if (document.all){ clipbottom-=speed for (i=1;i [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • jQuery 翻牌或百叶窗效果(内容三秒自动切换)

    核心代码: 复制代码 代码如下: $(function(){ var timer = true; //执行向上或向下的开关 var liindex = 0; //LI的索引 var $div = $(".byc").find("div"); //每隔三秒执行一次变换LI的内容 var set1 = setInterval(function(){ ainbyc($div); liindex = 0; timer = !timer; },3000); //LI变换的方式

  • 用move.js库实现百叶窗特效

    今天操作的是一个,百叶窗效果的一个页面特效,好,现在直接上最终效果吧.demo做的有点low,不过效果都在了 这是html和css代码:思路就是,每一个li里面div,放几个p,通过调节translatY,来控制. <style> *{ padding: 0; margin: 0; list-style: none; } #bai{ width: 400px; height: auto; float: left; margin-left:20px auto; } li{ text-align:

  • Unity Shader实现序列帧动画效果

    本文实例为大家分享了Unity Shader序列帧动画效果的具体代码,供大家参考,具体内容如下   实现原理 主要的思想是设置显示UV纹理的大小,并逐帧修改图片的UV坐标.(可分为以下四步) 1.我们首先把 _Time.y 和速度属性_Speed 相乘来得到模拟的时间,并使用CG 的floor 函数对结果值取整来得到整数时间time 2.然后,我们使用time 除以_HorizontalAmount 的结果值的商来作为当前对应的行索引,除法结果的余数则是列索引. 3.接下来,我们需要使用行列索引

  • Delphi基本图像处理方法汇总

    本文实例汇总了Delphi基本图像处理方法.分享给大家供大家参考.具体分析如下: //浮雕 procedure Emboss(SrcBmp,DestBmp:TBitmap;AzimuthChange:integer);overload; var i, j, Gray, Azimuthvalue, R, G, B: integer; SrcRGB, SrcRGB1, SrcRGB2, DestRGB: pRGBTriple; begin for i := 0 to SrcBmp.Height -

随机推荐