UGUI ScrollRect滑动定位优化详解

UGUI的滑动组件虽然表现上和NGUI的ScrollView一致，但是它更美好的是开放源码的，不了解原理的时候直接查源码就OK。

在使用ScrollRect的时候，想滑动流畅然后定位，既待惯性的滚动设置，如图MovementType指定为Elastic则为带惯性的滑动模式，同时调整Inertia为惯性系数，值越大则惯性表现越大，即滑动手离开后自由滑动到停止所需的时间也越长。Inertia=0时则表示不带惯性，滑动时手离开 滑动即停止。

但是我们既然要用这个组件就是希望它在实现功能的时候体验良好，排除特殊需求，我们当然不希望它一直滚动下去，该停的时候就停，但是如果你检查ScrollRect的源码或直接将滑动中的滚动区坐标变化情况打印出来会发现这个坐标刷新耗时太久了，带惯性的滚动滑动一下就要刷新2甚至更长，坐标变化才会完全结束，如果真等他自然结束我们再做一些如“定位”的操作，真的耗时太长了。因此我想优化一下带惯性的滑动，比如显示它不要自由滑动那么久，加入一个限制时间，比如手离开多长时间就停止滑动。
ScrollRectMe组件在ScrollRect的基础上又增加了两个属性，inertiaMaxTime最大自由滑动的时间和滑动完全结束的事件stopScrollCallback，因为带惯性滚动时OnDrag事件并不能满足需求，那仅仅是手离开就会响应的事件。

2017-6-27更新补充了一下滑动幅度不大的时候或惯性时间都不足设定值inertiaMaxTime 不回调的问题。

最后附上源码：

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;
using System;

public class ScrollRectMe : ScrollRect
{
 [SerializeField]
 public float inertiaMaxTime = 0.5f;//限制惯性持续时间

 public Action<GameObject > stopScrollCallback = null;//滑动结束的回调

 private float _scrolledTime = 0f;
 private Action<GameObject> _stopScrollCallback = null;

 private Vector2 _lastPostion = Vector2.zero;

 public override void OnEndDrag(PointerEventData eventData)
 {
 base.OnEndDrag(eventData);
 _stopScrollCallback = stopScrollCallback;
 _scrolledTime = 0f;
 _lastPostion = Vector2.zero;
 }

 public override void OnDrag(PointerEventData eventData)
 {
 base.OnDrag(eventData);
 _scrolledTime = 0f;
 _lastPostion = Vector2.zero;
 }

 public override void StopMovement()
 {
 base.StopMovement();
 }

 protected override void LateUpdate()
 {
 // base.LateUpdate();
 }

 private void Update()
 {
 base.LateUpdate();
 }

 protected override void SetContentAnchoredPosition(Vector2 position)
 {
 //2017-6-27 修改补充条件
 if (_scrolledTime >= inertiaMaxTime || (position.ToString("0.0") == _lastPostion.ToString("0.0")))
 {
 if (_stopScrollCallback != null)
 {
 _stopScrollCallback(transform.gameObject);
 _stopScrollCallback = null;
 }
 _scrolledTime = inertiaMaxTime;
 return;
 }

 base.SetContentAnchoredPosition(position);

 _scrolledTime += Time.unscaledDeltaTime;
 _lastPostion = position;
 }
}

