Unity SnapScrollRect 滚动 匹配 列表 整页

news2024/11/26 22:27:06

展示效果


原理:

当停止滑动时

判断Contet的horizontalNormalizedPosition

与子Item的缓存值 相减,并得到最小值,然后将Content  horizontalNormalizedPosition滚动过去

使用方式:

直接将脚本挂到ScrollRect上

注意:在创建Content子物体时 或子物体数量变更,需要调用Refresh

代码:

namespace ShangShangQian.Component
{
    using System.Collections;
    using System.Collections.Generic;
    using UnityEngine;
    using UnityEngine.UI;
    using UnityEngine.EventSystems;
    using System.Linq;
    using UnityEngine.Events;

    [RequireComponent(typeof(ScrollRect))]
    public class SnapScrollRect : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler
    {
        private RectTransform content;
        private ScrollRect rect;

        /// <summary>
        /// content 的位置应该滚到什么
        /// </summary>
        public float target = 1;

        /// <summary>
        /// 回滚的速度 0-1 越小越快
        /// </summary>
        public float smooting = 0.25f;
        public float currentVelocity;

        public float horizontalNormalizedPosition;

        public List<float> values = new List<float>();
        public List<float> distances = new List<float>();
        public List<RectTransform> items = new List<RectTransform>();

        /// <summary>
        /// 是否拖拽中
        /// </summary>
        public bool isDrag = false;

        /// <summary>
        /// 到最近item的距离
        /// </summary>
        public float distanceMin;

        /// <summary>
        /// 到最近item的索引
        /// </summary>
        public int selectIndex;

        /// <summary>
        /// 是否匹配滑动中
        /// </summary>
        public bool Snaping = false;

        /// <summary>
        /// 回滚完毕后调用
        /// </summary>
        public UnityEvent<int> OnSnap;

        void Start()
        {
            rect = GetComponent<ScrollRect>();
            content = rect.content;
        }

        /// <summary>
        /// 刷新数据,content的子物体数量变更时需要调用此函数
        /// </summary>
        public void Refresh()
        {
            items.Clear();
            values.Clear();
            for (int i = 0; i < content.childCount; i++)
            {
                if (content.GetChild(i).gameObject.activeInHierarchy)
                {
                    items.Add(content.GetChild(i).GetComponent<RectTransform>());
                }
            }

            //累加的变量
            values.Add(0);
            //每一个格子的所占比多少  
            float v = 1f / (items.Count - 1);
            for (int i = 1; i < items.Count; i++)
            {
                values.Add(i * v);
            }

            //不同子元素数量 item 对应 的content  horizontalNormalizedPosition 数值
            //1  0  
            //2  0 1   
            //3  0 0.5 1
            //4  0 0.33 0.66 1
        }

        void Update()
        {
#if UNITY_EDITOR
            if (Input.GetKeyDown(KeyCode.A))
            {
                Refresh();
            }
#endif
        }

        void FixedUpdate()
        {
            horizontalNormalizedPosition = rect.horizontalNormalizedPosition;

            if (isDrag)
            {
                return;
            }

            if (Snaping)
            {
                rect.horizontalNormalizedPosition = Mathf.SmoothDamp(rect.horizontalNormalizedPosition, target, ref currentVelocity, smooting);
                if (Mathf.Abs(rect.horizontalNormalizedPosition - values[selectIndex]) < 0.001f)
                {
                    Snaping = false;
                    Debug.Log("回滚:" + selectIndex);
                    OnSnap.Invoke(selectIndex);
                }
            }

        }

        public void OnBeginDrag(PointerEventData eventData)
        {
            isDrag = true;
        }

        public void OnDrag(PointerEventData eventData)
        {
            isDrag = true;
        }

        public void OnEndDrag(PointerEventData eventData)
        {
            isDrag = false;

            Snaping = true;

            distances.Clear();

            //当松手后判断那个距离最近
            for (int i = 0; i < values.Count; i++)
            {
                distances.Add(Mathf.Abs(rect.horizontalNormalizedPosition - values[i]));
            }

            distanceMin = distances.Min();

            selectIndex = distances.FindIndex(b => b == distanceMin);
            target = values[selectIndex];
            rect.StopMovement();
        }


