HarmonyOS Next开辟学习手册——拖拽事故

[复制链接]
发表于 2026-2-3 16:15:35 | 显示全部楼层 |阅读模式
概述

拖拽框架提供了一种通过鼠标或手势触屏的方式通报数据,即从一个组件位置拖出数据,并拖入到另一个组件位置上举行相应,拖出一方提供数据,拖入一方吸取和处置惩罚数据。该利用可以让用户方便地移动、复制或删除指定内容。

      
  • 拖拽利用:在某个可以或许相应拖出的组件上长按并滑动触发的拖拽举动,当用户开释时,拖拽利用竣事;  
  • 拖拽配景(背板):用户所拖动数据的形象化表现,开辟者可通过 onDragStart 的 CustomerBuilder 或 DragItemInfo 设置,也可以通过 dragPreview 通用属性设置;  
  • 拖拽内容:拖动的数据,使用UDMF同一API UnifiedData  举行封装;  
  • 拖出对象:触发拖拽利用并提供数据的组件;  
  • 拖入目的:可吸取并处置惩罚拖动数据的组件;  
  • 拖拽点:鼠标或手指等与屏幕的打仗位置,是否进入组件范围的判定是以打仗点是否进入范围举行判定。
拖拽流程

手势拖拽

对于手势长按触发拖拽的场景,发起拖拽前框架侧会对当前组件是否可拖拽举行校验,针对默承认拖出的组件( Search 、 TextInput 、 TextArea 、 RichEditor 、 Text 、 Image 、 Hyperlink )须要判定是否设置了 draggable 属性为true(若体系使能分层参数,则draggable默以为true),其他组件须要额外判定是否设置了onDragStart回调函数,在满意上述可拖拽条件下,长按大于即是500ms可触发拖拽,长按800ms开始做预览图的浮起动效。
手势拖拽(手指/手写笔)触发拖拽流程:

鼠标拖拽

鼠标拖拽属于即拖即走,只要鼠标左键在可拖拽的组件上按下并移动大于1vp就可触发拖拽。
当前支持应用内和跨应用拖拽,提供了多个回调事故供开辟者感知拖拽状态并干预体系默认拖拽举动,具体如下:
     回调事故    分析              onDragStart    支持拖出的组件产生拖出动作时触发。该回调可以感知拖拽举动的发起,开辟者可通过在 onDragStart 方法中设置拖拽所通报的数据以及自界说拖拽背板图。保举开辟者使用pixelmap的方式返回背板图,不保举使用customBuilder的方式,会有额外的性能开销。          onDragEnter    当拖拽运动的拖拽点进入组件范围内时触发,只有该组件监听了 onDrop 事故时,此回调才会被触发。          onDragMove    拖拽点在组件范围内移动时触发;只有该组件监听了onDrop事故时,此回调才会被触发。
