效果图

用的是UGUI

我先说思路

通过判断元素的位置信息来改变Hierarchy的顺序 实现无限滚动

改变位置的同时也要不断的调整Content的位置防止乱跳

元素锁定就是直接锁死的元素的移动范围 当只有拖动大于一定程度时才会发生改变

然后是面板设置

整体结构是这样子的

需要注意的是Content需要的两个组件

Content的爸爸只需要一个脚本

大小改变曲线(大致就行)

颜色渐变曲线

最后是脚本

  1 using System;
  2 using System.Collections;
  3 using System.Collections.Generic;
  4 using UnityEngine;
  5 using UnityEngine.EventSystems;
  6 using UnityEngine.UI;
  7
  8 public class DateControl : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler {
  9
 10     public enum ItemType { _year, _month, _day }
 11
 12     public ItemType _itemtype;
 13
 14     RectTransform conentRect;
 15
 16     RectTransform targetRec;
 17
 18     Vector3 oldDragPos;
 19
 20     Vector3 newDragPos;
 21
 22     public AnimationCurve curve_scale;//改变大小曲线
 23     public AnimationCurve curve_color;//渐变效果曲线
 24
 25
 26     List<Text> textList = new List<Text>();
 27
 28     Button testBtn;
 29
 30     float
 31         itemHeight,             //子项item的高
 32         contentParentHeight,    //Content爸爸的高
 33         itemNum,                //子项数量
 34         itemHeight_min,         //子项最小发生改变位置
 35         itemHeight_max,         //子项最大发生改变位置
 36         conentLimit,            //Conent纠正位置
 37         conentSpacing;          //子项间隔大小
 38
 39     float deltaX, deltaY;
 40
 41     [HideInInspector]
 42     public static int _year, _month, _day;
 43
 44     [HideInInspector]
 45     int dateItemNum;
 46
 47     Color itemColor_hig = new Color32(255, 255, 255, 255);
 48
 49     void Awake() {
 50         conentRect = transform.FindChild("Content").GetComponent<RectTransform>();
 51         targetRec = transform.parent.FindChild("HighlightTarget").GetComponent<RectTransform>();
 52
 53     }
 54
 55     void OnEnable() {
 56         ItemList();
 57     }
 58
 59     void Start() {
 60         switch (_itemtype) {
 61             case ItemType._year: InstantiateData(15, 2017); break;
 62             case ItemType._month: InstantiateData(12, 12); break;
 63             case ItemType._day: InstantiateData(31, 31); break;
 64         }
 65
 66         itemNum = transform.FindChild("Content").childCount - 1;
 67
 68         contentParentHeight = conentRect.parent.GetComponent<RectTransform>().sizeDelta.y;
 69
 70         conentSpacing = conentRect.GetComponent<VerticalLayoutGroup>().spacing / 2;
 71
 72         itemHeight = textList[0].rectTransform.sizeDelta.y + conentSpacing;
 73
 74         if (itemNum % 2 == 0) conentLimit = (itemHeight + 5) / 2;
 75
 76         else conentLimit = 0;
 77
 78         conentRect.anchoredPosition = new Vector2(conentRect.anchoredPosition.x, conentLimit);
 79
 80         deltaX = textList[0].GetComponent<RectTransform>().sizeDelta.x;
 81         deltaY = textList[0].GetComponent<RectTransform>().sizeDelta.y;
 82
 83         Invoke("ItemList", 0.05f);
 84
 85     }
 86
 87     /// <summary>
 88     /// 生成子项item
 89     /// </summary>
 90     /// <param name="itemNum">子项数量</param>
 91     /// <param name="dat">子项最大值</param>
 92     void InstantiateData(int itemNum, int dat) {
 93         GameObject go;
 94         Text testObj = conentRect.FindChild("Text").GetComponent<Text>();
 95         for (int i = dat - itemNum + 1; i <= dat; i++) {
 96             go = Instantiate(testObj.gameObject, conentRect);
 97             go.GetComponent<Text>().text = i.ToString();
 98             go.name = i.ToString();
 99             textList.Add(go.GetComponent<Text>());
100             ShowItem(true);
101         }
102         Destroy(conentRect.FindChild("Text").gameObject);
103     }
104
105     /// <summary>
106     /// 是增加或减少
107     /// </summary>
108     /// <param name="isIncreaseOrdecrease"></param>
109     void ShowItem(bool isIncreaseOrdecrease) {
110         itemHeight_min = -itemHeight;
111
112         if (_itemtype == ItemType._day) itemHeight_max = -itemHeight * itemNum - 95;
113         else itemHeight_max = -itemHeight * itemNum;
114
115         if (isIncreaseOrdecrease) {
116             foreach (Text rectItem in textList) {
117                 if (rectItem.GetComponent<RectTransform>().anchoredPosition.y > itemHeight_min) {
118                     print("+");
119                     rectItem.transform.SetSiblingIndex((int)itemNum);
120                 }
121             }
122             print(itemHeight_min);
123         } else {
124             foreach (Text rectItem in textList) {
125                 if (rectItem.GetComponent<RectTransform>().anchoredPosition.y < itemHeight_max) {
126                     print("-");
127                     rectItem.transform.SetSiblingIndex(0);
128                 }
129             }
130             print(itemHeight_max);
131
132         }
133     }
134
135     /// <summary>
136     /// 渐变效果,改变大小,高亮显示
137     /// </summary>
138     void ItemList() {
139         foreach (Text item in textList) {
140             float indexA = Mathf.Abs(item.GetComponent<RectTransform>().position.y - targetRec.position.y);
141             float indexSc_scale = Mathf.Abs(curve_scale.Evaluate(indexA / contentParentHeight));
142             float indexSc_color = Mathf.Abs(curve_color.Evaluate(indexA / contentParentHeight));
143             if (indexA < 15) {
144                 item.color = itemColor_hig;
145                 switch (_itemtype) {
146                     case ItemType._year: _year = int.Parse(item.text); break;
147                     case ItemType._month: _month = int.Parse(item.text); break;
148                     case ItemType._day: _day = int.Parse(item.text); break;
149                 }
150             } else item.color = new Color(0, 0, 0, 1 - indexSc_color);
151
152             item.GetComponent<RectTransform>().localScale = new Vector3(1 - indexSc_scale, 1 - indexSc_scale * 3, 1 - indexSc_scale);
153             //item.GetComponent<RectTransform>().sizeDelta = new Vector2(deltaX - (deltaX * indexSc), deltaY - (deltaY * indexSc));
154         }
155
156     }
157
158     /// <summary>
159     /// 获取int类型日期,并转换为指定格式
160     /// </summary>
161     /// <returns></returns>
162     public static string GetDateInfo() { return _year + "-" + _month + "-" + _day; }
163
164     /// <summary>
165     /// 纠正Conent位置
166     /// </summary>
167     void UpdateEx() {
168         if (conentRect.anchoredPosition.y > conentLimit) {
169             ShowItem(true);
170             conentRect.anchoredPosition = new Vector2(conentRect.anchoredPosition.x, conentRect.anchoredPosition.y - itemHeight);
171         }
172         if (conentRect.anchoredPosition.y < conentLimit) {
173             ShowItem(false);
174             conentRect.anchoredPosition = new Vector2(conentRect.anchoredPosition.x, conentRect.anchoredPosition.y + itemHeight);
175         }
176     }
177
178     /// <summary>
179     /// 获取拖拽信息并改变Conent位置
180     /// </summary>
181     /// <param name="eventData"></param>
182     void SetDraggedPosition(PointerEventData eventData) {
183         if (RectTransformUtility.ScreenPointToWorldPointInRectangle(conentRect, eventData.position, eventData.pressEventCamera, out newDragPos)) {
184             newDragPos = eventData.position;
185             if (Mathf.Abs(newDragPos.y - oldDragPos.y) >= itemHeight) {
186                 if (newDragPos.y > oldDragPos.y) {
187                     conentRect.anchoredPosition = new Vector2(conentRect.anchoredPosition.x, conentRect.anchoredPosition.y + itemHeight);
188                     oldDragPos += new Vector3(0, itemHeight, 0);
189                     ItemList();
190                 } else {
191                     conentRect.anchoredPosition = new Vector2(conentRect.anchoredPosition.x, conentRect.anchoredPosition.y - itemHeight);
192                     oldDragPos -= new Vector3(0, itemHeight, 0);
193                     ItemList();
194                 }
195             }
196         }
197     }
198
199     /// <summary>
200     /// 当开始拖拽
201     /// </summary>
202     /// <param name="eventData"></param>
203     public void OnBeginDrag(PointerEventData eventData) {
204         oldDragPos = eventData.position;
205     }
206
207     public void OnDrag(PointerEventData eventData) {
208         SetDraggedPosition(eventData);
209         UpdateEx();
210     }
211
212     public void OnEndDrag(PointerEventData eventData) {
213         SetDraggedPosition(eventData);
214         UpdateEx();
215     }
216 }

