【UnityShader]使用Shader将图片进行水平/竖直镜像翻转

一、需求

在开发时从很多地方取出来的图片可能并不是图像原本的模样,可能是被水平或者竖直镜像翻转后的图形,这时候我们要将图片再次镜像回来,只需要一个小小的Shader即可。

二、实现

下面是镜像翻转Shader的思路:

一般来说我们在顶点着色器里面进行纹理的位置坐标变换,

在顶点着色器当中我们需要定义输入和输出的结构体,然后在顶点着色器函数中对输入和输出的关系进行具体的转换:

cs 复制代码
   struct a2v{
                float4 vertex : POSITION;
                float3 texcoord : TEXCOORD0;
            };
            //顶点输出结构体
            struct v2f{
                float4 pos : SV_POSITION;
                float2 uv : TEXCOORD0; 
            };
            //顶点着色器函数
            v2f vert(a2v v){
                ...
            }

首先我们肯定是要使用UnityObjectToClipPos方法将顶点的位置转换为裁剪空间坐标。

裁剪空间坐标即UV坐标,UV的x和y的范围都是0-1;

对于水平镜像:y不变,处理后坐标.x=1-原坐标.x;

对于竖直镜像:x不变,处理后的坐标y=1-原坐标y;

cs 复制代码
 //顶点着色器函数
            v2f vert(a2v v){
                v2f o;
                o.pos = UnityObjectToClipPos(v.vertex);//将顶点位置转换为裁剪空间位置
 
                o.uv = v.texcoord;//传递纹理坐标
                if(_MirrorU>0){
                    o.uv.x = 1 - o.uv.x;//水平翻转纹理坐标,UV的范围都是(0,1),y不变,水平镜像后的坐标.x=1-原坐标.x
                }
                if(_MirrorV>0){
                    o.uv.y = 1 - o.uv.y;//竖直镜像时,x不变,镜像后坐标.y=1-镜像前坐标.y
                }
 
                return o;
            }

最后我们再在片元着色器函数中从主纹理采样并返回颜色,

这样一个简单的镜像翻转shader就完成了。

三、demo:

资源Demo下载链接​​​​​​​

相关推荐
科技快报24 分钟前
引入实时 3D 渲染技术,地平线与 Unity 开启车载交互空间化时代
3d·unity·交互
爱吃小胖橘3 小时前
高效对象池设计:提升Unity性能的关键
开发语言·unity·c#·游戏引擎
沉默的记录者3 小时前
unity 2021反向遮罩的毛边
unity·游戏引擎
沧海归城4 小时前
Unity_Canvas_Canvas Scaler画布缩放器。
unity·游戏引擎
Renderbus瑞云渲染农场6 小时前
跨平台渲染不再难_瑞云渲染跨平台转移+克隆双功能上线,效率升级
3d·图形渲染
一只一只1 天前
Unity 3D笔记(进阶部分)——《B站阿发你好》
笔记·3d·unity·游戏引擎
yi碗汤园1 天前
【一文了解】八大排序-冒泡排序、选择排序
开发语言·前端·算法·unity·c#·1024程序员节
qq_205279051 天前
unity PS 给图片换透明底图,去除白色底图
unity
向宇it2 天前
【推荐100个unity插件】unity易于使用模块化设计的天空、体积云和天气系统——Enviro 3
游戏·3d·unity·c#·游戏引擎
怣疯knight2 天前
unity实现2D人物从上面踩踏敌人,敌人减血的简易方法(类似马里奥的攻击手段)
unity·游戏引擎