文档管理中心
|

ArkUI (方舟UI框架)

ArkWeb

HarmonyOS 5

ArkTS

Ability (程序框架)

HarmonyOS 滑动swiper组件时如何保证不触发子组件的点击事件(API12+)

当前应用通过Swiper组件垂直滚动展示公告通知,点击子组件的内容能跳转到详情页面,当左右滑动时也会触发Text子组件的点击事件,如何保证在左右滑动时不触发子组件的点击事件。

点赞
收藏
回复
1
分享
举报
浏览45 发布于2026-01-05 09:30未知归属地
全部评论
最多点赞
最新发布
最早发布
|
技术支持

【背景知识】

参考文档:setKeyboardAvoidMode

【解决方案】

在子组件通过绑定自定义手势代替onClick事件,给子组件绑定TapGesture点击手势,并设置点击手势的移动阈值,手势移动距离超过阈值时不会识别成点击事件。

Demo如下:

收起
自动换行
深色代码主题
复制
@Entry
@Component
struct Index {
  build() {
    Column() {
      Swiper() {
        Text('公告')
          .width('80%')
          .fontSize(20)
          .textAlign(TextAlign.Center)
          .gesture(TapGesture({ distanceThreshold: 50 }).onAction((event: GestureEvent) => {
            if (event) {
              this.getUIContext().getPromptAction().showToast({ message: '通知详情', alignment: Alignment.Top })
            }
          }))
      }
      .height('20%')
      .vertical(true)
    }
    .width('100%')
    .height('100%')
  }
}
展开全部
1楼回复于2026-01-05 09:30 未知归属地
写回答
新增插入模板功能
一键使用模板,快速填写内容,轻松发帖~
知道了
  • 为了保障您的信息安全,请勿上传您的敏感个人信息(如您的密码等信息)和您的敏感资产信息(如关键源代码、签名私钥、调试安装包、业务日志等信息),且您需自行承担由此产生的信息泄露等安全风险。
  • 如您发布的内容为转载内容,请注明内容来源。

我要提问题

了解社区公约,与您携手共创和谐专业的开发者社区。