不使用ScrollRect 和 HorizontalLayoutGroup做的横向循环列表

2024-05-24 16:12

本文主要是介绍不使用ScrollRect 和 HorizontalLayoutGroup做的横向循环列表,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

一、 版本一

1.前情提要

因为需要展示300多个相同的物体,但是如果全部放在场景内,运行起来会很卡,所以想到了用无限循环,然后动态填充不同的数据。
做的这个没有用HorizontalLayoutGroup 和 ScrollRect 。
1.没有使用HorizontalLayoutGroup,是因为运行后会在第一个放到后面后,自动给剩下的排序,然后排完发现第二个到了第一个的位置,然后,第二个自动符合排到最后的条件,然后第二个继续放到后面。。。
造成极短的时间内,所有东西都在不停向后排。
2.没有使用 ScrollRect是因为,它和IDragHandler接口都是滑动功能, 只需要一个就够了,而我使用IDragHandler更趁手。

2.效果展示

在这里插入图片描述

3.原理讲解

我使用的IDragHandler和IBeginDragHandler两个接口,在开始和每次drag后都保存上次的鼠标位置,然后拖拽的时候,移动他们的父级content。然后比较上次滑动的鼠标位置,左移,和最小值比较超过,就把第一个排到最后。同样,如果右移,和最大值比较超过,就把最后一个拍到第一个。TimeDanyuan是为了辨认的自定义类。使用时,可以自己使用其他的代替。
后续会优化,继续尝试其他方式,找到最优解。

4.功能代码

版本V1.0

private List<RectTransform> danyuans=new List<RectTransform>();public Transform content;private Vector3 last_mousePos;private float minXPos = 470.7586f;//左滑范围private float maxXPos = 1639.109f;//右滑范围private Vector3 oldPos;private float interval = 146;//间隔// Start is called before the first frame updatevoid Start(){var danyuans01=GetComponentsInChildren<TimeDanyuan>();foreach (var danyuan in danyuans01){var rect=danyuan.GetComponent<RectTransform>();danyuans.Add(rect);}}public void OnDrag(PointerEventData eventData){Vector3 mousepos = Input.mousePosition - last_mousePos;content.position = oldPos+ new Vector3(mousepos.x, 0,0);if (mousepos.x> 0)//右滑{//右滑超出边界 var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (last.position.x > maxXPos){last.anchoredPosition = new Vector2(first.anchoredPosition.x - interval, last.anchoredPosition.y);last.SetAsFirstSibling();}}else if(mousepos.x < 0) //左滑{//左滑超出边界var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (first.position.x < minXPos){first.anchoredPosition = new Vector2(last.anchoredPosition.x+ interval, first.anchoredPosition.y);first.SetAsLastSibling();}}last_mousePos = Input.mousePosition;oldPos = content.position;}public void OnBeginDrag(PointerEventData eventData){last_mousePos =Input.mousePosition;oldPos = content.position;}

二、 版本二,增加新的功能,可以根据左右滑动,里面的内容会不同。

1.效果截图

右滑 里面的数值会变大
在这里插入图片描述
左滑里面的数值会变小在这里插入图片描述

2.具体增加的内容

具体只增加了一个next_index 属性来标记序号,OnChange事件用来相应左右滑动时的事件,给里面的内容赋值。OnChange需要一个要赋值的值(这里是个int类型的值)和具体需要改的物体。

3…代码

private List<RectTransform> danyuans=new List<RectTransform>();public Transform content;private Vector3 last_mousePos;private float minXPos = 470.7586f;//左滑范围private float maxXPos = 1639.109f;//右滑范围private Vector3 oldPos;private float interval = 146;//间隔public Action<int, RectTransform> OnChange;private int next_index;// Start is called before the first frame updatevoid Start(){foreach (Transform danyuan in content){var rect=danyuan.GetComponent<RectTransform>();danyuans.Add(rect);}OnChange += ChangeIndex;}public void OnDrag(PointerEventData eventData){Vector3 mousepos = Input.mousePosition - last_mousePos;content.position = oldPos+ new Vector3(mousepos.x, 0,0);if (mousepos.x> 0)//右滑{//右滑超出边界 var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (last.position.x > maxXPos){last.anchoredPosition = new Vector2(first.anchoredPosition.x - interval, last.anchoredPosition.y);last.SetAsFirstSibling();int index=int.Parse(first.GetComponentInChildren<TextMeshProUGUI>().text);next_index = index - 1;OnChange(next_index,last);}}else if(mousepos.x < 0) //左滑{//左滑超出边界var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (first.position.x < minXPos){first.anchoredPosition = new Vector2(last.anchoredPosition.x+ interval, first.anchoredPosition.y);first.SetAsLastSibling();int index = int.Parse(last.GetComponentInChildren<TextMeshProUGUI>().text);next_index = index + 1;OnChange(next_index,first);}}last_mousePos = Input.mousePosition;oldPos = content.position;}public void OnBeginDrag(PointerEventData eventData){last_mousePos =Input.mousePosition;oldPos = content.position;}private void ChangeIndex(int index, RectTransform c_item){var text= c_item.GetComponentInChildren<TextMeshProUGUI>();text.text = index.ToString();}

