如何为可滚动 UI（Unity）设置滚动距离限制？答案

【问题标题】：How to set a scrolling distance limit for the scrollable UI (Unity)?如何为可滚动 UI（Unity）设置滚动距离限制？
【发布时间】：2020-06-03 18:11:53
【问题描述】：

我在 Unity 中开发一个简单的可滚动 UI。

我在场景中有一个画布，它在小时候是空的。
Empty 是具有不同按钮的长 UI 面板的父项。

我使用以下脚本（分配给 Empty）使其可滚动：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class PageSwiper : MonoBehaviour, IDragHandler, IEndDragHandler
{
    private Vector3 scrollableUILocation;



    // Start is called before the first frame update
    void Start()
    {
        scrollableUILocation = transform.position;
    }
    public void OnDrag(PointerEventData data)
    {
        float difference = data.pressPosition.x - data.position.x;
        transform.position = scrollableUILocation - new Vector3(difference, 0, 0);
    }
    public void OnEndDrag(PointerEventData data)
    {
        scrollableUILocation = transform.position;

    } 
}

问题是我可以将 UI 面板滚动到屏幕之外。所以我需要让它变得不可能，或者让它如果我滚动得太远，它会顺利返回（到 UI 面板的末尾或开头，取决于哪个更近）

我该怎么做？

我尝试实现以下解决方案，但它不起作用：

我在 UI 面板的左侧和右侧添加了两个 Empty 对象。我试图让我的 UI 面板平滑地移动到其中一个空对象的位置，以防我将它移动到离它们足够近的位置。但它不起作用。

 public void OnEndDrag(PointerEventData data)
{
    if (Vector3.Distance(transform.position, StartPoint.transform.position) < 1.0f)
    {
        StartCoroutine(SmoothMove(transform.position, StartPoint.transform.position, easing));
    }

    else if (Vector3.Distance(transform.position, EndPoint.transform.position) < 1.0f)
    {
        StartCoroutine(SmoothMove(transform.position, EndPoint.transform.position, easing));
    }


}

IEnumerator SmoothMove(Vector3 startpos, Vector3 endpos, float seconds)
{
    float t = 0f;
    while (t <= 1.0)
    {
        t += Time.deltaTime / seconds;
        transform.position = Vector3.Lerp(startpos, endpos, Mathf.SmoothStep(0f, 1f, t));
        yield return null;
    }
}

【问题讨论】：

您的 OnEndDrag - 两个条件 dnd 例程参数似乎相同
@BugFinder 谢谢，已修复。我只用一个“if”语句进行测试，在为这个问题添加第二个语句时忘记更改变量名。
您是指运动类型吗？如果不受限制，那么它将滚动到边界之外，如果您将其设置为夹紧或弹性（这是您所描述的），那么它将在容器的末端停止。您还可以启用/禁用垂直/水平滚动，使其仅向一个方向移动
@Everts 哇，这是一个很棒的解决方案，我没有使用 ScrollRect，现在将使用它，谢谢！如果您将添加有关 ScrollRect 和 MovementType 的信息作为答案，我会接受！

标签： c# unity3d user-interface

【解决方案1】：

因此，您最好使用 ScrollRect，因为它已经包含此类功能所需的所有操作。

MovementType 将定义系统在到达容器末端时的反应（来自文档）：

不受限制内容可以永远移动。
Elastic 允许内容暂时移出容器，但会被弹性拉回。
Clamped 无法将内容移出其容器。

考虑到你有一个长按钮系统，也许它需要是动态的，所以你会研究 ContentSizeFitter。

您添加一个滚动视图对象。这将默认包括：

滚动视图
视口
内容

现在向 Content 对象添加一个 Text 组件，而不是文本子组件，它是一个组件。还添加一个 ContentSizeFitter 并将垂直适合设置为首选大小。这是因为我将处理垂直扩展。

确保视口占据应用作遮罩的空间。第一次练习时，将 ScrollView 对象放在中间，并将 Viewport 的锚点设置为 0,1，这样它就占据了整个父对象。

你可以做的还有很多，我建议你看看免费的Unity UI extension library，因为它有一些花哨的手风琴或无尽的滚动效果。

【讨论】：

【解决方案2】：

不受限制内容可以永远移动。 基本上你会输大卷轴的内容
Elastic 允许内容暂时超出容器，但被弹性拉回无用
Clamped 内容不能移出其容器无用

【讨论】：