在此过程中可通过 DragEvent 中的setResult方法影响体系部分场景下的表面
1. 设置DragResult.DROP_ENABLED;
2. 设置DragResult.DROP_DISABLED。          onDragLeave    拖拽点离开组件范围时触发;只有该组件监听了onDrop事故时,此回调才会被触发。
针对以下两种情况默认不会发送onDragLeave事故:
1. 父组件移动到子组件;
2. 目的组件与当前组件布局有重叠;
API version 12开始可通过 UIContext 中的 setDragEventStrictReportingEnabled 方法严酷触发onDragLeave事故。          onDrop    当用户在组件范围内开释时触发,需在此回调中通过DragEvent中的setResult方法设置拖拽结果,否则在拖出方组件的onDragEnd方法中通过getRresult方法只能拿到默认的处置惩罚结果DragResult.DRAG_FAILED。
该回调也是开辟者干预体系默认拖入处置惩罚举动的地方,体系会优先实行开辟者的onDrop回调,通过在回调中实行setResult方法来告知体系该如那边理所拖拽的数据;
1. 设置 DragResult.DRAG_SUCCESSFUL,数据完全由开辟者本身处置惩罚,体系不举行处置惩罚;
2. 设置DragResult.DRAG_FAILED,数据不再由体系继承处置惩罚;
3. 设置DragResult.DRAG_CANCELED,体系也不须要举行数据处置惩罚;
4. 设置DragResult.DROP_ENABLED或DragResult.DROP_DISABLED会被忽略,同设置DragResult.DRAG_FAILED;          onDragEnd    当用户开释拖拽时,拖拽运动竣事,发起拖出动作的组件会触发该回调。          onPreDrag    绑定此事故的组件,当触发拖拽发起前的差异阶段时,触发回调。
开辟者可以使用该方法监听 PreDragStatus 中的摆列在发起拖拽前的差异阶段准备数据。
1. ACTION_DETECTING_STATUS:拖拽手势启动阶段。(按下50ms时触发);
2. READY_TO_TRIGGER_DRAG_ACTION:拖拽准备完成,可发起拖拽阶段。(按下500ms时触发);
3. PREVIEW_LIFT_STARTED:拖拽浮起动效发起阶段。(按下800ms时触发);
4. PREVIEW_LIFT_FINISHED:拖拽浮起动效竣事阶段。(浮起动效完全竣事时触发);
5. PREVIEW_LANDING_STARTED:拖拽落回动效发起阶段。(落回动效发起时触发);
6. PREVIEW_LANDING_FINISHED:拖拽落回动效竣事阶段。(落回动效竣事时触发);
7. ACTION_CANCELED_BEFORE_DRAG:拖拽浮升降位动效停止。(已满意READY_TO_TRIGGER_DRAG_ACTION状态后,未到达动效阶段,手指抬手时触发)。    拖拽背板图

拖拽移动过程中表现的拖拽背板图,并非是组件本身,其是用户拖动数据的表现,开辟者可以将其设置为恣意可表现的图像。此中onDragStart 回调返回的customBuilder或pixelmap可以设置拖拽移动过程中的背板图,浮起图默认使用组件本身的截图;dragpreview属性设置的customBuilder或pixelmap可以设置浮起和拖拽过程的背板图;如果开辟者没有设置背板图,则体系会默认取组件本身的截图作为浮起及拖拽过程中的背板图。
拖拽背板图当前支持设置透明度、圆角、阴影和含糊,具体用法见: 拖拽控制
束缚:

      
  • 对于容器组件,如果内部内容通过position,offset等本领使得绘制地区超出了容器组件范围,则体系截图无法截取到范围之外的内容,此种情况下,如果肯定要浮起及拖拽背板可以或许包罗范围之外的内容,则可思量通过扩大容器范围或自界说方式举行;  
  • 不管是使用自界说builder或是体系默认截图方式,截图都临时无法应用 scale 、 rotate 等图形变动结果。
开辟步调

通用拖拽适配

如下以 Image 组件为例,先容组件拖拽开辟的根本步调,以及开辟中须要留意的事项。
      
  • 组件使能拖拽

      
  • 设置draggable属性为true,并设置onDragStart回调,回调中可以通过UDMF设置拖拽的数据,并返回自界说拖拽背板图;
  1. import UDC from '@ohos.data.unifiedDataChannel';
  2. import UTD from '@ohos.data.uniformTypeDescriptor';
  3. Image($r('app.media.app_icon'))
  4.     .width(100)
  5.     .height(100)
  6.     .draggable(true)
  7.     .onDragStart((event) => {
  8.         let data: UDC.Image = new UDC.Image();
  9.         data.imageUri = 'common/pic/img.png';
  10.         let unifiedData = new UDC.UnifiedData(data);
  11.         event.setData(unifiedData);
  12.         let dragItemInfo: DragItemInfo = {
  13.         pixelMap: this.pixmap,
  14.         extraInfo: "this is extraInfo",
  15.         };
  16.         // onDragStart回调函数中返回自定义拖拽背板图
  17.         return dragItemInfo;
  18.     })
复制代码

      
  • 手势场景触发拖拽狡辩底层绑定的长按手势,若开辟者在被拖拽组件上也绑定长按手势,则会与底层的长按手势发生竞争,导致拖拽失败。可以用并行手势办理办理此类题目,如下:
  1. .par
复制代码

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

×
回复

使用道具 举报

登录后关闭弹窗

登录参与点评抽奖  加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表