版本三 时间显示无限滚动进度条

这个版本改成了,时间的以前和未来。随着滚动,可以无限滚动到以前,也可以无限滚动到未来。
没有显示最大最小日期。

using System;
using System.Collections.Generic;
using TMPro;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;
/// <summary>
/// 时间显示进度条
/// </summary>
public class InfiniteTimeline : MonoBehaviour, IDragHandler, IBeginDragHandler
{private List<RectTransform> danyuans = new List<RectTransform>();public Transform content;private Vector3 last_mousePos;private float minXPos = 470.7586f;//左滑范围private float maxXPos = 1639.109f;//右滑范围private Vector3 oldPos;private float interval = 146;//间隔public Action<DateTime, RectTransform> OnChange;private DateTime next_index;/// <summary>/// 初始化时间/// </summary>/// <param name="start"></param>/// <param name="end"></param>public void Onchushihua(){#region 旧代码//startTime=start;//endTime=end;//shijian_refab =transform.XuYiFindChild("时间条").GetComponentInChildren<TimeDanyuan>();//var dur = end.Subtract(start).Days;//mytexts = new List<TimeDanyuan>();//var prefabRect = shijian_refab.transform.parent.GetComponent<RectTransform>();//prefabRect.anchoredPosition = Vector2.zero;//for (int i = 0; i <= dur; i++)//{//    var obj = Instantiate(shijian_refab.gameObject, shijian_refab.transform.parent);//    //if (start.AddDays(i)==DateTime.Today)//    //{//    //    var toggle = obj.GetComponent<Toggle>();//    //    toggle.isOn = true;//    //}//    var objTime = obj.GetComponent<TimeDanyuan>();//    objTime.OnChushihua(start.AddDays(i));//    obj.SetActive(true);//    mytexts.Add(objTime);//}var shijian_rect=shijian_refab.GetComponent<RectTransform>();//scro_efab = GetComponent<ScrollRect>();//float temp = (float)(DateTime.Today-start).TotalDays-3;//LayoutRebuilder.ForceRebuildLayoutImmediate(scro_efab.content);scro_efab.horizontalScrollbar.value = 0.5f;//var shijRect = shijian_refab.transform.GetComponent<RectTransform>();//scro_efab.content.anchoredPosition = new Vector2(-temp * shijRect.sizeDelta.x, 0);#endregionint index = -3;foreach (Transform danyuan in content){var rect = danyuan.GetComponent<RectTransform>();var mytext= danyuan.GetComponentInChildren<TextMeshProUGUI>();if (mytext != null)mytext.text = DateTime.Today.AddDays(index).ToString("yyyy.M.d");danyuans.Add(rect);index++;}OnChange += ChangeIndex;}/// <summary>/// 跳转到指定时间/// </summary>/// <param name="mid"></param>public void SetScrollRect(DateTime mid){#region 旧代码//if (mid>=startTime && mid <= endTime)//{//    TimeSpan x = mid - startTime;//    float result = (float)x.TotalDays-3;//    var shijRect = shijian_refab.transform.GetComponent<RectTransform>();//    scro_efab.content.anchoredPosition = new Vector2(-result * shijRect.sizeDelta.x, 0);//}#endregion}// Start is called before the first frame updatevoid Start(){Onchushihua();}public void OnDrag(PointerEventData eventData){Vector3 mousepos = Input.mousePosition - last_mousePos;content.position = oldPos + new Vector3(mousepos.x, 0, 0);if (mousepos.x > 0)//右滑{//右滑超出边界 var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (last.position.x > maxXPos){last.anchoredPosition = new Vector2(first.anchoredPosition.x - interval, last.anchoredPosition.y);last.SetAsFirstSibling();DateTime index = DateTime.Parse(first.GetComponentInChildren<TextMeshProUGUI>().text);next_index = index.AddDays(-1);OnChange(next_index, last);}}else if (mousepos.x < 0) //左滑{//左滑超出边界var first = content.transform.GetChild(0).GetComponent<RectTransform>();var last = content.transform.GetChild(content.childCount - 1).GetComponent<RectTransform>();if (first.position.x < minXPos){first.anchoredPosition = new Vector2(last.anchoredPosition.x + interval, first.anchoredPosition.y);first.SetAsLastSibling();DateTime index = DateTime.Parse(last.GetComponentInChildren<TextMeshProUGUI>().text);next_index = index.AddDays(1);OnChange(next_index, first);}}last_mousePos = Input.mousePosition;oldPos = content.position;}public void OnBeginDrag(PointerEventData eventData){last_mousePos = Input.mousePosition;oldPos = content.position;}private void ChangeIndex(DateTime index, RectTransform c_item){var text = c_item.GetComponentInChildren<TextMeshProUGUI>();text.text = index.ToString("yyyy.M.d");}
}