下载地址：ScrollRect优化链接

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • UGUI ScrollRect滑动定位优化详解

    UGUI的滑动组件虽然表现上和NGUI的ScrollView一致,但是它更美好的是开放源码的,不了解原理的时候直接查源码就OK. 在使用ScrollRect的时候,想滑动流畅然后定位,既待惯性的滚动设置,如图MovementType指定为Elastic则为带惯性的滑动模式,同时调整Inertia为惯性系数,值越大则惯性表现越大,即滑动手离开后自由滑动到停止所需的时间也越长.Inertia=0时则表示不带惯性,滑动时手离开 滑动即停止. 但是我们既然要用这个组件就是希望它在实现功能的时候体验良好,

  • Android 实现锚点定位思路详解

    Android 实现锚点定位思路详解

    相信做前端的都做过页面锚点定位的功能,通过<a href="#head" rel="external nofollow" > 去设置页面内锚点定位跳转. 本篇文章就使用tablayout.scrollview来实现android锚点定位的功能. 效果图: 实现思路 1.监听scrollview滑动到的位置,tablayout切换到对应标签 2.tablayout各标签点击,scrollview可滑动到对应区域 自定义scrollview 因为我们需要监听

  • ios开发UITableViewCell图片加载优化详解

    目录 前言 图片自适应比例 XHWebImageAutoSize 仅加载当前屏幕的内容 预加载 前言 我们平时用UITableView用的很多,所以对列表的优化也是很关注的.很多时候,我们设置UIImageView,都是比例固定好宽高的,然后通过 scaleAspectFill 和 clipsToBounds 保持图片不变形,这样子做开发的效率是很高的,毕竟图片宽高我们都是固定好的了. 那如果产品要求图片按真正的比例展示出来呢?如果服务器有返回宽和高,那就好办了,那如果没有呢,我们应该怎么去做呢

  • 关于MySQL查询语句的优化详解

    目录 MySQL 优化 子查询优化 待排序的分页查询的优化 给排序字段添加索引 给排序字段跟 select 字段添加复合索引 给排序字段加索引 + 手动回表 解决办法 排序优化 MySQL 优化 子查询优化 将子查询改变为表连接,尤其是在子查询的结果集较大的情况下: 添加复合索引,其中复合索引的包含的字段应该包括 where 字段与关联字段: 复合索引中的字段顺序要遵守最左匹配原则: MySQL 8 中自动对子查询进行优化: 现有两个表 create table Orders ( id inte

  • spring Boot与Mybatis整合优化详解

    SpringBoot官方文档http://docs.spring.io/spring-boot/docs/current/reference/htmlsingle/ 关于spring-boot与mybatis整合优化方面的介绍,就是Mybatis-Spring-boot-starter的介绍: 1.取消spring-mybatis.xml配置 ①自动检测已存在的Datasource 之前,需要在spring-mybatis.xml中配置datasource的Bean,现在只需要在applicat

  • Python selenium 父子、兄弟、相邻节点定位方式详解

    今天跟大家分享下selenium中根据父子.兄弟.相邻节点定位的方法,很多人在实际应用中会遇到想定位的节点无法直接定位,需要通过附近节点来相对定位的问题,但从父节点定位子节点容易,从子节点定位父节点.定位一个节点的哥哥节点就一筹莫展了,别急,且看博主一步步讲解. 1. 由父节点定位子节点 最简单的肯定就是由父节点定位子节点了,我们有很多方法可以定位,下面上个例子: 对以下代码: <html> <body> <div id="A"> <!--父节

  • 基于Tomcat安全配置与性能优化详解

    Tomcat 是 Apache软件基金会下的一个免费.开源的WEB应用服务器,它可以运行在 Linux 和 Windows 等多个平台上,由于其性能稳定.扩展性好.免费等特点深受广大用户喜爱.目前,很多互联网应用和企业应用都部署在 Tomcat 服务器上,比如我们公司,哈. 之前我们 tomcat 都采用的是默认的配置,因此在安全方面还是有所隐患的.上周对测试环境的所有服务器的tomcat都做了安全优化,其间也粗略做了一些性能优化,这里就简单记录分享下! 一.版本安全 升级当前的tomcat版本

  • 基于Python中单例模式的几种实现方式及优化详解

    单例模式 单例模式(Singleton Pattern)是一种常用的软件设计模式,该模式的主要目的是确保某一个类只有一个实例存在.当你希望在整个系统中,某个类只能出现一个实例时,单例对象就能派上用场. 比如,某个服务器程序的配置信息存放在一个文件中,客户端通过一个 AppConfig 的类来读取配置文件的信息.如果在程序运行期间,有很多地方都需要使用配置文件的内容,也就是说,很多地方都需要创建 AppConfig 对象的实例,这就导致系统中存在多个 AppConfig 的实例对象,而这样会严重浪

  • 基于js文件加载优化(详解)

    在js引擎部分,我们可以了解到,当渲染引擎解析到script标签时,会将控制权给JS引擎,如果script加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. 放置在BODY底部 为了让渲染引擎能够及早的将DOM树给渲染出来,我们需要将script放在body的底部,让页面尽早脱离白屏的现象,即会提早触发DOMContentLoaded事件. 但是由于在IOS Safari, Android browser以及IOS webview里面即使你把js脚本放到

  • 对vux点击事件的优化详解

    Vux是基于Vue和WeUI的组件库.对于应用vux的项目因为点击绑定的是click事件,自然也存在移动端300ms延迟现象.我们可以用fastclick库来解决这个问题,具体步骤如下: 这里以vue+webpack项目目录为例: 1.打开node控制台,切换到自己的项目目录 2.npm安装fastclick,并将版本信息写入本地packpage.json文件 3.下载成功后,在node_modules目录下可以看见fastclick库文件夹,且在packpage.json文件里可以看见: 4.

随机推荐