Unity 使用NGUI制作无限滑动列表

news2025/4/22 9:02:22

原理:

复用几个子物体,通过子物体的循环移动实现,如下图

在第一个子物体滑动到超出一定数值时,使其放到最下方

--------------------------------------------------------------》

然后不停的循环往复,向下滑动也是这样的原理

下边上代码:

首先得到Scorll View的高度,使用UIpanel获取,

UIPanel uiPanel = this.GetComponent<UIPanel>();

计算一个最高点和一个最低点

 

使用 Scroll View的y轴位置,加减其高度的一半获得

topY = grid.transform.TransformPoint(new Vector3(0, uiPanel.height / 2 + this.transform.position.y, 0));
bottomY = grid.transform.TransformPoint(new Vector3(0, this.transform.position.y - uiPanel.height / 2, 0));

为什么要转换为世界坐标呢?

首先要看一下Grid和Item是如何滑动的,如下:

可以发现滑动的时候,Grid和子物体面板上的坐标压根不变,显示的都是本地坐标,所以要用一个变量来判断,就必须转换到世界空间下的坐标,有了这个就可以进行判断了,代码如下:(目前代码不是最优,中间增加了没有必要的判断,后边会优化掉)。

 // 处理向上滚动 
for (int i = 0;i < visibleItems.Count; i++)
{
    if (grid.transform.TransformPoint(visibleItems[i].transform.localPosition).y > topY.y)
    {

    }
 }   
 // 处理向下滚动
 for (int i = 0; i < visibleItems.Count; i++)
 {
      if (grid.transform.TransformPoint(visibleItems[i].transform.localPosition).y < bottomY.y)
      {

       }
 }

然后经过判断,就可以对子物体的坐标位置赋值了,前边已经说过子物体的本地坐标是不变的,那么就可以 利用这一点,在头部Item到尾部时,让它的本地坐标减去中间间隔的子物体数量*子物体的高度,在尾部到头部也是一样,代码如下:

//头到尾
visibleItems[i].transform.localPosition = new Vector3(0, visibleItems[i].transform.localPosition.y - visibleItemCount * 100, 0);

//尾到头
visibleItems[i].transform.localPosition = new Vector3(0, visibleItems[i].transform.localPosition.y + visibleItemCount * 100, 0);

如何判断向上还是向下滑动?

记录grid的世界坐标,如果这一帧的值比上一帧的值小,则是向下,否则是向上,并在Update函数下执行,使用一个bool值,使其只在拖动列表的时候执行,代码如下:

    private void Update()
    {
        if (isDrag)
        {
            currentPosition = grid.transform.position.y;
            // 处理向上滚动
            if (currentPosition > lastPosition)
            {

            }
            // 处理向下滚动
            else if (currentPosition < lastPosition)
            {

            }
            lastPosition = currentPosition;
        }    
    }

这个bool值如何赋值?

使用Scroll View的两个函数.onDragStarted,onDragFinished,在代码中给这两个函数分别绑定改变这个bool的值的函数即可。

最后结果:

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

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

相关文章

【并发编程】聊聊定时任务ScheduledThreadPool的实现原理和源码解析

ScheduledThreadPoolExecutor 是在线程池的基础上 拓展的定时功能的线程池&#xff0c;主要有四种方式&#xff0c;具体可以看代码&#xff0c; 这里主要描述下 scheduleAtFixedRate &#xff1a; 除了第一次执行的时间&#xff0c;后面任务执行的时间 为 time MAX(任务执行时…

Java-servlet(三)Java-servlet-Web环境搭建(下)详细讲解利用maven和tomcat搭建Java-servlet环境

Java-servlet&#xff08;三&#xff09;Java-servlet-Web环境搭建&#xff08;下&#xff09;利用maven和tomcat搭建Java-servlet环境 前言一、配置maven阿里镜像二、利用IDEA创建maven文件创建maven文件删除src文件创建新的src模版删除example以及org文件 三、在第二个xml文件…

如何选择DevOps平台?GitHub、GitLab、BitBucket、Jenkins对比与常见问题解答

本文内容来源github.com&#xff0c;由GitHub中国授权合作伙伴-创实信息进行翻译整理。 欢迎通过021-61210910、customershcsinfo.com联系我们&#xff0c;免费试用GitHub企业版。 软件是当今领先企业的核心&#xff0c;而开发者则是软件的核心。GitHub作为一个完整的开发者平台…

react中的fiber和初次渲染

源码中定义了不同类型节点的枚举值 组件类型 文本节点HTML标签节点函数组件类组件等等 src/react/packages/react-reconciler/src/ReactWorkTags.js export const FunctionComponent 0; export const ClassComponent 1; export const IndeterminateComponent 2; // Befo…

闭包+求解候选码+最小函数依赖集

一、闭包 直接上例题 简单明了 A的闭包ABC ABC的闭包ABCD ABCD的闭包ABCDE ABCDE的闭包ABCDEG 等于集合R的全集 所以A的闭包为ABCDEG AB的闭包为ABC 二、候选码 答案&#xff1a; 三、最小函数依赖集 求F的最小函数依赖集 去掉多余的 然后&#xff01; 化为最简

DeepSeek 助力 Vue3 开发:打造丝滑的表格(Table)之功能优化,添加表格空状态提示,带插图的空状态,Table7空状态2

