Unity控制項ScrollView使用問題記錄

來源:互聯網
上載者:User

標籤:enum   date   也會   osi   節點   ctc   mono   組件   list   

Unity版本:5.6.2

控制項Scroll View由4部分組成,

1.含有Scroll Rect組件的根節點:Scroll View

2.含有Mask組件的節點:Viewport

3.所有內容的父節點Content,常含有布局控制項

4.捲軸,包括橫向和縱向

具體的節點細節使用可以參看官方文檔:
https://docs.unity3d.com/560/Documentation/Manual/script-ScrollRect.html

 

使用時遇到的問題記錄:

1.顯示地區怎麼控制?
節點Scroll View中的組件Rect Transform的Width和Height控制著整個地區大小,組件Scroll Rect的捲軸設定也會影響顯示地區的邊界位置是否完整;

節點Viewport的組件Image中的Image Type屬性會影響顯示的地區;

節點Content的組件Rect Transform的布局和寬高影響了顯示的地區。

2.如何去掉捲軸?

節點Scroll View中的組件Scroll Rect中的屬性Horizontal Scrollbar和Vertical Scrollbar設定為None,並將其子節點Scrollbar Horizontal和Scrollbar Vertical刪除。

3.內容如何布局?

在節點Content中加入對應的布局組件即可。

4.出現無法滑動或者自動回彈到原地方的原因?

如果節點Content的寬度或者高度小於實際內容的寬度或者高度時,就會發生這樣的情況。這時需要調整Content的寬高,或者加入組件Content Size Fitter把對應方向設定為Preferred Size來自適應寬高。

5.滑動結束後,往往不能把當前的元素的畫面完整顯示的情況,如何解決?

這種情況需要給節點Scroll View掛載指令碼來實現,指令碼:ScrollRectCenterChild.cs代碼如下:

注意:Content節點的RectTransform組件中的Pivot屬性必須設定為0,1

Content節點的布局方式可以是Vertical Layout Group、Horizontal Layout Group 或者 Grid Layout Group,但都只支援一個方向的滑動置中。

