计划助手V1.0-微信小程序(QQ小程序)-源代码分享

疫情期间,开发者利用空闲时间创建了《计划助手》小程序,用于记录和管理个人小目标的时间,支持微信和QQ版本。该应用能帮助用户追踪目标进度,分析时间分配,即使在离线状态下也能使用。

疫情期间在家感觉好无聊啊,于是利用空闲时间做了一个用来记录和管理小目标时间的小程序,命名为《计划助手》。

QQ版本小程序同步上线,QQ小程序叫《计划助手》,欢迎大家前来体验,后期也会添加其他的新功能哦~

【区别】:微信小程序的代码与QQ小程序的源码是不一样的。

微信小程序的源码基于微信小程序云开发,需要在有网络的情况下使用,具有同步功能,所有记录在删除小程序后并不会自动不会消失,需要手动删除。

QQ小程序是基于本地存储,可以离线使用,因此当删除QQ小程序的时候所有的记录也会消失。

【注】:本小程序的源码获取方式见文章底部,后续会继续更新~

原文链接:​https://www.cnblogs.com/LiangSenCheng/p/12543230.html​

1.功能简介

     这个小程序第一个版本的结构比较简单,主要功能就是用来管理和记录你在某个小目标上所花费的时间,等回过头来一看。哦!原来我看了一个小时的书、上了二十分钟的厕所、吃了三十分钟的饭等等。

      以上的一切都可以记录,不仅仅可以看到你实现每个小目标的次数、还能看到每次在这个小目标上所花费的时间,甚至可以看到不同小目标之间的时间比例。

2.使用方法

 小沙漏使用的方法非常简单,只需点击右下角的“+”号,添加一个小目标,选择你想要实现的小目标,点击“开始记录”。

    如果中途有事情要打断一下,点击“暂停记录”,回来的时候继续记录。

    当你完成这个小目标的时候,点击“结束并保存”,然后可以对本次的小目标做一个“感想或者总结”,也可以啥也不说,默默保存记录。

    当然你也可以中途取消这个小目标,但是取消了就没有这一次的小记录了哦~

    如果你想彻底放弃这个小目标,那么你也可以删掉它。

    又或者你觉得一开始起的小目标的名字不够完美,你也可以重新给这个小目标起一个足够响亮的名字。

3.功能预览

3.1欢迎使用

3.2 先给自己定一个小目标

3.3 开始记录小目标

3.4 查看或记录小目标历史

3.5 总结小目标

3.6所有小目标分析

4.温馨提示

    小程序在后台也能记录哦!并且在首页可以快速返回到还没有结束的小目标。但是千万别清理后台

5.微信小程序体验

6.QQ小程序体验

由于还没整理好文档,所以暂时不发布到github开源,先通过下面的方式获取源码。

附:lx164 (荷鹤鹤) · GitHub

源码获取方式:

1、 开源分享汇 ,后台回复【小沙漏】,即可获得源码!

2、直接 计划助手V1.0-微信小程序(QQ小程序)-源代码分享 - LiangSenCheng小森森 - 博客园页面顶部的右边,请备注【小沙漏】,直接找我要源码!

> 备用联系方式:点击这里

