-------小基原创,转载请给我一个面子
一望无际的...空旷场景,看着实在是难受,不如添加些背景吧。如果要真的想好好设计关卡背景的话,最好是做一个地图编辑器,不过做开发工具毕竟有点点复杂且枯燥,以后放在别的系列里面再聊。本篇就做个非常简单的滚动屏幕吧
滚动屏幕的思路就是 两种与屏幕一样大小的背景图片A,B,让它俩无缝拼接同时同方向移动,当A移除视野后,坐标设置为B的后面。当B移除视野时,后面的A就能来“前赴后继”,然后B再跑到A后面,循环这个过程。(当然如果你有好多个背景串起来,跟跑火车似得,也是可以的,两张图交替是最简单的例子)下面看看怎么做
首先Canvas下创建个空物体Bgs,里面再创建空物体bgLayer,因为后期可能还有除了背景以外的层(花花草草什么的)
里面放2张image分别是bg1,bg2,各种下面放个Text显示文字(文字就是为了方便观察效果而已)
bg1和bg2都这样设置,因为小基的屏幕是1136X640的,所以这两背景也应该是同样大小
两个Text都这样设置就行了,一个显示文字“bg1”,一个显示文字“bg2”
Scene场景下看到的是这个样子,红框里面是相机的视野,Bg2再后面排队等待入场。
下面就是要添加代码控制这两张背景图了。小基在bgLayer上面添加一个脚本Scroll
1 using System.Collections; 2 using System.Collections.Generic; 3 using UnityEngine; 4 using UnityEngine.UI; 5 6 public class Scroll : MonoBehaviour { 7 8 public RectTransform[] bgTarget; 9 public float[] bgSpeeds; 10 11 public Vector3[] moveDis; 12 13 // Update is called once per frame 14 void Update () { 15 Move(); 16 } 17 18 Vector2 targetPos = Vector2.zero; 19 void Move() 20 { 21 for(int i = 0; i < bgTarget.Length; i++) 22 { 23 targetPos = bgTarget[i].localPosition; 24 if(targetPos.x <= -Screen.width * 0.5 - bgTarget[i].sizeDelta.x * 0.5) 25 { 26 bgTarget[i].localPosition += moveDis[i]; 27 } 28 else 29 { 30 bgTarget[i].Translate(bgSpeeds[i] * Time.deltaTime * Vector2.left); 31 } 32 } 33 } 34 }
非常非常简单的代码
bgTarget是个数组,你可以拖动多个背景图放在里面(放几个就有几个在视野外排队)
bgSpeeds是个数组,里面放对应的移动速度,无缝通向移动肯定是要速度一致了,所以这里不用数组也行。这里这么写,你可以尽情放飞自我,速度不同也说不定挺有意思的。
moveDis同样数组,可以设置各种移动位置,这个例子里面就是A移除视野后,瞬间移动到一个新的位置(应该放在B的后面)
Update()里面一直调用Move()方法,就是自动滚动。如果你想做当你移动的时候,背景滚动的话,那就在控制主角移动的时候,调用这边的背景移动就行了。
Move()方法里面,就是判断每一个背景是否已经超出了视野范围(这里只做了左移动移除视野的情况。如果运动方向不同,判断逻辑对应也不同)
如果超出视野,就设置新位置,如果没有超出,就Translate向着Vector2.left(左边)移动,速度你可以自己控制。
把bg1,bg2拖进去,MoveDis这个值是一张背景1136,两张就是2272
点击运行看效果
两张图片中间会有个缝?!(为啥网上光看别人写代码,但是没有人提到这个,或者演示效果?或许小基没找到?反正这块遇到了才发现有个小坑)
(小基推测是bg1移除视野瞬间,挪动到bg2的时候,bg2已经移动了)
这个坑真的有点坑!!!!!!!!
这回改下代码,看看bg1移动到bg2后面时,两个图的位置坐标差多少!
(╯°O°)╯┻━┻ 解决不了了!!!!!!!!!!!!
除了使用材质,或者把背景图片大小放大一些之外的方法,有什么办法能解决这个缝的问题呢??????????????请指教Orz