未验证 提交 c3231961 编写于 作者: L LiAn 提交者: Gitee

update zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-drag-drop.md.

Signed-off-by: NLiAn <lian15@huawei.com>
Signed-off-by: NLiAn <lian15@huawei.com>
上级 cc1df517
......@@ -5,8 +5,16 @@
> **说明:**
>
> 从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
>
> 支持拖拽控制的组件:[Text](ts-basic-components-text.md)、[Image](ts-basic-components-image.md)、[Video](ts-media-components-video.md)、[List](ts-container-list.md)、[Grid](ts-container-grid.md)。
ArkUI组件默认支持拖拽。
当以下组件的draggable属性设置为true时可以响应拖拽事件,此时,组件不需要配置数据传输,即可进行拖拽。其他组件需要开发者将draggable属性设置为true且在onDragStart等接口中实现数据传输相关内容,才能完成拖拽。
- 默认支持拖拽(拖入和拖出)的组件:Search、TextInput、TextArea
- 默认支持拖入的组件:Video
- 默认支持拖出的组件:Text、List、Grid、FormComponent、Image、Hyperlink
## 属性
......@@ -21,7 +29,8 @@
```ts
// xxx.ets
import UDMF from '@ohos.data.UDMF';
import UDC from '@ohos.data.unifiedDataChannel';
import UTD from '@ohos.data.uniformTypeDescriptor';
@Entry
@Component
struct ImageExample {
......@@ -36,7 +45,7 @@ struct ImageExample {
Text('Image拖拽')
.fontSize('30dp')
Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceAround }) {
Image($r('app.media.1'))
Image($r('app.media.icon'))
.width(100)
.height(100)
.border({ width: 1 })
......@@ -72,7 +81,7 @@ struct ImageExample {
}
.height('90%')
.width('100%')
.allowDrop(["File.Media.Text", "File.Media.Image"])
.allowDrop([UTD.UniformDataType.TEXT, UTD.UniformDataType.IMAGE])
.onDrop((event: DragEvent, extraParams: string) => {
let jsonString = JSON.parse(extraParams);
this.uri = jsonString.extraInfo;
......@@ -103,7 +112,7 @@ struct ImageExample {
.border({width: 1})
.height('90%')
.width('100%')
.allowDrop(["File.Media.Image"])
.allowDrop([UTD.UniformDataType.IMAGE])
.onDrop((event: DragEvent, extraParams: string) => {
console.log("enter onDrop")
let dragData = event.getData();
......@@ -111,7 +120,7 @@ struct ImageExample {
if(dragData != undefined) {
let arr = dragData.getRecords();
if(arr.length > 0) {
let image = <UDMF.Image>(arr[0]);
let image = <UDC.Image>(arr[0]);
this.uri = image.imageUri;
let jsonString = JSON.parse(extraParams);
this.BblockArr.splice(jsonString.insertIndex, 0, this.uri);
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册