一、背景视觉差
首先需要几张背景图(需要可以无缝衔接的),例如下面这种:一张sky背景图和一张city背景图
然后创建一张sky的sprite,并且复制两张作为它的子物体,一张放其左边,一张放其右边:
拼接效果如下:
city背景图同理:
代码如下:
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
/// <summary>
/// 背景图
/// </summary>
public class ParallaxBackground : MonoBehaviour
{
private GameObject cam;
[SerializeField] private float parallaxEffect; //视觉差强度
private float xPostision;
void Start()
{
cam = GameObject.Find("Main Camera");
xPostision = transform.position.x;
}
private void FixedUpdate()
{
//背景图X轴将要移动的距离=相机在X轴上的位置 * 视觉差强度
float distanceToMove = cam.transform.position.x * parallaxEffect;
transform.position = new Vector3(xPostision + distanceToMove, transform.position.y);
}
}
代码解析:
-
cam.transform.position.x
: 这个值表示相机在X轴上的当前位置。随着相机的移动,背景图也应该相应地移动。 -
parallaxEffect
: 这个变量代表背景图的视觉差强度。它的值通常在0到1之间:- 当
parallaxEffect = 0
时,背景图完全不动。 - 当
parallaxEffect = 1
时,背景图与相机以相同的速度移动(即不产生视觉差)。 - 当
0 < parallaxEffect < 1
时,背景图以低于相机的速度移动,产生视觉差效果。
- 当
将脚本挂载在两个父物体身上,设置sky的parallaxEffect为1,city的parallaxEffect为0.9(具体值根据自身项目调试)
运行,这样就能实现不同背景图之间的视觉差。
二、无限背景效果
代码如下:
public class ParallaxBackground : MonoBehaviour
{
private GameObject cam;
[SerializeField] private float parallaxEffect; //视觉差强度
private float xPostision;
private float length;
// Start is called before the first frame update
void Start()
{
cam = GameObject.Find("Main Camera");
//SpriteRenderer.bounds.size可以准确的返回当前物体显示的大小,
//而物体的Scale属性受父物体的缩放以及图片原始像素大小的影响下不能准确反映物体显示的大小
length = GetComponent<SpriteRenderer>().bounds.size.x; //背景图的长度
xPostision = transform.position.x;
}
private void FixedUpdate()
{
//背景图已经移动过的X轴值
float distanceMoved = cam.transform.position.x*(1 - parallaxEffect);
//背景图X轴将要移动的距离=相机在X轴上的位置 * 视觉差强度
float distanceToMove = cam.transform.position.x * parallaxEffect;
transform.position = new Vector3(xPostision + distanceToMove, transform.position.y);
//如果背景图移动的距离 超过背景图当前X轴位置+背景图长度时
if (distanceMoved > xPostision + length)
xPostision = xPostision + length; //则重置背景图位置
else if (distanceMoved < xPostision - length) //反向移动同理
xPostision = xPostision - length;
}
}
代码解析:
(1 - parallaxEffect)
: 这个表达式计算了背景图的移动比例。通过将相机移动的距离乘以这个值,可以得到背景图应该已经移动的距离。举例来说:
- 如果
parallaxEffect
是0.5,意味着背景图应该以相机移动距离的一半来移动。所以(1 - 0.5) = 0.5
,相机移动1单位,背景图就移动0.5单位。