unity2D 使用shader创建缩放时重复原始大小的循环图像

最新推荐文章于 2023-12-23 11:37:51 发布
最新推荐文章于 2023-12-23 11:37:51 发布
阅读量4.4k 收藏 1
点赞数 2
CC 4.0 BY-SA版权
分类专栏： Unity3d 相关 Shader 文章标签： 2d unity shader unity3d 游戏
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/zz3399353/article/details/52541444
本文介绍了如何在Unity2D中使用shader解决缩放时保持纹理原始大小并实现循环的效果。通过设置纹理的wrap mode为repeat，自定义shader并结合脚本，实现了即使在缩放情况下也能用单个精灵实现任意大小的墙面或其他重复图案，避免了使用多张tile拼接的问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在制作游戏时，经常需要用到将较小的重复循环的纹理图像拼成一个大图，比如地面上的尖刺，或是墙面砖块背景。遇到这种问题时通常的处理手段是像tilemap那样用单张纹理图片作为一个tile（unity中一般用sprite），将多个tile拼接起来形成一张大图。


例如有一张256x256的无缝墙面纹理，我希望用这张图铺满一个512x512大小的墙面， 512x512的墙面正好需要4个256x256的tile来拼接，拼接完成时如图1所示。

图1


但是这样处理要求拼接后的图像大小的宽和高需要分别为原图宽和高的整数倍，这样比较好处理。为了尽量满足这个要求，通常会将用作tile的图片做的非常小，这样可以满足尽量多的拼接图片不同大小的情况。


有没有一种更灵活的方式来处理这种问题，只用一个sprite就可以做出任意大小的墙面呢？


那必须有啊！


其实我们可以借助shader来完成这样一个效果。在opengl中有一个参数叫做GL_TEXTURE_WRAP，就是在纹理超出边界怎么处理。有一种模式是GL_REPEAT，就是可以将纹理进行重复。受到这个启发，我们是不是也可以利用这种重复模式，来实现缩放sprite时，纹理的大小不变，多出的部分则自动用重复的纹理进行铺满呢？


当然可以！只不过会麻烦一些......


unity中，纹理有一个wrap mode属性，可以设置成repeat或是clamp，其中repeat就是我们想要的重复模式。但是unity2d会自动将导入的纹理转换成sprite类型纹理，在sprite类型纹理的属性中，我们无法调整纹理的wrap mode属性所以我们首先需要将导入的纹理变成texture类型，如图2所示。修改完之后记得点apply进行保存。


图2


之后我们在unity编辑器新建一个sprite，这是我们发现新建的sprite不能直接使用我们修改的纹理了，所以我们需要通过脚本来用纹理生成一个sprite对象，赋给新建的sprite。像这样：

<div style="text-align: left;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="white-space:pre">	</span>// 将你的纹理<span style="font-size: 18px; white-space: pre; background-color: rgb(240, 240, 240);">YourTextureForSprite变成sprite</span></span></div><div style="text-align: left;"><span style="font-family
最低0.47元/天 解锁文章

