参加比赛的作品,开发周期一个月,使用了 Wafer2 框架,后台采用腾讯云提供的 Node.js SDK 接入对象存储 API ,前端核心代码实现了类似于图片编辑器的功能,支持图片和文字的移动、旋转、缩放、生成预览图以及编辑状态的保存,动画部分采用 CSS 动画实现小程序中的模态输入框部分使用了自己封装的 InputBox 组件代码已移除 AppId 等敏感信息,可自行添加自己的 AppId 和 AppSecret 以配置后台环境,实现登录测试,详细添加方法见下文「使用方法」,若本地运行可通过修改 app.json 文件中 page 字段的顺序来查看不同页面微信小程序定制需求请联系作者微信:aweawds (注明来意)效果展示      使用方法首先点击右上角 Star ʕ •ᴥ•ʔ获取Demo代码执行 git clone https://github.com/goolhanrry/Weapp-Demo-LemonJournal.git或 点击此处 下载最新版本的代码解压后在微信开发者工具中打开 Weapp-Demo-LemonJournal 文件夹即可如需进行登录测试,还要执行以下步骤准备好自己的 AppId 和 AppSecret(可在微信公众平台注册后获取)在 project.config.json 的 appid 字段中填入 AppId在 /client/utils/util.js 中相应位置填入 AppId 和 AppSecret在微信开发者工具中重新导入整个项目,上传后台代码后编译运行即可核心代码组件的移动、旋转和缩放主要思路是把  标签(对应图片)和  标签(对应文字)封装在同一个自定义组件  中,通过对外暴露的 text 变量是否为空来进行条件渲染,然后绑定 onTouchStart() 、onTouchEnd() 和 onTouchMove() 三个事件来对整个组件的位置、角度、大小、层级以及 “旋转” 和 “移除” 两个按钮的行为进行操作onTouchStart: function (e) {     // 若未选中则直接返回     if (!this.data.selected) {         return     }     switch (e.target.id) {         case 'sticker': {             this.touch_target = e.target.id             this.start_x = e.touches[0].clientX * 2             this.start_y = e.touches[0].clientY * 2             break         }         case 'handle': {             // 隐藏移除按钮             this.setData({                 hideRemove: true             })             this.touch_target = e.target.id             this.start_x = e.touches[0].clientX * 2             this.start_y = e.touches[0].clientY * 2             this.sticker_center_x = this.data.stickerCenterX;             this.sticker_center_y = this.data.stickerCenterY;             this.remove_center_x = this.data.removeCenterX;             this.remove_center_y = this.data.removeCenterY;             this.handle_center_x = this.data.handleCenterX;             this.handle_center_y = this.data.handleCenterY;             this.scale = this.data.scale;             this.rotate = this.data.rotate;             break         }     } }, onTouchEnd: function (e) {     this.active()     this.touch_target = ''     // 显示移除按钮     this.setData({         removeCenterX: 2 * this.data.stickerCenterX - this.data.handleCenterX,         removeCenterY: 2 * this.data.stickerCenterY - this.data.handleCenterY,         hideRemove: false     })     // 若点击移除按钮则触发移除事件,否则触发刷新数据事件     if (e.target.id === 'remove') {         this.triggerEvent('removeSticker', this.data.sticker_id)     } else {         this.triggerEvent('refreshData', this.data)     } }, onTouchMove: function (e) {     // 若无选中目标则返回     if (!this.touch_target) {         return     }     var current_x = e.touches[0].clientX * 2     var current_y = e.touches[0].clientY * 2     var diff_x = current_x - this.start_x     var diff_y = current_y - this.start_y     switch (e.target.id) {         case 'sticker': {             // 拖动组件则所有控件同时移动             this.setData({                 stickerCenterX: this.data.stickerCenterX   diff_x,                 stickerCenterY: this.data.stickerCenterY   diff_y,                 removeCenterX: this.data.removeCenterX   diff_x,                 removeCenterY: this.data.removeCenterY   diff_y,                 handleCenterX: this.data.handleCenterX   diff_x,                 handleCenterY: this.data.handleCenterY   diff_y             })             break         }         case 'handle': {             // 拖动操作按钮则原地旋转缩放             this.setData({                 handleCenterX: this.data.handleCenterX   diff_x,                 handleCenterY: this.data.handleCenterY   diff_y             })             var diff_x_before = this.handle_center_x - this.sticker_center_x;             var diff_y_before = this.handle_center_y - this.sticker_center_y;             var diff_x_after = this.data.handleCenterX - this.sticker_center_x;             var diff_y_after = this.data.handleCenterY - this.sticker_center_y;             var distance_before = Math.sqrt(diff_x_before * diff_x_before   diff_y_before * diff_y_before);             var distance_after = Math.sqrt(diff_x_after * diff_x_after   diff_y_after * diff_y_after);             var angle_before = Math.atan2(diff_y_before, diff_x_before) / Math.PI * 180;             var angle_after = Math.atan2(diff_y_after, diff_x_after) / Math.PI * 180;             this.setData({                 scale: distance_after / distance_before * this.scale,                 rotate: angle_after - angle_before   this.rotate             })             break         }     }     this.start_x = current_x;     this.start_y = current_y; }编辑状态的保存一篇手帐包含的组件类型包括 sticker(软件自带的贴纸)、image(用户上传的图片)和 text(自定义文字)三种,全部保存在一个如下格式的 json 对象中,每个独立组件都包含了一个不重复的 id 以及相关的信息,保存时由客户端生成该对象并编码成 json 字符串存储在数据库,恢复编辑状态时通过解析 json 字符串获得对象,再由编辑页面渲染{     "backgroundId": "5",                                        背景图id     "assemblies": [         {             "id": "jhjg",                                       组件id             "component_type": "image",                          组件类型(自定义图片)             "image_url": "https://example.com/jhjg.png",        图片地址             "stickerCenterX": 269,                              中心横坐标             "stickerCenterY": 664,                              中心纵坐标             "scale": 1.7123667831396403,                        缩放比例             "rotate": -3.0127875041833434,                      旋转角度             "wh_scale": 1,                                      图片宽高比             "z_index": 19                                       组件层级         },         {             "id": "gs47",             "component_type": "text",                           组件类型(文字)             "text": "test",                                     文字内容             "stickerCenterX": 479,             "stickerCenterY": 546,             "scale": 1.808535318980528,             "rotate": 29.11614626607893,             "z_index": 10         },         {             "id": "chjn",             "component_type": "sticker",                        组件类型(贴纸)             "sticker_type": "food",                             贴纸类型             "sticker_id": "1",                                  贴纸id             "image_url": "https://example.com/weapp/stickers/food/1.png",             "stickerCenterX": 277,             "stickerCenterY": 260,             "scale": 1.3984276885130673,             "rotate": -16.620756913892055,             "z_index": 5         }     ] }
2025-08-09 09:39:27 6.81MB 开源项目
1
在本篇学习笔记中,我们将深入探讨如何使用Qt/C++开发一个基于TCP协议的服务器端程序,该程序具有发送图片和文字的聊天功能。TCP(传输控制协议)是一种面向连接的、可靠的、基于字节流的传输层通信协议。在构建一个TCP服务器时,主要涉及网络编程的基础知识,包括套接字(Socket)的使用、网络通信的建立、数据的封装和解封以及异常处理等。 创建一个TCP服务器需要启动一个监听端口,等待客户端的连接请求。在Qt框架中,可以使用QTcpServer类来实现这一功能。QTcpServer会监听指定的端口,并在接收到连接请求时发出信号。服务器端的程序通常需要处理QTcpServer的connected()信号,以便在客户端连接成功后执行后续的操作。 在客户端与服务器端建立起连接后,服务器需要能够处理来自客户端的各种数据。由于TCP协议保证了数据包的顺序和可靠性,服务器端在接收到数据时可以认为是按照发送顺序且完整无误地到达的。根据本学习笔记的目标,服务器端需要能够分别处理文字消息和图片数据。这通常需要服务器能够识别数据包的类型,并采取不同的处理方式。 处理文字消息相对简单,服务器只需接收字节流,然后根据协议转换成字符串即可。但处理图片数据会复杂一些,因为需要考虑到图片数据量可能较大。此时,服务器除了要能够识别图片数据包,还需要能够高效地管理内存,避免因一次性接收大量数据而导致内存溢出。在Qt中,可以通过QTcpSocket的readyRead()信号来检测是否有数据到达,并读取数据。 除了接收数据外,服务器还需要能够向客户端发送数据。无论发送文字还是图片,都需要将数据封装成适合TCP传输的格式。在Qt/C++中,可以通过QTcpSocket的write()函数来发送数据。当发送操作完成时,write()函数会触发bytesWritten()信号,服务器可以通过此信号来确认数据已发送。 开发一个具有聊天功能的服务器端程序,还需要考虑到多线程或异步处理机制。由于服务器可能会同时处理来自多个客户端的请求,单线程的处理方式将很难满足性能需求。因此,需要合理利用Qt的线程机制,如使用QThread或QtConcurrent等,以保证服务器能够有效地并行处理多个客户端的连接和数据交互。 为了确保服务器程序的稳定性和可用性,异常处理机制是不可或缺的。服务器端程序需要能够正确处理断线、数据包损坏、协议不匹配等各种异常情况,以避免程序崩溃或出现安全漏洞。 总结以上,一个基于TCP的可发送图片、文字聊天程序的服务器端实现涉及到套接字编程、数据包处理、多线程编程以及异常处理等多个方面的知识。通过本学习笔记的学习,读者应该能够掌握构建基本的TCP服务器端程序所需的核心技能,为开发更复杂的网络应用打下坚实的基础。
2025-06-30 13:07:48 6KB 网络协议
1
在本项目"machine-learning-LAB2-微信小程序demo"中,我们将探讨如何将机器学习技术应用于微信小程序的开发。这个项目可能包含一系列的教程、代码示例和实践案例,旨在帮助开发者了解如何在微信小程序环境中集成和应用机器学习模型。 让我们关注“机器学习”这一标签。机器学习是人工智能的一个分支,它允许计算机通过数据学习和改进,而无需显式编程。在这个项目中,我们可能涉及到监督学习、无监督学习或强化学习等不同类型的机器学习算法。例如,监督学习可以用于预测任务,如分类(如文本分类)或回归(如房价预测);无监督学习则可能用于聚类分析,帮助识别用户群体;而强化学习可能用于优化决策过程,比如推荐系统。 接下来,我们看到“微信小程序”这一标签。微信小程序是腾讯公司推出的一种轻量级的应用开发平台,它允许开发者快速构建可以在微信内部运行的应用,无需下载安装即可使用。在微信小程序中集成机器学习,可以为用户提供更智能、个性化的体验,比如实时图像识别、语音识别或者基于用户行为的推荐服务。 项目中提到的"软件/插件"标签可能意味着该项目可能包含一些用于处理机器学习任务的第三方库或工具。在微信小程序中,开发者通常会利用如TensorFlow.js或Paddle.js这样的JavaScript库来运行机器学习模型,这些库能够将预训练模型转化为可以在小程序环境中执行的形式。 压缩包文件"machine_learning_LAB2-master (4).zip"可能包含以下内容: 1. 项目文档:介绍项目目标、技术栈和实现步骤的README文件。 2. 代码文件:包含实现机器学习功能的JavaScript代码,可能有专门处理数据预处理、模型训练、模型部署和预测的文件。 3. 数据集:用于训练和测试机器学习模型的样本数据。 4. 模型文件:预训练的机器学习模型或权重文件。 5. 小程序界面资源:包括HTML、CSS和图片等,用于构建微信小程序的用户界面。 6. 示例用例:演示如何在小程序中调用和使用机器学习模型的实例代码。 通过这个项目,开发者可以学习到如何在微信小程序环境中处理数据、训练模型、优化性能以及与用户界面进行交互。这不仅可以提升开发者在微信小程序开发中的技能,还可以让他们了解如何在移动端应用中实现实时的智能服务。同时,对于想要了解微信小程序与机器学习结合的初学者来说,这是一个很好的实践平台,可以深入理解这两个领域的交叉应用。
2025-06-03 10:07:48 46.28MB 机器学习 微信小程序
1
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
2025-05-19 11:44:43 47KB
1
《Atlas通信例程:拧紧枪程序Demo解析》 在自动化生产和装配领域,拧紧工具如拧紧枪的精准控制是至关重要的。阿特拉斯(Atlas)作为知名的工业设备制造商,提供了一套基于开放协议的通信系统,使得与拧紧枪的交互变得更加便捷。本文将深入探讨一个关于Atlas通信例程的简易Demo,该Demo主要用于获取拧紧枪的扭矩和角度数据,并运行在.NET Framework 4.5.2环境下,可升级至4.8版本。 我们需要了解.NET Framework,这是一个由微软开发的软件框架,为开发和运行基于.NET的应用程序提供了基础。4.5.2版本是其早期的一个稳定版本,而4.8则是该框架的最新版本,它包含了更多的性能优化和安全改进。对于这个拧紧枪的通信Demo,升级到4.8可以确保最佳的运行效果和最新的技术特性支持。 Atlas的开放协议是实现与拧紧枪通信的关键。它定义了设备间的通信规范,允许用户通过标准接口获取拧紧过程中的实时数据,如扭矩、角度等。这些数据对于质量控制和生产效率至关重要。拧紧枪的扭矩和角度控制直接影响到产品的紧固质量,因此准确地获取和分析这些参数对于工艺优化具有重要意义。 在AtlasTest这个Demo中,我们可能看到以下几个核心部分: 1. 连接管理:程序需要初始化并建立与拧紧枪的连接,这通常涉及到设置通信参数(如波特率、校验位等)以及处理连接错误。 2. 数据请求:通过特定的命令结构,程序向拧紧枪发送请求,获取扭矩和角度数据。这可能涉及到解析阿特拉斯的通信协议,理解如何构造和发送正确的控制命令。 3. 数据解析:接收到的原始数据需要进行解析,转化为人类可读或进一步处理的格式。这可能涉及到二进制数据转换和错误检查。 4. 实时反馈:程序可能会有一个用户界面,实时显示拧紧枪的状态和测量结果,以便操作员监控和调整。 5. 断开连接:在工作完成后,程序会安全地断开与拧紧枪的连接,确保资源得到释放。 虽然公开的资料较少,但这个Demo提供了一个学习和理解Atlas通信机制的良好起点。开发者可以通过此示例学习如何构建自己的应用程序,以实现更复杂的拧紧控制策略,如动态调整扭矩目标、记录历史数据等。 总结来说,Atlas通信例程(拧紧枪)程序Demo是一个实用的工具,它展示了如何利用.NET Framework和阿特拉斯的开放协议与拧紧枪进行有效通信。通过对这个Demo的深入理解和实践,开发者能够掌握与自动化拧紧设备交互的核心技术,从而提升生产自动化水平和产品质量。
2024-09-04 15:25:56 78KB 网络 Atlas 阿特拉斯 开放协议
1
国内最火温湿度传感器应用例程与整套开发资料。
2024-05-17 16:19:06 4KB AHT20 驱动程序
1
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
2024-05-01 17:24:39 691KB
1
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
2024-01-02 10:49:42 409KB
1
使用场景:使用在android平台,内有demo,和相应的文档;
2023-08-21 14:31:51 129KB 国密算法 android
1
通过腾讯云物联网通信实现小程序控制灯风扇、获取环境信息,适用于单片机与腾讯云mqtt,里面有云端获取设备状态函数以及发布主题函数
2023-04-04 14:04:36 306KB 微信小程序demo
1