UGUI之UI组件ScrollRect卷动区域

一.ScrollRect 组件介绍

1.ScrollRect：卷动区域。 “卷动区域”是在ScrollBar 的基础之上延伸出来的UI 界面效果。 单独是ScrollBar 组件是无意义的，需要结合ScrollRect 才能真正实现功能。 2.ScrollRect 组成部分分析 ScrollRect Image [核心组件，背景图片] |—Mask Image [遮罩，用于遮罩的图片] |—空物体[用于卷动显示的数据] |—横向卷动条[ScrollBar 游戏物体] |—纵向卷动条[ScrollBar 游戏物体 [

](http://www.wjgbaby.com/wp-content/uploads/2017/11/17112803-300x165.jpg)

3.ScrollRect 多种展现形态 无卷动条：当数据区域的数据量没有超过Mask 范围的时候； 纵向卷动条：当数据量纵向比较多的时候； 横向卷动条：当数据量横向比较多的时候。

二.ScrollRect 组件属性

1.基本控制属性 Content：ScrollRect 控制的数据区域； Horizontal：控制数据是否可以横向拖动； Vertical：控制数据是否可以纵向拖动； Movement Type：三种运动类型；[不限制– 弹性– 不动] 2.引用控制属性 Viewport：视口区域的引用； Scrollbar：Scrollbar 游戏物体的引用； Visibilty：卷动条的清晰度，保持默认即可[第三个]； Spacing：控制卷动条和数据区域之间的间距。 [

](http://www.wjgbaby.com/wp-content/uploads/2017/11/17112804-279x300.png)

三.ScrollRect 事件绑定

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

public class tempUGUI : MonoBehaviour {

private ScrollRect m\_ScrollRect;
void Start () {
    m\_ScrollRect = gameObject.GetComponent<ScrollRect>();
    m\_ScrollRect.onValueChanged.AddListener(ScrollRectValueChange);
}

private void ScrollRectValueChange(Vector2 value){
    Debug.Log(value.x+"  "+value.y);
}

}