网站开发人员配置,方城微网站开发,互联网大厂一般指哪些公司,企业seo职位设置组件是否可以响应拖拽事件。 说明#xff1a; 从API Version 10开始支持。后续版本如有新增内容#xff0c;则采用上角标单独标记该内容的起始版本。 ArkUI框架对以下组件实现了默认的拖拽能力#xff0c;支持对数据的拖出或拖入响应#xff0c;开发者只需要将这些组件…设置组件是否可以响应拖拽事件。 说明 从API Version 10开始支持。后续版本如有新增内容则采用上角标单独标记该内容的起始版本。 ArkUI框架对以下组件实现了默认的拖拽能力支持对数据的拖出或拖入响应开发者只需要将这些组件的draggable属性设置为true即可使用默认拖拽能力。 默认支持拖出能力的组件可从组件上拖出数据Search、TextInput、TextArea、RichEditor、Text、Image、FormComponent、Hyperlink 默认支持拖入能力的组件目标组件可响应拖入数据Search、TextInput、TextArea、Video
开发者也可以通过实现通用拖拽事件来自定义拖拽响应。
其他组件需要开发者将draggable属性设置为true并在onDragStart等接口中实现数据传输相关内容才能正确处理拖拽。
allowDrop
allowDrop(value: ArrayUniformDataType)
设置该组件上允许落入的数据类型。
系统能力 SystemCapability.ArkUI.ArkUI.Full
参数
参数名类型必填说明valueArrayUniformDataType是设置该组件上允许落入的数据类型。 默认值空
draggable
draggable(value: boolean)
设置该组件是否允许进行拖拽。
系统能力 SystemCapability.ArkUI.ArkUI.Full
参数
参数名类型必填说明valueboolean是设置该组件是否允许进行拖拽。 默认值false
dragPreview11
dragPreview(value: CustomBuilder | DragItemInfo)
设置组件拖拽过程中的预览图。
系统能力 SystemCapability.ArkUI.ArkUI.Full
参数
参数名类型必填说明valueCustomBuilder | DragItemInfo是设置组件拖拽过程中的预览图仅在onDragStart拖拽方式中有效。 当组件支持拖拽并同时设置bindContextMenu的预览图时则长按浮起的预览图以bindContextMenu设置的预览图为准。开发者在onDragStart中返回的背板图优先级低于dragPreview设置的预览图当设置了dragPreview预览图时拖拽过程中的背板图使用dragPreview预览图。由于CustomBuilder需要离线渲染之后才能使用因此存在一定的性能开销和时延推荐优先使用 DragItemInfo中的PixelMap方式。 默认值空
dragPreviewOptions11
dragPreviewOptions(value: DragPreviewOptions)
设置拖拽过程中背板图处理模式。
系统能力 SystemCapability.ArkUI.ArkUI.Full
参数
参数名类型必填说明valueDragPreviewOptions11是设置拖拽过程中背板图处理模式。 默认值DragPreviewMode.AUTO
DragPreviewOptions11
名称类型必填描述modeDragPreviewMode否表示拖拽过程中背板图处理模式。 默认值DragPreviewMode.AUTO
DragPreviewMode11枚举说明
名称枚举值描述AUTO0系统根据拖拽场景自动改变跟手点位置根据规则自动对拖拽背板图进行缩放变换等。DISABLE_SCALE1禁用系统对拖拽背板图的缩放行为。
示例
示例1
allowDrop与draggable属性用法示例
// xxx.ets
import UDC from ohos.data.unifiedDataChannel;
import UTD from ohos.data.uniformTypeDescriptor;Entry
Component
struct ImageExample {State uri: string State AblockArr: string[] []State BblockArr: string[] []State AVisible: Visibility Visibility.VisibleState dragSuccess :Boolean falsebuild() {Column() {Text(Image拖拽).fontSize(30dp)Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceAround }) {Image($r(app.media.icon)).width(100).height(100).border({ width: 1 }).visibility(this.AVisible).draggable(true).onDragEnd((event: DragEvent) {let ret event.getResult();if(ret 0) {console.log(enter ret 0)this.AVisible Visibility.Hidden;} else {console.log(enter ret ! 0)this.AVisible Visibility.Visible;}})}.margin({ bottom: 20 })Row() {Column(){Text(不允许释放区域(显示不允许角标但可以释放)).fontSize(15dp).height(10%)List(){ForEach(this.AblockArr, (item:string, index) {ListItem() {Image(item).width(100).height(100).border({width: 1})}.margin({ left: 30 , top : 30})}, (item:string) item)}.height(90%).width(100%).allowDrop([UTD.UniformDataType.TEXT]).onDrop((event?: DragEvent, extraParams?: string) {this.uri JSON.parse(extraParams as string).extraInfo;this.AblockArr.splice(JSON.parse(extraParams as string).insertIndex, 0, this.uri);console.log(ondrop not udmf data);}).border({width: 1})}.height(50%).width(45%).border({ width: 1 }).margin({ left: 12 })Column(){Text(可释放区域).fontSize(15dp).height(10%)List(){ForEach(this.BblockArr, (item:string, index) {ListItem() {Image(item).width(100).height(100).border({width: 1})}.margin({ left: 30 , top : 30})}, (item:string) item)}.border({width: 1}).height(90%).width(100%).allowDrop([UTD.UniformDataType.IMAGE]).onDrop((event?: DragEvent, extraParams?: string) {console.log(enter onDrop)let dragData:UnifiedData (event as DragEvent).getData() as UnifiedData;if(dragData ! undefined) {let arr:ArrayUDC.UnifiedRecord dragData.getRecords();if(arr.length 0) {let image arr[0] as UDC.Image;this.uri image.imageUri;this.BblockArr.splice(JSON.parse(extraParams as string).insertIndex, 0, this.uri);} else {console.log(dragData arr is null)}} else {console.log(dragData is undefined)}console.log(ondrop udmf data);this.dragSuccess true})}.height(50%).width(45%).border({ width: 1 }).margin({ left: 12 })}}.width(100%)}
} 示例2
dragPreview属性用法示例
// xxx.ets
Entry
Component
struct DragPreviewDemo{Builder dragPreviewBuilder() {Column() {Text(dragPreview).width(150).height(50).fontSize(20).borderRadius(10).textAlign(TextAlign.Center).fontColor(Color.Black).backgroundColor(Color.Pink)}}Builder MenuBuilder() {Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {Text(menu item 1).fontSize(15).width(100).height(40).textAlign(TextAlign.Center).fontColor(Color.Black).backgroundColor(Color.Pink)Divider().height(5)Text(menu item 2).fontSize(15).width(100).height(40).textAlign(TextAlign.Center).fontColor(Color.Black).backgroundColor(Color.Pink)}.width(100)}build() {Row() {Column() {Image(/resource/image.jpeg).width(30%).draggable(true).bindContextMenu(this.MenuBuilder, ResponseType.LongPress).onDragStart(() {console.log(Image onDragStart)}).dragPreview(this.dragPreviewBuilder)}.width(100%)}.height(100%)}
} 示例3
dragPreviewOptions属性用法示例
// xxx.ets
Entry
Component
struct dragPreviewOptionsDemo{build() {Row() {Column() {Image(/resource/image.jpeg).margin({ top: 10 }).width(100%).draggable(true).dragPreviewOptions({ mode: DragPreviewMode.AUTO })}.width(100%).height(100%)}}
} 最后有很多小伙伴不知道学习哪些鸿蒙开发技术不知道需要重点掌握哪些鸿蒙应用开发知识点而且学习时频繁踩坑最终浪费大量时间。所以有一份实用的鸿蒙Harmony NEXT资料用来跟着学习是非常有必要的。
这份鸿蒙Harmony NEXT资料包含了鸿蒙开发必掌握的核心知识要点内容包含了ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等鸿蒙Harmony NEXT技术知识点。
希望这一份鸿蒙学习资料能够给大家带来帮助有需要的小伙伴自行领取限时开源先到先得~无套路领取 获取这份完整版高清学习路线请点击→纯血版全套鸿蒙HarmonyOS学习资料
鸿蒙Harmony NEXT最新学习路线 HarmonOS基础技能 HarmonOS就业必备技能 HarmonOS多媒体技术 鸿蒙NaPi组件进阶 HarmonOS高级技能 初识HarmonOS内核 实战就业级设备开发 有了路线图怎么能没有学习资料呢小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙OpenHarmony 学习手册共计1236页与鸿蒙OpenHarmony 开发入门教学视频内容包含ArkTS、ArkUI、Web开发、应用模型、资源分类…等知识点。
获取以上完整版高清学习路线请点击→纯血版全套鸿蒙HarmonyOS学习资料
《鸿蒙 (OpenHarmony)开发入门教学视频》 《鸿蒙生态应用开发V2.0白皮书》 《鸿蒙 (OpenHarmony)开发基础到实战手册》
OpenHarmony北向、南向开发环境搭建 《鸿蒙开发基础》
ArkTS语言安装DevEco Studio运用你的第一个ArkTS应用ArkUI声明式UI开发.…… 《鸿蒙开发进阶》
Stage模型入门网络管理数据管理电话服务分布式应用开发通知与窗口管理多媒体技术安全技能任务管理WebGL国际化开发应用测试DFX面向未来设计鸿蒙系统移植和裁剪定制…… 《鸿蒙进阶实战》
ArkTS实践UIAbility应用网络案例…… 获取以上完整鸿蒙HarmonyOS学习资料请点击→纯血版全套鸿蒙HarmonyOS学习资料
总结
总的来说华为鸿蒙不再兼容安卓对中年程序员来说是一个挑战也是一个机会。只有积极应对变化不断学习和提升自己他们才能在这个变革的时代中立于不败之地。
