- 综合排序
- 最热优先
- 最新优先
- 来自专栏娱乐心理测试
小程序的拖拽、缩放和旋转手势
twoPoint.x2 = e.touches[1].pageX * 2 twoPoint.y2 = e.touches[1].pageY * 2 // 计算角度，旋转 )*180/Math.PI if (Math.abs(perAngle - curAngle) > 1) { that.setData({ msg: '旋转
1.7K40发布于 2018-06-08 开源：16点位，6特性，拖拽旋转库（DDR）
一句话总结超丝滑拖拽旋转库，16点位，带边界检测，圆角控制，动态位置指示器，拖拽旋转无抖动，动态箭头，完全开源拖拽库，坐标精准，旋转后，坐标始终为左上角那个点的坐标前言目前拖拖拽拽的项目非常流行比如低代码 而这些离不开前端底层的拖拽框架基于canvas实现的拖拽框架，非常丝滑，自由度高，但是做一些复杂业务难度较大所以使用div+css+js实现了一款16点拖拽旋转的库没有耐心看文章的同学，可以直接访问：https ://ddr.mx2d.cn/特性一：16点位我们来看看16个点分别是哪些上下左右四条边算4个点，可调整大小4个顶点可以拖拽，可同时调整两条边的大小顶点边缘有4个点，可拖拽旋转内置4个点可调整圆角大小（ 默认不开启）特性二：旋转无抖动无论是高速拖拽，还是旋转后拖拽，都没有抖动，非常丝滑。 ，分4个象限，每个顶点比较两条边，做了16次判断特性四：自带指示器这可不是一个普通的指示器，而是一个动态的指示器如果当前在拖拽，则显示坐标如果是调整大小，则显示宽高如果是旋转则显示度数厉害吧,跟达文西学的
7910编辑于 2026-05-06- 来自专栏小孟开发笔记
微信小程序单指拖拽和双指缩放旋转
小程序单指拖拽和双指操作是一个比较常用的功能，效果如下图 实现这三个功能，主要用三个触摸事件touchstart、touchmove、touchend <view style="height: 100vh translateY: 0, // 位移y坐标 单位px distance: 0, // 双指接触点距离 scale: 1, // 缩放倍数 rotate: 0, // <em>旋转</em>角度 : [] // 起始点touch数组 }, }) 单指<em>拖拽</em> 单指<em>拖拽</em>比较简单，只需要记录移动的点坐标，然后减去起始点坐标，就可以求出针对页面的移动距离 touchstart touchStart(e == 2) { // 单指<em>拖拽</em> this.setData({ translateX: onePageX - startMove.x, translateY: == 2这个判断的原因是防止图片跳动，因为如果你两个手指触摸，然后离开一个手指，我是禁止<em>拖拽</em>的，只有双指都离开后再次触摸才能单指<em>拖拽</em> 双指<em>旋转</em> 双指<em>旋转</em>的原理是根据三角函数求出起始点的角度，然后再求出移动坐标的角度
3.9K31编辑于 2023-03-07 - 来自专栏Unity3D
【Unity3D】鼠标拖拽物体实现任意角度自旋转
Unity3d鼠标拖拽物体实现任意角度自旋转 主要涉及函数 Input.GetAxis(“Mouse x”) 可取得鼠标横向（x轴）移动增量 Input.GetAxis(“Mouse y”) 可取得鼠标竖向 （y轴）移动增量 通过勾股定理获取拖拽长度，长度越长旋转越快 在project setting--Input 可以设置 代码分享 UnityEngine; System.Collections; public void startRoate : MonoBehaviour { private bool onDrag = false; //是否被拖拽// public float speed = 6f; //旋转速度// private float tempSpeed; //阻尼速度// private float axisX = 1; //鼠标沿水平方向移动的增量// { // this.transform.Rotate(new Vector3(axisY, axisX, 0) * Rigid(), Space.World); //这个是是按照之前方向一直慢速旋转
5.4K30发布于 2020-03-11 - 来自专栏悠扬前奏的博客
LintCode-8.旋转字符串
题目 描述 给定一个字符串和一个偏移量，根据偏移量旋转字符串(从左向右旋转) 样例 对于字符串 "abcdefg". offset=0 => "abcdefg" offset=1 => "gabcdef
56220发布于 2019-05-28 - 来自专栏前端 TS/JS 核心讲堂
js拖拽-javascript拖拽缩放示例
一、两种主流实现方式方式 1：使用 HTML5 原生 Drag & Drop API（推荐用于跨容器拖拽）✅ 标准化，浏览器原生支持✅ 支持文件拖入、跨 iframe 拖拽❌ 事件模型复杂，样式控制受限 ❌ 移动端兼容性差方式 2：基于 mousedown mousemove mouseup 的自定义拖拽（推荐用于 UI 组件内部拖拽）✅ 完全可控，性能高✅ 可精细控制动画、边界、吸附等效果✅ 兼容性极佳 “抓”在点击点 在 document 上监听 mousemove/mouseup 避免鼠标移出元素后失效三、高级拖拽：可拖拽、可冻结、可编辑、可排序如我早期另一篇文章-用JS/HTML/CSS 构建可拖拽 DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-<em>8</em>" /> <meta name="viewport" content=" margin-top: 15px; display: flex; gap: 10px; } button { padding: <em>8</em>px
15421编辑于 2026-04-01 拖拽RecyclerView
挥别第三方库：原生ItemTouchHelper掌控RecyclerView拖拽与侧滑原始译文参考：开发技术前线（原作者：PaulBurke/译者：objectlife）如果你还在使用残破累赘的第三方库 （比如早期的SwipeToDismiss）或者深陷于手写GestureDetector和onInterceptTouchEvent的泥沼来处理列表的侧滑删除和长按拖拽，那你需要立刻停下。 不仅仅是手势的剥离，它直接掌控了拖拽中悬浮视图的z-轴阴影（elevation抬升）、回位动画轨迹（dropsettling）甚至支持自定义约束方向。
6110编辑于 2026-04-25- 来自专栏coding个人笔记
js拖拽
开发了那么久，对于js实现拖拽多少都写过，用于实际项目却没有。 先看一下之前写的： 如果鼠标慢慢移动，拖拽是没有任何问题的，如果速度快了，那么鼠标和元素就会分离。
6.9K30发布于 2020-04-24 - 来自专栏用户7873631的专栏
js拖拽
/*js拖拽逻辑: 第一：为什么要定位? 因为 ? 往左往上left top要定位的哈 第二：为什么点击down包括着移动move与抬起up. 因为代表这三个是不独立的. 鼠标是400.那样的话,400-(150-100)=350.就是div所在的位置.也就是move后的位置. js拖拽: <! DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>"> <meta name="viewport" content="width=device-width
6.1K41发布于 2020-10-30 - 来自专栏用户7873631的专栏
js拖拽
doctype html> <html> <head> <meta charset="utf-<em>8</em>"> <title></title> <style type="text
6.6K10发布于 2020-10-28 使用纯opencv部署yolov8旋转框目标检测
其中，旋转框检测是YOLOv8的一项重要特性，它可以有效地检测出不同方向和角度的物体。 旋转框检测的原理是通过预测物体的边界框和旋转角度来实现的。 在YOLOv8中，神经网络不仅预测了物体的边界框位置，还预测了物体的旋转角度。这意味着YOLOv8可以检测出不同方向和角度的物体，而不仅仅是正面的物体。 通过旋转框检测，YOLOv8在处理具有挑战性的物体检测任务时具有更大的灵活性。例如，在处理包含不同方向和角度的物体的图像时，旋转框检测可以提供更准确的检测结果。 此外，在处理某些具有特殊形状的物体时，旋转框检测也可以提供更好的结果。 然而，旋转框检测也带来了一些挑战。首先，预测旋转角度需要更多的计算资源。 此外，由于旋转框检测涉及到多个参数的预测，因此需要更强大的神经网络架构来处理这些参数。 总的来说，YOLOv8的旋转框检测是一种强大的技术，它可以提高物体检测的准确性和灵活性。
30310编辑于 2025-07-17- </body> </html> <script> window.onload = function () { // 获取拖拽的节点 let drag = document.getElementById('drag') // console.log(drag); // 按下别拖拽对象的时候来自专栏编程内马尔
原生JS拖拽
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>"> <meta http-equiv="X-UA-Compatible IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>原生JS拖拽 class="box" id="drag">
16K40编辑于 2022-11-15
winform 文件拖拽
winform 重写函数，而不是控件委托事件 protected override void OnDragDrop(DragEventArgs drgevent) protected override
可拖拽gridview
的控件，GridView主要是来显示网格的控件，在Android的开发中使用很普通，相对于TextView，Button这些控件来说要来的复杂些，今天给大家带来长按GridView的item,然后将其拖拽其他 GridView的拖动的Demo，但是大部分都是相同的，而且存在一些Bug,而且大部分都是点击GridView的item然后进行拖动，或者item之间不进行实时交换，今天给大家更加详细的介绍GridView拖拽 item显示出来，这样子就实现了GirdView的拖拽效果啦，接下来我们来使用下我们自定义可拖拽的GridView吧，先看主界面布局，只有我们自定义的一个DragGridView <RelativeLayout xml version="1.0" encoding="utf-<em>8</em>"? 好了，今天的讲解就到此结束，效果还不错吧，看完这篇文章你是不是觉得GridView拖拽也不是那么难实现呢？
YOLOv8 OBB实现自定义旋转对象检测
数据集制作 我用手机拍了一张图像 然后自己写个代码，每旋转一度保存一张图像，这样就成功生成了360张图像及其注释文件，分为训练集与验证集。训练文件夹包含 320张带有注释的图像。 数据集部分图像显示如下： 模型训练 准备好数据集以后，直接按下面的命令行运行即可： yolo obb train data=pen_dataset.yaml model=yolov8s-obb.pt epochs =25 imgsz=640 导出与测试 模型导出与测试 # export model yolo export model=yolov8s-obb.pt format=onnx # inference train_demo/four_pen.jpg") bgr = format_yolov8(frame) img_h, img_w, img_c = bgr.shape start = time.time cv.putText(frame, fps_label, (20, 45), cv.FONT_HERSHEY_SIMPLEX, 1, (0, 0, 255), 2) cv.imshow("YOLOv8-
table表格拖拽
el-table 的拖拽使用 Sortable.js 官方文档 :https://github.com/SortableJS/Sortable 1. (tbody, { animation: 150, //动画 handle: ".move", //指定拖拽目标，点击此目标才可拖拽元素(此例中设置操作按钮拖拽) filter : ".disabled", //指定不可拖动的类名（el-table中可通过row-class-name设置行的class） dragClass: "dragClass", //设置拖拽样式类名 /** * 在做列拖拽功能时发现问题：表头位置错乱，但是内容列正常 * 于是我给el-table绑定key，每次拖拽结束改变key触发表格重新渲染 * 但引出新的问题：表格重渲拖拽事件丢失，导致之后无法拖拽 * 于是我在表格重渲之后重新调用拖拽方法创建拖拽实例，功能正常 * **/ this.key
vuedraggable自由拖拽_vue可视化拖拽编辑
最近做的项目要用到拖拽排序，我现在的项目是vue项目，所以我就屁颠屁颠的去百度有木有这样功能的插件，我就知道一定会有，那就是vuedraggable，这是一款很棒的拖拽插件，下面我来说一下怎么引入 首先在 evt.oldIndex) console.log('拖动后的索引 :' + evt.newIndex) console.log(this.colors); } }, mounted () { //为了防止火狐浏览器拖拽的时候以新标签打开
Cypress实现拖拽
使用Cypress内置的trigger方法实现拖拽一个元素到另一个同类型元素，实现排序 Typescript实现方法： export function dragAndDrop(sourceLocator
vue拖拽指令
自己一直很想做个拖拽生成静态页面的东西，说简单也简单，这个东西按道理用jsx语法是最好的，用render方法渲染生成的json。只是自己对这块还是没信心。 今天写个vue的拖拽指令，顺便理一下offsetX、pageX、clientX、screenX这几个属性，一直记不住。 搞明白了这几个相对的距离，就比较容易计算拖拽的距离了。 很早之前就分享过拖拽的一个简单demo，拖拽指令也很简单 Vue.directive('draggable', { inserted: function (el,data) { el.style.position 使用的时候：
Js拖拽事件
doctype html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>"> <title>darg</title> <style type="text/css oDrag.style.left=l+'px'; oDrag.style.top =t+'px'; } </script> </body> </html> 知识点： 用class获取元素封装; 学习mouseover事件; 常见<em>拖拽</em>
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号