这篇关于不使用ScrollRect 和 HorizontalLayoutGroup做的横向循环列表的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/998896

相关文章

一文详解如何使用Java获取PDF页面信息

《一文详解如何使用Java获取PDF页面信息》了解PDF页面属性是我们在处理文档、内容提取、打印设置或页面重组等任务时不可或缺的一环,下面我们就来看看如何使用Java语言获取这些信息吧... 目录引言一、安装和引入PDF处理库引入依赖二、获取 PDF 页数三、获取页面尺寸(宽高)四、获取页面旋转角度五、判断

C++中assign函数的使用

《C++中assign函数的使用》在C++标准模板库中,std::list等容器都提供了assign成员函数,它比操作符更灵活,支持多种初始化方式,下面就来介绍一下assign的用法,具有一定的参考价... 目录​1.assign的基本功能​​语法​2. 具体用法示例​​​(1) 填充n个相同值​​(2)

Spring StateMachine实现状态机使用示例详解

《SpringStateMachine实现状态机使用示例详解》本文介绍SpringStateMachine实现状态机的步骤,包括依赖导入、枚举定义、状态转移规则配置、上下文管理及服务调用示例,重点解... 目录什么是状态机使用示例什么是状态机状态机是计算机科学中的​​核心建模工具​​,用于描述对象在其生命

使用Python删除Excel中的行列和单元格示例详解

《使用Python删除Excel中的行列和单元格示例详解》在处理Excel数据时,删除不需要的行、列或单元格是一项常见且必要的操作,本文将使用Python脚本实现对Excel表格的高效自动化处理,感兴... 目录开发环境准备使用 python 删除 Excphpel 表格中的行删除特定行删除空白行删除含指定

深入理解Go语言中二维切片的使用

《深入理解Go语言中二维切片的使用》本文深入讲解了Go语言中二维切片的概念与应用,用于表示矩阵、表格等二维数据结构,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧... 目录引言二维切片的基本概念定义创建二维切片二维切片的操作访问元素修改元素遍历二维切片二维切片的动态调整追加行动态

prometheus如何使用pushgateway监控网路丢包

《prometheus如何使用pushgateway监控网路丢包》:本文主要介绍prometheus如何使用pushgateway监控网路丢包问题,具有很好的参考价值,希望对大家有所帮助,如有错误... 目录监控网路丢包脚本数据图表总结监控网路丢包脚本[root@gtcq-gt-monitor-prome

Python通用唯一标识符模块uuid使用案例详解

《Python通用唯一标识符模块uuid使用案例详解》Pythonuuid模块用于生成128位全局唯一标识符,支持UUID1-5版本,适用于分布式系统、数据库主键等场景,需注意隐私、碰撞概率及存储优... 目录简介核心功能1. UUID版本2. UUID属性3. 命名空间使用场景1. 生成唯一标识符2. 数

SpringBoot中如何使用Assert进行断言校验

《SpringBoot中如何使用Assert进行断言校验》Java提供了内置的assert机制,而Spring框架也提供了更强大的Assert工具类来帮助开发者进行参数校验和状态检查,下... 目录前言一、Java 原生assert简介1.1 使用方式1.2 示例代码1.3 优缺点分析二、Spring Fr

Android kotlin中 Channel 和 Flow 的区别和选择使用场景分析

《Androidkotlin中Channel和Flow的区别和选择使用场景分析》Kotlin协程中,Flow是冷数据流,按需触发,适合响应式数据处理;Channel是热数据流,持续发送,支持... 目录一、基本概念界定FlowChannel二、核心特性对比数据生产触发条件生产与消费的关系背压处理机制生命周期

java使用protobuf-maven-plugin的插件编译proto文件详解

《java使用protobuf-maven-plugin的插件编译proto文件详解》:本文主要介绍java使用protobuf-maven-plugin的插件编译proto文件,具有很好的参考价... 目录protobuf文件作为数据传输和存储的协议主要介绍在Java使用maven编译proto文件的插件