Axure教程:用中继器做手机版日期选择器和手机日历

访客4年前黑客文章1156

Axure教程:用中继器做手机版日期选择器和手机日历

本日和各人分享怎么用中继器建造手机版的日历。该原型利用利便,可直接利用,并且交互齐全完善,所以推荐给各人利用。这期的内容,数学公式较量多,大概有些小同伴会不大白,喜欢原型可能有疑问的小同伴们可以在下方评论处给我留言哦。

原型预览地点:

01 结果演示 1. 手机日历

1.1 鼠标上下、阁下滑动结果

这里手机真实结果一直哈。并且日历都是尺度的日历,不会有错哦,还不需要联网。

Axure教程:用中继器做手机版日期选择器和手机日历

1.2 点击查察年视图

同样的年视图内里也可以上下阁下滑动选择年份哦。

Axure教程:用中继器做手机版日期选择器和手机日历

1.3 点击月份回到月视图

Axure教程:用中继器做手机版日期选择器和手机日历

1.4 选择日期

Axure教程:用中继器做手机版日期选择器和手机日历

1.4 选择今天

Axure教程:用中继器做手机版日期选择器和手机日历

2. 滑动日期选择器

Axure教程:用中继器做手机版日期选择器和手机日历

02 建造解说 1. 手机版日历

首先我们要做这个页面

Axure教程:用中继器做手机版日期选择器和手机日历

用中继器做,中继器内只需要两列column0和xuanzhong

中继器新增42行,因为6*7日=42,有的同学大概会问,老师5行不足吗,你们看一下下图就知道为什么要六行了。

Axure教程:用中继器做手机版日期选择器和手机日历

中继器网格漫衍,每排项目数为7,列表格什么都不需要填,只是用于逻辑处理惩罚。

下面我们简朴说一下逻辑,我们要找到某年某月的之一天是礼拜几,然后配置中继器那一格显示1,之后的按2、3、4……下去即可。这里有一点需要留意的,我们要记着1、3、5、7、8、10、12月有31天,4、6、9、11月有30天,2月有28或29天。

我们先处理惩罚简朴的

用now函数可以获取此刻的日期,然后用get.date函数获取本日是几号,再计较本日间隔1号隔了几天,譬喻本日是2019年5月22日,那么间隔2019年5月1日就隔了-21日,然后用add函数,[[Now.addDays(days)]],(days)就是填隔了几多天,上述案例是-21,接着用get.day函数,就可以获得是周几了,留意,假如是周日get.day的值是0,周一是1……,案例中get.day的值为5.

那假如中继器的序号小于便是get.day的值,配置文本为空(就是中继器前5行为空值);假如序号大于get.day+31,也是配置文本为空,这里需要分环境,假如是1、3、5、7、8、10、12月的话是31,代表已经是下个月的日期了。那假如是4、6、9、11月应该是30天,2月应为28或29天,那怎么判定是28照旧29呢。用年份/4,假如功效包括小数点的就是28天,没包括的就是29天。其余环境中继器内文本=序号-get.day的值

上面就是计较当月的,那怎么计较其他月份的呢,用add.month函数,计较年的就用add.year函数就可。鼠标向左拖动竣事的时候,add.month+1,然后反复上述操纵。年视图也是一样,左拖动时,add.year+1,反复上面操纵。

那么右滑动其实就是-1。

然后xuanzhong就是,鼠标单击时,显示选中的颜色,开始进去的时候我们可以默认更新行,让本日日期被选中。

上面就是建造手机版日历的教程了。

然后日期滑动选择器的建造跟上期我们讲的地域选择器的建造要领根基一致。有乐趣的小同伴可以看回我之前的文章Axure教程:手机版地域选择器原型

那么我们这期的分享就到这里竣事了,

这期的内容,数学公式较量多,大概有些小同伴会不大白,喜欢原型可能有疑问的小同伴们可以在下方评论处给我留言哦。

相关文章

如何对营业额数据进行分析,提升门店盈利能力?

如何对营业额数据进行分析,提升门店盈利能力?

商家运营店肆的最终目标是实现盈利,而这个中,营业额是权衡门店代价的一项重要指标。店肆的日常策划环境都可以通过数据举办查明,对营业额数据做好阐明事情,有助于优化整体运营节拍,为日后的运营事情提供好的参考...

app下载功能背后的逻辑

app下载功能背后的逻辑

目标 下载成果在app中十分常见,好比:腾讯视频app的视频缓存到当地、百度网盘的下载、手机软件更新的下载等等。许多环境下文件下载都是批量的,好比下载电视剧,软件批量更新。看似简朴的一个成果其背后却...

角色权限设计:以阿里产品为例,展开体验分析

角色权限设计:以阿里产品为例,展开体验分析

笔者选用阿里的两款产物应用身份处事(IDaaS)和RAM会见节制处事举办深入的体验阐明,并从成果、布局、交互等方面展开。 1 概述 脚色权限作为大型系统必不行少的成果,节制着业务中各个部分用户的权限...

一图说清行政审批业务流程

一图说清行政审批业务流程

编辑导语:如今互联网+政务处事已遍及运用,想要办什么业务可以在网上提前申请,之后再去现场治理;行政审批业务流程分四个环节,本文作者用一张状态图梳理整个行政审批处事的业务流程,我们一起来看一下。 互联...

一幅图帮你搞懂订单的拆分与合并

一幅图帮你搞懂订单的拆分与合并

编辑导语:产物设计往往需要思量到各个场景,那么如何举办设计才气尽大概的做到“八面见光”呢?本文作者以订单的拆分和归并为例,总结了一张图,为我们谈了谈他的思考,看看订单如何实际才气尽大概的做好公道利便。...

互联网产品的新趋势:kill time的产品包裹上save time的糖衣

互联网产品的新趋势:kill time的产品包裹上save time的糖衣

kill time意为消磨时间,save time意为省时提效,以往的互联网产物在这两者的分类上或者尚有明明的边界,但跟着互联网产物的不绝迭代演进,kill time 与 save time 越来越难...