UGUI ScrollRect滑动居中CenterOnChild实现
NGUI有一个UICenterOnChild脚本,可以轻松实现ScrollView中拖动子物体后保持一个子物体位于中心位置。然而UGUI就没这么方便了,官方并没有类似功能的脚本。网上找到一些运行效果都不对,可能因为UGUI需要配置的东西太多,RectTransfrom不同设置效果就不一样。故自己实现了该功能,使用时的配置如下:
1. 仅适用于水平方向拖动的ScrollRect。
2. ScrollRect中的Grid必须使用GridLayoutGroup。
3. 由于需要知道ScrollRect的宽度以便计算中心位置,故ScrollRect的Anchors的四个小三角中的上面或者下面的一对角不得分离,不然宽度计算出错,即需要:Anchors.Min.x == Anchors.Max.x。最好四角合一。
4. 由于是通过设置ScrollRect's content的localPosition实现,故需要将ScrollRect的中心点Pivot与content的中心点均置于自身最左边(0, 0.5)。
5. 由于第一个与最后一个子物体需要停留在中间,故ScrollRect的Movement Type需要设置为Unrestricted。该项会在运行时自动设置。
代码如下:
/// <summary>
///
/// 拖动ScrollRect结束时始终让一个子物体位于中心位置。
///
/// </summary>
public class CenterOnChild : MonoBehaviour, IEndDragHandler, IDragHandler
{
//将子物体拉到中心位置时的速度
public float centerSpeed = 9f; //注册该事件获取当拖动结束时位于中心位置的子物体
public delegate void OnCenterHandler (GameObject centerChild);
public event OnCenterHandler onCenter; private ScrollRect _scrollView;
private Transform _container; private List<float> _childrenPos = new List<float> ();
private float _targetPos;
private bool _centering = false; void Awake ()
{
_scrollView = GetComponent<ScrollRect> ();
if (_scrollView == null)
{
Debug.LogError ("CenterOnChild: No ScrollRect");
return;
}
_container = _scrollView.content; GridLayoutGroup grid;
grid = _container.GetComponent<GridLayoutGroup> ();
if (grid == null)
{
Debug.LogError ("CenterOnChild: No GridLayoutGroup on the ScrollRect's content");
return;
} _scrollView.movementType = ScrollRect.MovementType.Unrestricted; //计算第一个子物体位于中心时的位置
float childPosX = _scrollView.GetComponent<RectTransform> ().rect.width * 0.5f - grid.cellSize.x * 0.5f;
_childrenPos.Add (childPosX);
//缓存所有子物体位于中心时的位置
for (int i = ; i < _container.childCount - ; i++)
{
childPosX -= grid.cellSize.x + grid.spacing.x;
_childrenPos.Add (childPosX);
}
} void Update ()
{
if (_centering)
{
Vector3 v = _container.localPosition;
v.x = Mathf.Lerp (_container.localPosition.x, _targetPos, centerSpeed * Time.deltaTime);
_container.localPosition = v;
if (Mathf.Abs (_container.localPosition.x - _targetPos) < 0.01f)
{
_centering = false;
}
}
} public void OnEndDrag (PointerEventData eventData)
{
_centering = true;
_targetPos = FindClosestPos (_container.localPosition.x);
} public void OnDrag (PointerEventData eventData)
{
_centering = false;
} private float FindClosestPos (float currentPos)
{
int childIndex = ;
float closest = ;
float distance = Mathf.Infinity; for (int i = ; i < _childrenPos.Count; i++)
{
float p = _childrenPos[i];
float d = Mathf.Abs (p - currentPos);
if (d < distance)
{
distance = d;
closest = p;
childIndex = i;
}
} GameObject centerChild = _container.GetChild (childIndex).gameObject;
if (onCenter != null)
onCenter (centerChild); return closest;
}
}
由于已缓存所有子物体的位置信息,故该代码简单修改可以扩展功能,如增加到上一项、到下一项、跳转到指定项等功能。
UGUI ScrollRect滑动居中CenterOnChild实现的更多相关文章
- UGUI ScrollRect 滑动
运行环境 Unity3D 5.3.7 p4 在我之前的博客中,写过一些Unity4.6的UGUI,现这篇是基于Unity 5.3的 推荐结构 推荐使用三层来组织,如下所示: ScrollRect :S ...
- 横向滑动页面,导航条滑动居中的 js 实现思路
最近在做新闻咨询页的项目,各个新闻频道通过横向滑动切换,顶部的导航active栏需要跟着切换到对应频道,并且active到达中部时,要一直处在中间. 类似效果就是uc浏览器<UC头条>的导 ...
- [unity]UGUI界面滑动,ScrollRect嵌套滑动
原因:老板蛋痛,让我去抄皇室战争. 思路:我大概知道ngui(后来改成UGUI的)里面有个ScrollView.于是我就想一个横着的SV加上5个竖的SV不就好了吗. 过程: 于是 但是有个问题就是UI ...
- UGUI ScrollRect 鼠标滑动灵敏度调节
- [Unity UGUI]ScrollRect效果大全
UGUI各种优化效果 本文所实现的UGUI效果需求如下: - 支持缩放滑动效果 - 支持动态缩放循环加载 - 支持大数据固定Item复用加载 - 支持不用Mask遮罩无限循环加载 - 支持Object ...
- UICollectionView 图片横向滑动居中偏移量的解决
1.在使用UICollectionView 来显示横向滑动图片的时候,cell与cell之间有间隙,每次滑动后cell都会向左偏移,在使用过这两个方法才解决每次向左偏移的部分. 2.使用方法前不要开启 ...
- UGUI ScrollRect 性能优化
测试环境 操作系统:Windows8.1 开发工具:Unity5.5.2 1.问题描述,在实际开发过程中经常会使用ScrollRect实现滚动列表,当初次加载数据比较多的情形时,Unity3D会出现比 ...
- UGUI 分页渐变居中效果
代码相当冗长,仅作自己记录 在此分页上修改的https://blog.csdn.net/qinyuanpei/article/details/49781133 using UnityEngine;us ...
- UGUI ScrollRect 各参数的代码引用以及作用
随机推荐
- XP,32/64位Win7,32/64位Win10系统【电脑城版】
本系统是10月最新完整版本的Windows10 安装版镜像,Win10正式版,更新了重要补丁,提升应用加载速度,微软和百度今天宣布达成合作,百度成为Win10 Edge浏览器中国默认主页和搜索引擎,系 ...
- 【题解】P2602[JZOI2010]数字计数
[题解][P2602ZJOI2010]数字计数 乍看此题,感觉直接从数字的位上面动手,感觉应该很容易. 但是仔细看数据范围,发现如果不利用计数原理,肯定会超时,考虑数码出现的特征: \(A000\)到 ...
- SAP 第四代增强-BTE
第四代BTE实例详解:http://blog.csdn.net/wbin9752/article/details/7954922 第三代增强(BADI实例详解) :http://blog.csdn.n ...
- 添加@ControllerAdvice后报错 Failed to invoke @ExceptionHandler method
首先.单独使用ControllerAdvice 无法正常工作.需要配合@EnableWebMvc 使用. @ControllerAdvice @EnableWebMvc pulbic class Ex ...
- 【python】使用python写windows服务
背景 运维windows服务器的同学都知道,windows服务器进行批量管理的时候非常麻烦,没有比较顺手的工具,虽然saltstack和ansible都能够支持windows操作,但是使用起来总感觉不 ...
- String源码中hashCode算法
针对java中String源码hashcode算法源码分析 /** The value is used for character storage. */ private final char val ...
- Delphi编写WebService体会
源:Delphi编写WebService体会 Dispatch: 派遣,分派 Invoke: 调用 Invokable: 可调用接口 TReomtable: WebService中自定义类都是继承自该 ...
- 笔记 jsp/ajax/js/jquery/html5/css+div->table
1. jsp 1).jsp(39,33) equal symbol expected: 这个异常是说第39行有 " '( 冒号单引号)问题 2)${map[key]} map和key换 ...
- ActiveMQ之点对点使用
package com.toov5.producer; import javax.jms.Connection; import javax.jms.JMSException; import javax ...
- 尚学堂xml学习笔记
1.打开eclipse,文件-新建java project,输入文件的名字,比如输入20181112. 2.对着src右键,选择new-file,输入文件名字,比如:book.xml. 3.开始写.x ...