前言&#xff1a;哈喽&#xff0c;大家好&#xff0c;今天给大家分享一篇文章&#xff01;并提供具体代码帮助大家深入理解&#xff0c;彻底掌握&#xff01;创作不易&#xff0c;如果能帮助到大家或者给大家一些灵感和启发&#xff0c;欢迎收藏关注哦 &#x1f495; 目录 Deep…

Unity Shader 学习15:可交互式雪地流程

本质是 利用顶点变换实现的&#xff1a; 通过一个俯视整个场地的正交摄像机&#xff0c;根据绑定在移动物体身上的粒子系统&#xff0c;来获取物体移动过的位置&#xff0c;记录到一张RenderTexture上作为轨迹图&#xff0c;再通过这张图来对雪地做顶点变换。 1. 由于顶点变换需…

嵌入式开发之串行数据处理

前题 前面几篇文章写了关于嵌入式软件开发时&#xff0c;关于串行数据处理的一些相关内容&#xff0c;有兴趣的可以看看《嵌入式开发&#xff1a;软件架构、驱动开发与串行数据处理》、《嵌入式软件开发之生产关系模型》和《嵌入式开发之Modbus-RTU协议解析》相关的内容。从业十…

Centos的ElasticSearch安装教程

由于我们是用于校园学习&#xff0c;所以最好是关闭防火墙 systemctl stop firewalld systemctl disable firewalld 个人喜欢安装在opt临时目录&#xff0c;大家可以随意 在opt目录下创建一个es-standonely-docker目录 mkdir es-standonely-docker 进入目录编辑yml文件 se…

SyntaxError: Unexpected token ‘xxx‘

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》、《前端求职突破计划》 &#x1f35a; 蓝桥云课签约作者、…

Unity自定义区域UI滑动事件

自定义区域UI滑动事件 介绍制作1.创建一个Image2.创建脚本 总结 介绍 一提到滑动事件联想到有太多的插件了比如EastTouchBundle&#xff0c;今天想单纯通过UI去做一个滑动事件而不是基于Box2d或者Box去做滑动事件。 制作 1.创建一个Image 2.创建脚本 using UnityEngine; us…

单链表封装 - 使用JavaScript封装

痛苦就是在蜕变吗 目录 链表&#xff1a;链表的特点&#xff1a;单链表&#xff1a;单链表的封装- JS封装&#xff1a; 单链表的应用&#xff1a;解决回文&#xff1a;解决击鼓传花&#xff1a;十进制进制转换其他进制&#xff1a; 链表&#xff1a; 链表就是一种物理存储单元…

TypeError: Cannot convert object to primitive value

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》、《前端求职突破计划》 &#x1f35a; 蓝桥云课签约作者、…

【uniapp】图片添加canvas水印

目录 需求&背景实现地理位置添加水印 ios补充 需求&背景 需求&#xff1a;拍照后给图片添加水印, 水印包含经纬度、用户信息、公司logo等信息。 效果图&#xff1a; 方案&#xff1a;使用canvas添加水印。 具体实现&#xff1a;上传图片组件是项目里现有的&#xff…

贪吃蛇身匀速运动模型

通用运动模型 我们已知斜线为移动的距离 d d d&#xff0c; x x x轴总偏移量为 d x dx dx&#xff0c; y y y轴总偏移量为 d y dy dy&#xff0c;在一帧当中&#xff0c;我们也知道能走的距离为 m d md md。那么作为一般的运动模型&#xff0c;该如何确定我们进行移动的方向呢&…

npm 执行安装报错

Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution. 原因​ 主要的原因是 npm7 以上的版本&#xff0c;新增了一个对等依赖的特性&#xff0c;在以…

笔记五:C语言编译链接

Faye&#xff1a;孤独让我们与我们所爱的人相处的每个瞬间都无比珍贵&#xff0c;让我们的回忆价值千金。它还驱使你去寻找那些你在我身边找不到的东西。 ---------《寻找天堂》 目录 一、编译和链接的介绍 1.1 程序的翻译环境和执行环境 1.1.1 翻译环境 1.1.2 运行环境 …

【c语言概述、数据类型、运算符与表达式精选题】

c语言概述、数据类型、运算符与表达式精选题 一、易错题1.1&#x1f384; c程序的执行1.2&#x1f384; c程序的基本组成单元1.3&#x1f384; c程序的组成1.4&#x1f384; 5种基本类型数据类型长度1.5&#x1f384; C语言关键字1.6&#x1f384; 整型常量1.7&#x1f384; 合…

200个前卫街头氛围涂鸦艺术水墨颜料手绘笔迹飞溅PNG免扣迭加纹理素材 VANTABLACK TEXTURES

探索 Vantablack 200 纹理包&#xff1a;您获得前卫、高分辨率纹理的首选资源。非常适合旨在为其作品添加原始都市氛围的设计师。这些透明迭加层使用简单&#xff0c;但非常有效&#xff0c;只需单击几下&#xff0c;即可将您的设计从普通变为非凡。准备好用既酷又百搭的质地来…

深度学习模型Transformer核心组件—自注意力机制

第一章&#xff1a;人工智能之不同数据类型及其特点梳理 第二章&#xff1a;自然语言处理(NLP)&#xff1a;文本向量化从文字到数字的原理 第三章&#xff1a;循环神经网络RNN&#xff1a;理解 RNN的工作机制与应用场景(附代码) 第四章&#xff1a;循环神经网络RNN、LSTM以及GR…