制作的日历控件，基本上能实现日历控件在网页的基本功能，例如点击日历图标出现日期选择面板，点击其中一个预先设定好的日期，日期在文本框显示.点击日历图标中的清空，则删除文本框中的日期。点击关闭，则关闭日期选择面板。
工具/原料
1
axure PR
2
日历控件的图片
方法/步骤
1
打开工具,从左侧元件库中拖拽一个动态面板
2
双击动态面板，再双击打开状态1，然后，把日期选择图片粘贴到里面，并拖动到左上角的位置，点右键—顺序–设置为最底层
3
拖拽图片到动态面板区域,调整好大学
4
从左侧元件库里面拖出四个图片热区，分别调整成合适的大小后覆盖在清空、今天、关闭三个按钮和要选择的日期数字上,下图我设置了一个热区,大家要做的话要全部设置上其他热区
5
分别设置热区的点击事件(如何设置点击事件大家看前几节课),点击清空上的热区时，删除日期文本框的文字
6
点击今天上的热区时，调用系统日期变量[[Year]]-[[Month]]-[[Day]]，将当前日期填入文本框。如果要是填前一天的就是[[Year]]-[[Month]]-[[Day-1]]喽，当天是月初1号，就是[[Year]]-[[Month-1]]-[[Day-1]]。
7
点击关闭上的热区时，设置隐藏动态面板。点击确定
9
回到主页面给日历图标也加个鼠标点击事件，当鼠标点击时，切换动态面板可见性
10
在动态面板上点右键—编辑选项—设为隐藏。
11
生成原型界面,即可看到效果了
上一篇：excel中怎么插入日历
下一篇：iPhone日历怎么显示周数