using System.Collections;using System.Collections.Generic;using UnityEngine;using UnityEngine.UI;using UnityEngine.EventSystems;using System;public enum ScrollDir{    Horizontal,    Vertical}public class ScrollRectCenterChild : MonoBehaviour,IEndDragHandler,IDragHandler,IBeginDragHandler{    public ScrollDir Dir = ScrollDir.Vertical;    private bool _isCentering = false;    public float MoveToCenterSpeed = 10f;    private ScrollRect _scrollView;    private Transform _content;    //用於儲存子項目的座標值    private List<float> _childrenPos = new List<float>();    private float _targetPos;    private int _curCenterChildIndex = -1;    public GameObject CurCenterChildItem    {        get        {            GameObject centerChild = null;            if (_content != null && 0 <= _curCenterChildIndex && _curCenterChildIndex < _content.childCount)            {                centerChild = _content.GetChild(_curCenterChildIndex).gameObject;            }            return centerChild;        }    }    private float GetChildItemWidth(int index)    {        return (_content.GetChild(index) as RectTransform).sizeDelta.x;    }    private float GetChildItemHeight(int index)    {        return (_content.GetChild(index) as RectTransform).sizeDelta.y;    }    void Awake()    {        _scrollView = GetComponent<ScrollRect>();        if (null == _scrollView)        {            Debug.LogError("ScrollRect is null.");            return;        }        _content = _scrollView.content;        LayoutGroup layoutGroup = null;        layoutGroup = _content.GetComponent<LayoutGroup>();        if (null == layoutGroup)        {            Debug.LogError("LayoutGroup comment is null.");            return;        }        float spacing = 0f;        switch (Dir)        {            case ScrollDir.Horizontal:                float scrollViewRectWidth = _scrollView.GetComponent<RectTransform>().rect.width;                if (layoutGroup is HorizontalLayoutGroup)                {                    float childPosX = scrollViewRectWidth * 0.5f - GetChildItemWidth(0) * 0.5f;                    _childrenPos.Add(childPosX);                    spacing = (layoutGroup as HorizontalLayoutGroup).spacing;                    for (int i = 1; i < _content.childCount; i++)                    {                        childPosX -= GetChildItemWidth(i) * 0.5f + GetChildItemWidth(i - 1) * 0.5f + spacing;                        _childrenPos.Add(childPosX);                    }                }                else if (layoutGroup is GridLayoutGroup)                {                    GridLayoutGroup grid = layoutGroup as GridLayoutGroup;                    float childPosX = scrollViewRectWidth * 0.5f - grid.cellSize.x * 0.5f;                    _childrenPos.Add(childPosX);                    for (int i = 1; i < _content.childCount; i++)                    {                        childPosX -= grid.cellSize.x + grid.spacing.x;                        _childrenPos.Add(childPosX);                    }                }                else                {                    Debug.LogError("Horizontal ScrollView is using VerticalLayoutGroup.");                }                break;            case ScrollDir.Vertical:                float scrollViewRectHeight = _scrollView.GetComponent<RectTransform>().rect.height;                if (layoutGroup is VerticalLayoutGroup)                {                    float childPosY = scrollViewRectHeight * 0.5f - GetChildItemHeight(0) * 0.5f;                    _childrenPos.Add(childPosY);                    spacing = (layoutGroup as VerticalLayoutGroup).spacing;                    for (int i = 1; i < _content.childCount; i++)                    {                        childPosY += GetChildItemHeight(i) * 0.5f + GetChildItemHeight(i - 1) * 0.5f + spacing;                        _childrenPos.Add(childPosY);                    }                }                else if (layoutGroup is GridLayoutGroup)                {                    GridLayoutGroup grid = layoutGroup as GridLayoutGroup;                    float childPosY = scrollViewRectHeight * 0.5f - grid.cellSize.y * 0.5f;                    _childrenPos.Add(childPosY);                    for (int i = 1; i < _content.childCount; i++)                    {                        childPosY += grid.cellSize.y + grid.spacing.y;                        _childrenPos.Add(childPosY);                    }                }                else                {                    Debug.LogError("Vertical ScrollView is using HorizontalLayoutGroup.");                }                break;        }    }    void Update()    {        if (_isCentering)        {            Vector3 v = _content.localPosition;            switch (Dir)            {                case ScrollDir.Horizontal:                    v.x = Mathf.Lerp(_content.localPosition.x, _targetPos, MoveToCenterSpeed * Time.deltaTime);                    _content.localPosition = v;                    if (Math.Abs(_content.localPosition.x - _targetPos) < 0.01f)                    {                        _isCentering = false;                    }                    break;                case ScrollDir.Vertical:                    v.y = Mathf.Lerp(_content.localPosition.y, _targetPos, MoveToCenterSpeed * Time.deltaTime);                    _content.localPosition = v;                    if (Math.Abs(_content.localPosition.y - _targetPos) < 0.01f)                    {                        _isCentering = false;                    }                    break;            }        }    }    public void OnDrag(PointerEventData eventData)    {            }    public void OnEndDrag(PointerEventData eventData)    {        switch (Dir)        {            case ScrollDir.Horizontal:                _targetPos = FindClosestChildPos(_content.localPosition.x, out _curCenterChildIndex);                break;            case ScrollDir.Vertical:                _targetPos = FindClosestChildPos(_content.localPosition.y, out _curCenterChildIndex);                break;        }        _isCentering = true;    }    public void OnBeginDrag(PointerEventData eventData)    {        _isCentering = false;        _curCenterChildIndex = -1;    }    private float FindClosestChildPos(float currentPos, out int curCenterChildIndex)    {        float closest = 0;        float distance = Mathf.Infinity;        curCenterChildIndex = -1;        for (int i = 0; i < _childrenPos.Count; i++)        {            float p = _childrenPos[i];            float d = Mathf.Abs(p - currentPos);            if (d < distance)            {                distance = d;                closest = p;                curCenterChildIndex = i;            }        }        return closest;    }}

改完之後的效果:

 

            您的打賞是對我的最大支援和肯定         

 

Unity控制項ScrollView使用問題記錄

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.