        /// <summary>
        /// 滚到到指定位置
        /// </summary>
        /// <param name="index"></param>
        public void SnapToIndex(int index)
        {
            Snaping = true;
            selectIndex = index;
            target = values[selectIndex];
        }
    }
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1399790.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

蓝桥杯练习题(十二)

&#x1f4d1;前言 本文主要是【算法】——蓝桥杯练习题&#xff08;十二&#xff09;的文章&#xff0c;如果有什么需要改进的地方还请大佬指出⛺️ &#x1f3ac;作者简介&#xff1a;大家好&#xff0c;我是听风与他&#x1f947; ☁️博客首页&#xff1a;CSDN主页听风与他…

list下

文章目录 注意&#xff1a;const迭代器怎么写&#xff1f;运用场合&#xff1f; inserterase析构函数赋值和拷贝构造区别&#xff1f;拷贝构造不能写那个swap,为什么&#xff1f;拷贝构造代码 面试问题什么是迭代器失效&#xff1f;vector、list的区别&#xff1f; 完整代码 注…

微信公众号服务器配置启用, Java示例

微信公众号接入指南文档https://developers.weixin.qq.com/doc/offiaccount/Basic_Information/Access_Overview.html 在微信公众号的服务器配置中&#xff0c;首先需要编写Java代码来处理微信服务器的验证请求。以下是Java示例代码&#xff0c;然后我将为你提供启用服务器配置…

centos7安装Redis7.2.4

文章目录 下载Redis解压Redis安装gcc依赖&#xff08;Redis是C语言编写的&#xff0c;编译需要&#xff09;编译安装src目录下二进制文件安装到/usr/local/bin修改redis.conf文件启动redis服务外部连接测试 参考&#xff1a; 在centos中安装redis-5.0.7 Memory overcommit must…

记录一下uniapp 集成腾讯im特别卡(未解决)

uniapp的项目运行在微信小程序 , 安卓 , ios手机三端 , 之前这个项目集成过im,不过版本太老了,0.x的版本, 现在需要添加客服功能,所以就升级了 由于是二开 , 也为了方便 , 沿用之前的webview嵌套腾讯IM的方案 , 选用uniapp集成ui ,升级之后所有安卓用户反馈点击进去特别卡,几…

华为FusionStorage Block、OceanStor 100D、OceanStor pacific的区别

华为FusionStorage Block、OceanStor 100D、OceanStor pacific的区别&#xff1f; 华为块存储到底是叫什么呢&#xff1f; 有接触过华为块存储产品的小伙伴肯定都有疑惑&#xff0c;在FusionStorage 、FusionStorage Block、OceanStor 100D、OceanStor pacific等等的名词中&a…

基于SpringBoot Vue高校失物招领系统

大家好✌&#xff01;我是Dwzun。很高兴你能来阅读我&#xff0c;我会陆续更新Java后端、前端、数据库、项目案例等相关知识点总结&#xff0c;还为大家分享优质的实战项目&#xff0c;本人在Java项目开发领域有多年的经验&#xff0c;陆续会更新更多优质的Java实战项目&#x…

自然语言推断:注意力之注意(Attending)

注意&#xff08;Attending&#xff09; 第一步是将一个文本序列中的词元与另一个序列中的每个词元对齐。假设前提是“我确实需要睡眠”&#xff0c;假设是“我累了”。由于语义上的相似性&#xff0c;我们不妨将假设中的“我”与前提中的“我”对齐&#xff0c;将假设中的“累…

【复现】Apache Solr信息泄漏漏洞_24

目录 一.概述 二 .漏洞影响 三.漏洞复现 1. 漏洞一&#xff1a; 四.修复建议&#xff1a; 五. 搜索语法&#xff1a; 六.免责声明 一.概述 Apache Solr是一个独立的企业级搜索应用服务器&#xff0c;它对外提供类似于Web-service的API接口。用户可以通过http请求&#x…

《Python数据分析技术栈》第03章 03 可视化各级数据(Visualizing various levels of data)

03 可视化各级数据&#xff08;Visualizing various levels of data&#xff09; 《Python数据分析技术栈》第03章 03 可视化各级数据&#xff08;Visualizing various levels of data&#xff09; Whenever you need to analyze data, first understand if the data is stru…

Node.JS CreateWriteStream(大容量写入文件流优化)

Why I Need Node.JS Stream 如果你的程序收到以下错误&#xff0c;或者需要大容量写入很多内容(几十几百MB甚至GB级别)&#xff0c;则必须使用Stream文件流甚至更高级的技术。 Error: EMFILE, too many open files 业务场景&#xff0c;我们有一个IntradayMissingRecord的补…

网络数据传输过程

先验知识&#xff1a;OSI模型 OSI网络模型实际上是参考模型&#xff0c;在实际中并不使用&#xff0c;在网络出现问题的时候&#xff0c;可以从一个宏观的整体去分析和解决问题&#xff0c;而且搭建网络的时候并不需要划分为7层&#xff0c;当今互联网广泛使用的是TCP/IP网络模…

Leetcode 2788. 按分隔符拆分字符串

我们可以先自己模拟一下分隔字符串的过程。如果只是简单的&#xff0c;遇到分隔符&#xff0c;将分隔符前后的子串加入结果的List&#xff0c;那么很显然并没有考虑到一个String中有多个字符串的情况。一种比较容易想到的方法是&#xff1a; 先对List中每个字符串遍历&#xf…

Docker-Confluence部署记录

启动 docker container run -v $(pwd):/var/atlassian/application-data/confluence/ --nethost -d --nameconfluence_720_20240120 confluence/confluence:7.2.0新建mysql数据库 导入破解包 atlassian-agent 参考-Confluence 破解方式&#xff08;Linux&#xff09; 按流程破…

设计模式-资源库模式

设计模式专栏 模式介绍模式特点应用场景资源库模式与关系型数据库的区别代码示例Java实现资源库模式Python实现资源库模式 资源库模式在spring中的应用 模式介绍 资源库模式是一种架构模式&#xff0c;介于领域层与数据映射层&#xff08;数据访问层&#xff09;之间。它的存在…

Spring Boot 3.2.2整合MyBatis-Plus 3.5.5依赖不兼容问题

问题演示 导依赖 当你启动项目就会 抛出该异常 java.lang.IllegalArgumentException: Invalid value type for attribute factoryBeanObjectType: java.lang.String 问题原因 mybatis-plus 中 mybatis 的整合包版本不够导致的 解决方案 排除掉mybatis-plus 中 mybatis 的整合…

k8s 使用cert-manager证书管理自签

个人建议使用安装更快&#xff0c;比helm快&#xff0c;还要等待安装crd kubectl apply -f https://github.com/cert-manager/cert-manager/releases/download/v1.13.3/cert-manager.yaml#官网 https://cert-manager.io/docs/installation/kubectl/#创建自签的ClusterIssuer c…

基于YOLOv8的学生课堂行为检测,引入BRA注意力和Shape IoU改进提升检测能力

&#x1f4a1;&#x1f4a1;&#x1f4a1;本文摘要&#xff1a;介绍了学生课堂行为检测&#xff0c;并使用YOLOv8进行训练模型&#xff0c;以及引入BRA注意力和最新的Shape IoU提升检测能力 1.SCB介绍 摘要&#xff1a;利用深度学习方法自动检测学生的课堂行为是分析学生课堂表…

基于SpringBoot Vue养老院管理

大家好✌&#xff01;我是Dwzun。很高兴你能来阅读我&#xff0c;我会陆续更新Java后端、前端、数据库、项目案例等相关知识点总结&#xff0c;还为大家分享优质的实战项目&#xff0c;本人在Java项目开发领域有多年的经验&#xff0c;陆续会更新更多优质的Java实战项目&#x…

【iOS】CollectionView、瀑布流式和圆环布局

使用UITableView作为表格来展示数据完全没有问题&#xff0c;但仍有许多局限性&#xff0c;对于一些更加复杂的布局样式&#xff0c;就有些力不从心了 比如&#xff0c;UITableView只允许表格每一行只能显示一个cell&#xff0c;而不能在一行中显示多个cell&#xff0c;对于这…