鸿蒙Next开发-【自定义按钮实现长按点击事件】

鸿蒙Next开发-【自定义按钮实现长按点击事件】

API9，直接上代码

import router from '@ohos.router'
@Component
export struct LongPressButton {
  private  title: string = '按钮'
  @State isPress: boolean = false
  //倒计时id
  private timerId: number = 0
  //声明长按3000毫秒，可以自己改时长
  private longTime = 1000;

  //声明一个长按方法,供外部使用
  onLongClick?: () => void;

  build() {//2.创建build，内部放上ui内容
    Row() {
      Text(this.title)
        .fontSize(20)
        .fontColor(Color.White)
        .fontWeight(FontWeight.Bold)
    }
    .width('150')
    .height('55')
    .padding({left:18,right:18,top:10})
    .justifyContent(FlexAlign.Center)
    .borderRadius(8)
    .backgroundColor(this.isPress?0x333333:0x00ffff)
    .onTouch((e)=>{
      if (e.type == TouchType.Down) {
        console.log('我是down')
        //倒计时
        this.timerId = setTimeout(() => {
          clearTimeout(this.timerId)
          this.isPress = true;
          this.onLongClick()
        }, this.longTime);
      }
      if (e.type == TouchType.Up) {
        this.isPress = false;
        clearTimeout(this.timerId)
      }
    })
  }
}

页面调用

LongPressButton({title:"长按按钮",onLongClick:()=>{
        console.log('我是外部的长按事件')
        this.age++
      }})