Unity Scroll View简单介绍和使用

Unity Scroll View简单介绍

最近用到Scroll View组件就简单记录一下在这里插入图片描述
Content：（内容）内容元素的引用。
Horizontal：（水平）水平方向拖动。
Vertical：（垂直）垂直方向拖动。
Movement Type：（类型）无限制，弹性，收紧。弹性和收紧模式下将内容限制在滚动矩阵范围中，弹性模式在达到滚动矩阵的边缘会反弹。
Elasticity：（弹性）弹性模式下的弹性系数。
Inertia：（惯性）设置惯性后拖动后松开内容会继续滑动。未设置则只有在拖动才会滑动。
Deceleration Rate：（减速率）设置惯性后，减速率决定元素停止移动的速度。0立即停止，1不会减速。
Scroll Sensitivity：（滚动灵敏度）滚轮滚动事件灵敏度。
Viewport：（视图端口）层级Viewport引用。
Horizontal Scrollbar：（水平滚动条）对水平滚动条元素引用
Visibility：（能见度）滚动条是否在不需要时自动隐藏，是否还可以扩展。
Spacing：（间隔）滚动条和视口的空间。
在这里插入图片描述
1.含有Scroll Rect组件的根节点：Scroll View
2.含有Mask组件的节点：Viewport
3.所有内容的父节点Content，常含有布局控件
4.滚动条，包括横向和纵向

节点Scroll View中的组件Rect Transform的Width和Height控制着整个区域大小，组件Scroll Rect的滚动条设置也会影响显示区域的边界位置是否完整；
节点Viewport的组件Image中的Image Type属性会影响显示的区域；
节点Content的组件Rect Transform的布局和宽高影响了显示的区域。

了解完组件，我们只需要在Content中将我们的元素放入。为了自动布局可以使用自带的组件
在这里插入图片描述

前后添加组件区别。这个组件需要自己去调整尺寸于是我们可以直接用下面这个组件

组件组要作用就是可以自动调整尺寸。

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

public class ScrollViewTest : MonoBehaviour,IBeginDragHandler,IDragHandler,IEndDragHandler
{
    private ScrollRect scrollRect;
    private RectTransform contentRectTrans;
    void Start()
    {
        scrollRect = GetComponent<ScrollRect>();
        //关于RectTransform的探究
        contentRectTrans = scrollRect.content;

        //当前UI的世界坐标
        Debug.Log("当前UI的世界坐标" + contentRectTrans.position);
        //当前UI的局部坐标
        Debug.Log("当前UI的局部坐标" + contentRectTrans.localPosition);
        //当前UI的宽度（从左到右的长度）
        //Debug.Log("当前UI的宽度"+contentRectTrans.rect.right);
        Debug.Log("当前UI的宽度" + contentRectTrans.rect.xMax);
        Debug.Log("当前UI的宽度" + contentRectTrans.rect.width);

        //当前UI的左坐标
        Debug.Log("当前ui的左坐标" + contentRectTrans.rect.x);

        //当前UI的高度
        Debug.Log("当前ui的高度" + contentRectTrans.rect.height);

        //这里要注意，他只是当前transform 的x轴的方向
        //就像是transform。right自身方向的右边
        Debug.Log("当前ui的左坐标" + contentRectTrans.right);

        //当前UI底部相对于顶部的相对长度，负数为向下延展，同理则反
        Debug.Log(contentRectTrans.rect.y);

        //当前UI的宽高
        Debug.Log(contentRectTrans.sizeDelta);
        Debug.Log(contentRectTrans.sizeDelta.x);
        Debug.Log(contentRectTrans.sizeDelta.y);


        //以下为常用API
        //宽度应该是我们想要增加的值
        contentRectTrans.sizeDelta = new Vector2(200,178);
        //水平滚动位置为0到1的值，0为左边，1为右边
        scrollRect.horizontalNormalizedPosition = 1;
        //拖动事件注册
        scrollRect.onValueChanged.AddListener(PrintValue);
    }

    
    private void PrintValue(Vector2 vector2)
    {
        Debug.Log("传递出来的参数值" + vector2);
    }
    }

直接把代码挂到scrollview上，可以看到其对应属性在这里插入图片描述
得注意的是content宽高决定了可拖拽的范围。如果超过范围就拖不到最后的元素。

Unity Scroll View简单介绍和使用

Unity Scroll View简单介绍

猜你喜欢