Unity 使用UGUI制作卷轴开启关闭效果

视频效果

代码

using UnityEngine.UI;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using DG.Tweening;
using DG.Tweening.Core;
using DG.Tweening.Plugins.Options;public class JuanZhou : MonoBehaviour
{[SerializeField]private RawImage rawImage;[SerializeField]/// <summary>/// Padding to be applied to the masking/// X = Left/// Y = Bottom/// Z = Right/// W = Top/// </summary>private RectMask2D rectMask2D;[SerializeField]private RectTransform Left;[SerializeField]private RectTransform Right;[SerializeField]private Vector4 rectMaskTarget;[SerializeField]private float LeftX;[SerializeField]private float RightX;[SerializeField]private float duration = 2;[SerializeField]private float LeftOriX;[SerializeField]private float RightOriX;private void Update(){if (Input.GetKeyUp(KeyCode.P)){Play();}else if (Input.GetKeyUp(KeyCode.O)){Close(true);}}/// <summary>/// 设置图片/// </summary>public void SetRawImage(Texture texture){rawImage.texture = texture;}[ContextMenu("开启")]public void Play(){Play(true);}public void Play(bool Invoke = true){float tmp = Invoke ? duration : 0;Left.DOAnchorPosX(LeftX, tmp).SetEase(Ease.Linear);Right.DOAnchorPosX(RightX, tmp).SetEase(Ease.Linear);rectMask2D.DoPadding(Vector4.zero, tmp).SetEase(Ease.Linear);}[ContextMenu("关闭")]public void Close(){Close(false);}public void Close(bool Invoke = true){float tmp = Invoke ? duration : 0;Left.DOAnchorPosX(LeftOriX, tmp).SetEase(Ease.Linear);Right.DOAnchorPosX(RightOriX, tmp).SetEase(Ease.Linear);rectMask2D.DoPadding(rectMaskTarget, tmp).SetEase(Ease.Linear);}[ContextMenu("暂停")]public void Pause(){Left.DOPause();Right.DOPause();rectMask2D.DOPause();}}public static class RectMask2DExtensions
{public static TweenerCore<Vector4, Vector4, VectorOptions> DoPadding(this RectMask2D target, Vector4 endValue, float duration, bool snapping = false){TweenerCore<Vector4, Vector4, VectorOptions> t = DOTween.To(() => target.padding, x => target.padding = x, endValue, duration);t.SetOptions(snapping).SetTarget(target);return t;}
}

##
卷轴预制体结构