照着来的话基本没什么问题

因为赶时间所以很多地方写的简单粗暴请谅解

如果调整元素大小或者间隙大小 需要改变itemHeight_min 和 itemHeight_max 的值

他们分别为

itemHeight_min

itemHeight_max 

也就是元素的最顶层和最底层的Y值

以上就是年月日选择器的具体步骤

转载于:https://www.cnblogs.com/sangblog/p/6995534.html

Unity3d—做一个年月日选择器(Scroll Rect拖动效果优化)— 无限滚动 + 锁定元素...相关推荐

  1. php年月日滚动选择,Unity3d—做一个年月日选择器(Scroll Rect拖动效果优化)— 无限滚动 + 锁定元素...

    [导读]最近.....废话不多说上效果图用的是UGUI我先说思路通过判断元素的位置信息来改变Hierarchy的顺序 实现无限滚动改变位置的同时也要不断的调整Content的位置防止乱跳元素锁定就是直 ...

  2. Vue3+ Naive UI做一个行政区选择器

    行政区信息的获取 这里用到的行政区信息是从高德开放平台获取的,地址是: https://developer.amap.com/api/webservice/guide/api/district 如果信 ...

  3. 如何做一个一键吸空投箱的效果

    功能效果展示 运行环境 Win7,Win8,Win10 Reworld版本 体验版 vc_redist.x64 运行环境 针对零基础读者的补充 下载安装 Reworld对应版本 Reworld官网链接 ...

  4. 如何做一个超级马里奥顶方块的效果

    功能效果展示 运行环境 Win7,Win8,Win10 Reworld版本 体验版 vc_redist.x64 运行环境 针对零基础读者的补充 下载安装 Reworld对应版本 Reworld官网链接 ...

  5. 我可以编写一个CSS选择器来选择不具有某个类或属性的元素吗?

    本文翻译自:Can I write a CSS selector selecting elements NOT having a certain class or attribute? I would ...

  6. css3 做一个漂亮的分割线

    原文出处: http://blog.csdn.net/majormayer/article/details/50996444 在网页中我们经常会用到分割线,但是原始的分割线并不太美观,我们可以用css ...

  7. JS + CSS 做一个简易九宫格抽奖

    目录 1.CSS样式 2.JS动作 大概做出来就是这个样子,alert的弹窗样式我也没改,就默认的. 1.CSS样式 样式大概分以下方面: 创建外框及内框样式: 8个奖品小方格和中间按钮小方格: 奖品 ...

  8. Unity3d制作一个简单粗暴的五子棋项目工程源码

    Unity3d制作一个简单粗暴的五子棋 最终效果 项目源码 绘制棋盘 绘制构思 绘制代码 效果图 放置棋子 功能和效果 功能 效果 制作棋子 定义类和类型 棋子类型 棋盘格类 实现功能 初始棋盘格数据 ...

  9. Infinite Scroll - jQuery WP 无限滚动插件

    无限滚动(Infinite Scroll)也称为自动分页.滚动分页和无限分页.常用在图片.文章或其它列表形式的网页中,用来在滚动网页的时候自动加载下一页的内容.Infinite Scroll  这款  ...