200万优质内容无限畅学
Unity引擎开发：2D与3D渲染技术_UnityShader编程
chenlz2007的博客
02-12 1264
通过本节的学习，我们了解了Unity中的Shader编程基础，包括Shader的结构、类型以及如何编写和使用Shader。我们还介绍了几种常用的光照模型、纹理处理和颜色混合技术，这些技术可以显著提升游戏的视觉表现。希望这些示例和解释能够帮助你更好地理解和应用Shader编程，进一步提升你在Unity中的开发能力。在接下来的章节中，我们将深入探讨更多高级的Shader技术和优化方法，如计算着色器（Compute Shader）、光照烘焙（Light Baking）等。敬请期待！
Unity之使用Shader实现背景循环播放
爱上游戏开发
01-05 3588
最近游戏里面需要用到同一张背景资源循环播放（类似于飞机大战那种背景效果） 以前做飞机大战的时候，看别人的方案，是用的两张背景图循环交替移动：当一张图移出屏幕的时候，设置它的坐标到屏幕的上方。但是，如果背景有很多张，需要经常替换的话，使用这个方法明显增加了资源占用大小（复制一份同样的资源，内存也会多占用一半）。这时候，shader的加入就显得尤为重要了。接下介绍使用shader利用翻滚uv来实现视觉效果上的图片移动。 新建Sprite，导入背景资源 设置背景资源部分属性如下： 1.Texture Type
Unity用sharder实现重复贴图
无道的博客
11-14 5240
实现效果：通过sharder实现重复贴图 通过 Tilling和Offset调整 Shader "Custom/BaseShader" { Properties { _Color("Base Color", Color) = (1,1,1,1) _MainTex("Base(RGB)", 2D) = "white" {} } SubShader { tags{
Unity中的Compute Shader
qq_17347313的博客
03-27 9837
游戏开发中，dot编程在处理大数量级的运算应用已经越来越广泛了，而GPU本身对大规模数据的并行计算已经越来越强了，因此现在许多游戏处理大量物体的计算可以利用GPU这一特性，加快并发计算速度，Compute Shader就是专门利用这一特性的。
unity使用shader简单实现背景无限循环滚动效果
lcy的博客
11-11 5262
步骤如下： 1.导入背景图片后，设置图片的格式，如下图。 2.图片格式也可以设置是Texture格式，但是Wrap Mode 一定要是Repeat[重复发生]；然后记得Apply一下。[解释：Wrap mode :循环模式；换行模式；包裹模式；缠绕] 3.在Hierachy视图中，新建2D Object-〉Sprite 或者一个Image，将之前设置好的精灵放入Texture。 4.在Pro...
Unity中ShaderGraph避免贴图重复方法参考
ttod的博客
12-23 1147
Unity中ShaderGraph避免贴图重复方法参考
Unity中Shader缩放矩阵
楠溪泽岸的博客
12-21 2054
在Shader中，我们对于顶点经常使用到缩放变换。我们在这篇文章中，用点的缩放看一下缩放变换的几种方式。
Unity Shader实现水波纹效果
08-19
今天，我们将讨论如何使用 Unity Shader 实现水波纹效果。 水波纹效果是一个常见的视觉效果，在游戏中广泛应用于水面、湖泊、海洋等场景中。要实现水波纹效果，需要使用 Unity Shader 语言编写特殊的着色器程序。...
Unity Shader实现水墨效果
08-19
Unity Shader实现水墨效果主要是通过高斯模糊原始图像、用深度算出边缘进行描边、最后用画笔效果的滤波完成最终图像，以达到水墨风格的效果。下面是 Unity Shader 实现水墨效果的详细介绍： 一、水墨风格基本原理...
Unity shader实现自由放大缩小效果
08-26
要实现这种效果，需要使用 Unity 的 shader 语言编写一段特殊的 shader 代码，该代码将对图像进行处理，以达到自由放大和缩小的效果。在本文中，我们将详细介绍如何编写这样的一段 shader 代码，并提供了完整的代码...
shader编程-RayMarching三维场景下模型基本变换旋转、缩放、平移（WebGL-Shader开发基础09）
点燃火柴的博客
12-12 3477
RayMarching三维场景下模型基本变换1. demo概述2. 实现过程2.1 模型的旋转操作2.2 模型的缩放操作2.3 模型的平移操作 1. demo概述 在之前的一篇文章中讲述了，二维空间中物体的基本变换，即旋转、缩放、平移，现在学习一下三维空间下的基本变换，思路与原理是一样的，只不过是由二维提升为三维 2. 实现过程 2.1 模型的旋转操作 分别绕X轴旋转，Y轴旋转，Z轴旋转的矩阵如下 //绕z轴旋转矩阵 mat3 rotZ(float a) { return mat3(cos(a),-si
unity Shader 实现 图片 循环滚动
地球OL重生之我是程序员
09-24 2257
Shader "Unlit/ScrollX" { Properties { _MainTex("Base Layer(RGB)", 2D) = "white" {} // 纹理 _ScrollX("Base layer Scroll Speed",Float) = 0.1 // 滚动速度 _Mutiplier("Layer Mutiplier", Float) = 1 //整体亮度 } SubShader { Tags{ "RenderType"
unity 实时重复纹理
shenmifangke的专栏
11-23 4454
在编辑器模式下 update里加上gameObject.GetComponent().sharedMaterial.mainTextureScale = new Vector2(transform.localScale.x,transform.localScale.y); 就可以了，但是有缺点就是复制该物体时会产生新的材质从而有泄露，报错 Instantiating material due
Unity Shader滚动动画
qq_44800780的博客
12-02 472
Shader "Scroll" { Properties { _MainTex ("Texture", 2D) = "white" {} _Scrollx("Scroll Speed", Range(0,10)) = 1 } SubShader { Tags { "RenderType"="Opaque" } ...
Unity贴图流动Shader
红叶
04-15 2553
材质贴图流动效果，把脚本挂在在要流动贴图的物体上 using System.Collections; using System.Collections.Generic; using UnityEngine; public class FluentTex : MonoBehaviour { private Material m; public float moveSpeed = ...
unity背景滚动
qq_39706019的博客
08-13 627
本文参考自: 原文地址 背景滚动其实就是滚动模型的纹理Offset而已，修改Renderer组件下的Material的贴图的偏移即可。 using System.Collections; using System.Collections.Generic; using UnityEngine; public class Texturescorll : MonoBehaviour { ...
Unity Shader实现背景无限循环滚动效果
A_AiTing的博客
04-22 2108
最近做项目遇到的这个需求，分享给大家，有需要可以参考。 首先我们准备一下背景贴图，然后对贴图进行设置如下图所示： 贴图格式也可以是Texture格式，但是WrapMode 一定要是Repeat【重复发生】；记得Apply WrapMode:循环模式；换行模式；包裹模式；缠绕 将材质拖到物体身上 下面来编写Shader,代码如下 Shader "Unlit/ScrollX" { ...
滚动的背景 Shader
a_leaf_的博客
08-18 252
TA 滚动的背景 ShaderLab 参考冯乐乐《Shader入门精要》 frac函数是去float数后的小数部分的,它的图像是这样的 然后下面还用到了lerp函数，这个函数大家应该挺熟悉的就是下面这个 float lerp(a, b, c){ return (1- c)*a + c*b; } 好，下面就是Subshader部分 SubShader { Tags { "Queue"="Transparent" } pass{ Tags {
unity中实现背景滚动
weixin_46052359的博客
05-13 1794
让图片上下/左右滚动 1.导入一张需要滚动的背景，将Texture Type设置为Defauit 2.新建一个材质Material将Shader设置为Unit/Texture,并将上面设置好的背景图片拖入 3.新建一个3D物体Quad，设置款高比例和背景图片相同，将上面设置好的Material拖入Quad，此时控制Offset参数就可以实现背景滚动效果。 4.给背景Quad上Scripts using System.Collections; using System.Collections.Gener
unity shader 缩放贴图大小
最新发布
01-10
### Unity Shader 实现贴图缩放 在Unity中通过Shader实现贴图缩放主要依赖于修改UV坐标。当渲染对象时，可以通过调整传递给采样器的UV值来达到放大或缩小的效果。 对于简单的均匀缩放操作，在自定义着色器内可以乘以一个比例因子`scaleFactor`： ```c float2 uv = IN.uv_MainTex * scaleFactor; fixed4 col = tex2D(_MainTex, uv); ``` 如果希望创建更复杂的动态变化比如周期性的脉动，则可以在计算最终用于纹理查找的UV之前引入时间变量作为影响因素之一[^1]。 为了使这种基于时间的变化更加平滑自然，通常会采用正弦函数或者其他形式的插值算法来控制规模参数随时间连续过渡而不是突变。下面给出一段完整的HLSL代码片段展示如何在一个表面着色器(Surface Shader)里面完成上述功能[^2]: ```hlsl sampler2D _MainTex; float _TimeScale; // 控制动画速度 float _MinScale; // 最小缩放量 float _MaxScale; // 最大缩放量 struct Input { float2 uv_MainTex; }; void surf (Input IN, inout SurfaceOutput o) { float t = sin(_Time.y * _TimeScale); // 使用内置的时间属性获取当前帧数并转换成[-1,1]区间内的浮点数 float scale = lerp(_MinScale,_MaxScale,(t + 1.0f)*0.5f); // 将范围映射至[_MinScale,_MaxScale], 并确保结果非负 fixed4 c = tex2D(_MainTex, IN.uv_MainTex * scale); o.Albedo = c.rgb; } ``` 这段脚本展示了怎样利用时间驱动的方式让材质上的图案按照指定的最大最小界限之间循环变动大小。值得注意的是，这里的`_Time.y`代表了游戏运行以来经过秒数的一部分，因此非常适合用来制造持续不断的视觉特效而不需要额外管理计时逻辑[^3]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值