unity简单制作一个选择日期的日历

用UGUI制作一个简单的日历,或是选择日期的一个小Demo

新建场景,在场景中添加canvas\image,将image命名为日历,这个就是日历的父物体了,大小为设置为240*250,日历下添加子物体日历背景,这个是背景图片。继续给日历下添加子物体一个黑色的背景,调整透明度变得透明些。这样调整调整至少显得不难看了。

日历底下新建三个和背景图片一样大小的子物体,命名为年,月,日。

在年下面添加9个text子物体,一次命名为1,2,3,4,5,6,7,8,9.这个名字之后用于计算。

同理月,日都这样。注意把text上的Raycast取消

unity简单制作一个选择日期的日历_第1张图片

UI的样子大概就是这个样子了

然后给日历添加一个脚本Rili

unity简单制作一个选择日期的日历_第2张图片

获取下这些东西

现在就需要两个方法了,初始化这个日历,和更新日历两个方法

初始化日历

unity简单制作一个选择日期的日历_第3张图片

月日也一样初始化就好了

这时运行下日历就是这个样子了

unity简单制作一个选择日期的日历_第4张图片

更新日历的方法,是需要在鼠标拖动年或者月,日的时候调用的

unity简单制作一个选择日期的日历_第5张图片

这里有个返回当前月的最大天数的方法,判断下这个月是28,29,30还是31天,返回这个值。

上面就是日历的,接下来给日历下的那三个子物体年,月,日上添加脚本RiliMove,用来假装一个拖动的效果。

unity简单制作一个选择日期的日历_第6张图片

继承了两个接口,判断鼠标按下和抬起的事件的

unity简单制作一个选择日期的日历_第7张图片

unity简单制作一个选择日期的日历_第8张图片

按下抬起,抬起时还应该判断这时候的移动y值,然后更新日历

因为工程很小,然后将所有的判断都堆到了update里

unity简单制作一个选择日期的日历_第9张图片

这个时候一个非常简单的日历就做好了

unity简单制作一个选择日期的日历_第10张图片

你可能感兴趣的:(unity简单制作一个选择日期的日历)