最新文章

  1. JAVA中循环删除list中元素的方法总结
  2. JAVA中类的访问修饰符的作用范围
  3. 【数据结构】集合及运算
  4. runloop解决Cell上主线程卡顿
  5. jndi ldap_什么是JNDI,SPI,CCI,LDAP和JCA?
  6. C++——已知a+b、 a+c、b+c、 a+b+c,求a、b、 c
  7. 程序员怎样锻炼编程思维(学习方法)
  8. JAVA面试题(2018)
  9. Django数据库配置
  10. 工作目录切换命令、打包压缩文件命令
  11. Hibernate_02
  12. 【lpxt】笔者支招:九招搞定显示器黑屏
  13. 中国教育和科研计算机网 吉林省,吉林大学—41核心节点—热烈庆祝中国教育和科研计算机网CERNET建设20周年—中国教育和科研计算机网CERNET...
  14. 车牌检测License Plate Detection and Recognition in Unconstrained Scenarios
  15. Flutter RSA加密解密
  16. 福师计算机应用基础在线作业,福师《计算机应用基础》在线作业一
  17. 一章——系统安全及应用(应用——linux防护与群集)
  18. 概念:伪随机数、种子以及C中的随机函数
  19. 关于集合除法的理解(MySQL实现)
  20. CMMI 3.0究竟有哪些变化?

热门文章

  1. 顺序表的应用__电话本
  2. logistic模型原理与推导过程分析(1)
  3. 计算机语言恢复,win10系统找回消失不见语言栏的恢复方法
  4. 论文阅读 - Large-scale weakly-supervised pre-training for video action recognition
  5. LeetCode 1786. 从第一个节点出发到最后一个节点的受限路径数(迪杰斯特拉 + 拓扑排序)
  6. LeetCode 1727. 重新排列后的最大子矩阵(前缀和+排序)
  7. 天池 在线编程 木材加工(二分查找)
  8. 02.改善深层神经网络:超参数调试、正则化以及优化 W3. 超参数调试、Batch Norm和程序框架
  9. LeetCode 750. 角矩形的数量(DP)
  10. LeetCode 405. 数字转换为十六进制数