在小程序的过程中,往往会遇到类似签到、打卡、记事、待办、提醒等相关主题的需求。而这类需求往往与时间强相关,且时间粒度往往是在「天」上,这就需要有一个组件来呈现以天为单位的展示需求。于是我们自然而然地想到了「日历」。
日历具有通用性、一次免维护、无需运营、无需网络连接、无需用户授权等优点,满足小程序插件「轻巧普适」的要求,很适合实现。
「极点日历」小程序插件各部分属性如下图:
目前「极点日历」插件信息:
: 926858046
版本:1.1.0
1. 搜索插件
在微信小程序管理后台——设置——第三方服务,按 (926858046)搜索到该插件并申请授权。
2. 引入
在要使用该插件的小程序 . 文件中引入插件。
3. 添加配置
在需要使用到该插件的小程序页面的 配置文件中,做以下配置:
4. 嵌入插件
在相应的 页面中添加以下语句即可完成插件的嵌入。
添加插件后效果如图:
默认用法,将具备以下样式特点:
显示当前月份的日历;
显示日历标题、显示上下月按钮;
显示周标题,周标题默认为 类型,即英文字母;
不显示非当前月的日期;
不显示农历;
插件占据文档流的整块宽度,即 :100%。
以上样式均可参考 属性文档更改。
日历插件本身是无背景色(透明)的,日历标题和周标题字体颜色默认为黑色加粗,当月日期默认字体颜色为 #4474,非当前月日期字体颜色为 #361。我们通过一个例子来说明如何自定义插件的样式。
1. 修改日历背景颜色
- 样式位插组件的根节点。假设要更改日历的背景色,除了插件件的父级容器设置背景色外,也可以通过该样式类进行配置来达到相应的效果。
首先在 文件里指定 - 的外部样式类为 :
在 文件新增 - 属性更改背景颜等,效果如下图。:
2. 修改日历标题样式
- 样式类位于组件的日历标题。对该组件进行配置,可以改变当前年月,上下月按钮的外观和背景。
在上面例子的基础上,我们在 文件中新增代码:
在 文件中添加 样式:
3. 修改日历主面板
- 样式类位于日历组件的主面板,包含了周标题和日期部分。对该组件进行配置,可以改变周标题的样式和日期面板的样式。
紧跟上面的例子,我们对 文件加多一行代码。
在 文件中新增 样式
效果如下:
4. 禁用上下月按钮,显示更多的日期
在 文件中,加入以下配置,可以使日历不能翻页,同时将次月的日期也显示出来。
5. 添加日期样式
日期的样式,可以通过对属性 - 进行配置,在 文件中,添加以下数组,对日期样式进行定义。
在 文件中,加入以下配置,即可完成整个 的制作。
效果如下:
当然,除了外部样式修改,每一个插件内点击事件都添加了监听,使用者可自行扩展。
「极点插件」适用范围很广,可进行充分的个性化定制。目前「全民单词」小程序已在首页应用,背景使用了渐变色,具体实现代码放在 中实时更新。
除此之外,我们还为你准备了几款配色 可供参考。
关注「知晓程序」公众 ,在微信后台回复「」,获取小程序技巧大全。