项目结构:
概述
概述
可滑动查看的日历模块(内含iOS和Android)
APICloud 的 UICalendar 模块是一个原生代码封装的日历模块。目的是为了让 APICloud 的广大开发者只需用 html+js 即可快速、高效的集成炫酷的日历到自己的 App 内。由于本模块 UI 布局界面为固定模式,不能满足日益增长的广大开发者对侧滑列表模块样式的需求。因此,广大原生模块开发者,可以参考此模块的开发方式、接口定义等开发规范,或者基于此模块开发出更多符合产品设计的新 UI 布局的模块,希望此模块能起到抛砖引玉的作用。
模块接口文档
来自于:官方
模块概述
UICalendar 是一个日历选择模块;可自定义日历的样式,添加特殊日期标注,切换月份,设置指定日期;用于实现常用的日期选择,日历展示功能。UICalendar 模块是 calendar 模块的优化版。
注:针对单日的样式优先级序列为:
selected>setSpecialDate>specialDate>styles_specialDate>today
模块截图:
实例widget下载地址
模块接口
open
打开日历
open({params}, callback(ret))
params
multipleSelect:
- 类型:布尔类型
- 描述:(可选项)是否可以多选日期
- 默认值:false
rect:
- 类型:JSON 对象
- 描述:(可选项)模块的位置及尺寸
- 内部字段:
styles:
- 类型:JSON 对象
- 描述:(可选项)模块各部分的样式
- 内部字段:
specialDate:
- 类型:数组
- 描述:(可选项)需要标记的特殊日期数组
- 内部字段:
switchMode:
- 类型:字符串
- 描述:(可选项)月份的切换方式
- 默认值:'vertical'
- 取值范围:
- vertical(上下切换)
- horizontal(左右切换)
- none(不支持通过手势切换月份)
isBefore:
- 类型:布尔
- 描述:(可选项)今天以前的日期是否置灰不可选
- 默认值:false
isAfter:
- 类型:布尔
- 描述:(可选项)今天以后的日期是否置灰不可选
- 默认值:false
showTodayStyle:
- 类型:布尔
- 描述:(可选项)当天日期是否使用特殊格式显示(仅android有效)
- 默认值:true
fixedOn:
- 类型:字符串类型
- 描述:(可选项)模块视图添加到指定 frame 的名字(只指 frame,传 window 无效)
- 默认:模块依附于当前 window
fixed:
- 类型:布尔
- 描述:(可选项)模块是否随所属 window 或 frame 滚动
- 默认值:true(不随之滚动)
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setSpecialDates
设置特殊日期
setSpecialDates({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
specialDates:
- 类型:数组
- 描述:需要标记的特殊日期数组,格式为:yyyy-MM-dd
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
cancelSpecialDates
取消已设置的特殊日期状态
cancelSpecialDates({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
specialDates:
- 类型:数组
- 描述:需要取消的特殊日期组成的数组,格式为:yyyy-MM-dd
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
close
关闭日历
close({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
show
显示日历
show({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hide
隐藏日历
hide({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
nextMonth
显示下个月
nextMonth({params},callback(ret))
params
id:
- 类型:数字类型
- 描述:日历视图id
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
prevMonth
显示上个月
prevMonth({params},callback(ret))
params
id:
- 类型:数字类型
- 描述:日历视图id
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
nextYear
显示下一年
nextYear({params},callback(ret))
params
id:
- 类型:数字类型
- 描述:日历视图id
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
prevYear
显示上一年
prevYear({params},callback(ret))
params
id:
- 类型:数字类型
- 描述:日历视图id
callback(ret, err)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setDate
设置选中日期(不支持日期多选模式)
setDate({params}, callback(ret))
params
id:
- 类型:数字类型
- 描述:日历视图id
date:
- 类型:字符串
- 描述:(可选项)选中日期,格式为:yyyy-MM-dd
- 默认值:当前日期
ignoreSelected:
- 类型:布尔
- 描述:(可选项)选中日期是否忽略选中日期样式(open -> styles -> date -> selectedColor、selectedBg)
- 默认值:false
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
turnPage
翻到指定的页
turnPage({params})
params
id:
- 类型:数字类型
- 描述:日历视图id
date:
- 类型:字符串
- 描述:选中日期,格式为:yyyy-MM
示例代码
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
论坛示例
为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码、知识点讲解、注意事项等,供您参考。
下载地址:微信扫一扫,关注下方【毕业设计组织】公众号,请回复数字”6909“获取下载链接