<think> 首先,用户的问题是:"我想查找微信小程序实现视频倍速播放的方法 请问微信小程序实现视频倍速播放的方法"。用户明确询问微信小程序中实现视频倍速播放的方法。 从系统级指令看,我需要: - 所有行内数学表达式使用$...$格式(但这里可能不涉及数学,所以可能不需要)。 - 独立公式使用$$...$$并单独成段(同理,可能不适用)。 - LaTeX语法正确(但内容主要是代码和描述)。 - 使用中文回答。 - 生成相关问题(在回答末尾)。 - 引用的段落末尾添加引用标识如[^1]。 用户提供了几个引用: - [^1]:描述Video组件的playbackRate API,支持倍率如0.5, 0.8, 1.0, 1.25, 1.5,并给出demo链接。 - [^2]:提到在onReady中使用videoContext.playbackRate(2)设置倍率,并讨论其他功能如禁止拖动进度条。 - [^3]:简明地说设置视频倍数this.videoContext.playbackRate(1.5)- [^4]:展示如何在事件处理器中设置倍率,如selectMultiple函数中使用this.videoContext.playbackRate(Number(value))。 用户说:"上述引用仅供参考,并不是用户真正的需求,请尽可能多的参考用户上一次的问题和你的回答。" 但这是第一条消息,所以没有上一次的问题。我必须基于当前查询回答。 我的回答需要结构清晰,帮助用户逐步解决问题,尽量真实可靠。 关键点:实现视频倍速播放的核心是使用VideoContext的playbackRate方法。引用中提到的倍率包括0.5, 0.8, 1.0, 1.25, 1.5,在较新版本支持2.0。 步骤分解: 1. 创建Video组件在WXML中。 2. 在JS中创建VideoContext。 3. 调用playbackRate方法设置倍率。 我应该逐步解释: - 首先,在WXML中添加video标签。 - 然后,在JS中获取videoContext。 - 最后,调用playbackRate设置倍率。 引用中提到的事件如onReady,以及如何通过按钮触发倍率改变(如[^4])。 所以,回答结构: 1. 简述实现方法。 2. 详细步骤:WXML部分,JS部分(创建context,设置倍率)。 3. 示例代码(基于引用)。 4. 注意事项(如支持倍率范围)。 5. 结尾添加相关问题。 生成相关问题:基于用户查询,相关问题可能包括: - 如何动态改变倍速? - 支持哪些倍率? - 如何实现UI控件如倍速选择按钮? - 是否有兼容性问题? - 如何监听倍速变化? 使用中文回答。 引用标识:在引用信息末尾添加[^1], [^2]等。 组织回答: - 引言:直接回答用户问题。 - 主体:分步指南。 - 代码示例。 - 结尾:相关问题。 确保真实可靠:基于微信官方文档和引用。 完整回答结构: 1. 简要介绍:微信小程序实现视频倍速播放的核心是使用VideoContext的playbackRate方法。 2. 实现步骤: - WXML中定义video组件。 - JS中创建VideoContext。 - 设置倍率,可以在生命周期事件或自定义事件中调用。 3. 代码示例:提供简单示例。 4. 注意事项:如倍率范围、版本支持。 5. 相关问题。 生成相关问题: 1. 如何在微信小程序中动态调整视频倍速? 2. Video组件的playbackRate方法支持哪些倍率值? 3. 如何实现一个倍速选择器UI? 4. 视频倍速播放有哪些常见问题及解决方案? 5. 倍速播放是否影响视频的其他功能如进度条拖动? 引用标识:例如,在描述API时引用[^1],在事件处理时引用[^2]、[^4]。 </think> ### 微信小程序实现视频倍速播放的方法 微信小程序中实现视频倍速播放功能的核心是使用 `VideoContext` 对象的 `playbackRate` 方法。该方法允许动态设置视频播放速率,支持倍率如 0.5、0.8、1.01.25、1.5,并在较新版本(微信客户端基础库 2.6.3 及以上)支持 2.0 倍速[^1][^2][^3]。以下是详细实现步骤: #### 1. **WXML 文件:定义 Video 组件** 在 WXML 文件中添加 `video` 组件,并指定一个唯一 ID(例如 `id="myVideo"`),用于在 JS 中获取上下文。同时,可以添加 UI 控件(如按钮)来触发倍速切换: ```xml <video id="myVideo" src="{{videoSrc}}" controls></video> <!-- 倍速选择按钮示例 --> <view class="btns"> <button bindtap="setRate" data-rate="0.5">0.5x</button> <button bindtap="setRate" data-rate="1.0">1.0x</button> <button bindtap="setRate" data-rate="1.5">1.5x</button> </view> ``` #### 2. **JS 文件:创建 VideoContext 并设置倍率** - **创建 VideoContext**:在页面的 `onReady` 生命周期中,使用 `wx.createVideoContext` 创建视频上下文。 - **设置倍率**:可直接在 `onReady` 中设置默认倍率,或通过事件处理函数动态调整倍率。 - **关键方法**:使用 `this.videoContext.playbackRate(rate)` 设置倍率,其中 `rate` 为数值类型。 示例代码: ```javascript Page({ data: { videoSrc: &#39;https://example.com/video.mp4&#39;, // 替换为实际视频 URL }, onReady: function() { // 创建 video 上下文 this.videoContext = wx.createVideoContext(&#39;myVideo&#39;); // 设置默认倍速(可选) this.videoContext.playbackRate(1.0); // 默认 1.0 倍速[^3] }, // 事件处理函数:通过按钮切换倍速 setRate: function(e) { const rate = Number(e.currentTarget.dataset.rate); // 获取倍率值 this.videoContext.playbackRate(rate); // 设置倍速[^4] wx.showToast({ title: `已切换至 ${rate}x 倍速`, icon: &#39;none&#39; }); } }); ``` #### 3. **注意事项** - **倍率范围**:官方支持的倍率为 0.5、0.8、1.01.25、1.5(基础库版本 ≥2.6.3 时支持 2.0)[^1][^3]。超出范围的值可能导致播放异常。 - **上下文初始化**:VideoContext 必须在 `onReady` 或之后的事件中创建,确保视频组件已渲染完成[^2]。 - **兼容性**:低版本微信客户端可能不支持某些倍率,建议检查基础库版本(通过 `wx.getSystemInfoSync()`)。 - **UI 集成**:如需隐藏进度条或自定义控件,可结合 `video` 组件的属性(如 `controls="{{false}}"`)并在 JS 中实现逻辑[^2]。 #### 4. **完整 Demo 参考** - 微信官方提供了一个实现倍速播放的示例:[Demo 链接](https://developers.weixin.qq.com/s/w5mgzamw7454)[^1]。 - 更多功能(如禁止拖动进度条、视频黑边处理)可参考[官方文档](https://developers.weixin.qq.com/miniprogram/dev/api/media/video/VideoContext.html)[^2]。 通过以上步骤,您可以在微信小程序中轻松实现视频倍速播放功能。如果倍速设置未生效,请检查视频源是否支持变速处理或更新微信客户端版本[^1][^3]。
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

开源分享汇

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值