微信小程序如何制作可拖动悬浮图标，包含按钮角标功能？

本文共计886个文字，预计阅读时间需要4分钟。

在制作商城类微信小程序的过程中，我们经常会遇到需要增加可拖动悬浮图标的情况。下面简单介绍一下可拖动悬浮按钮的实现方法。

运行截图：

主要代码：javascriptjs: var startPointPage={ data: { dragging: false, startX: 0, startY: 0, endX: 0, endY: 0 }, touchStart: function(e) { this.setData({ dragging: true, startX: e.touches[0].pageX, startY: e.touches[0].pageY }); }, touchMove: function(e) { if (this.data.dragging) { this.setData({ endX: e.touches[0].pageX, endY: e.touches[0].pageY }); } }, touchEnd: function(e) { if (this.data.dragging) { this.setData({ dragging: false }); // 这里可以添加拖动结束后的逻辑，例如保存位置等 } }}

在制作商城类微信小程序的过程中，我们经常会碰到需要增加可拖动悬浮图标的情况，本文简单的介绍一下可拖动悬浮按钮的实现。