HarmonyOS 鸿蒙Next HMRouter框架下,使用MapComponent,触摸事件触发有问题

发布于 1周前 作者 htzhanglong 最后一次编辑是 5天前 来自 鸿蒙OS

项目中使用HMRouter框架进行页面跳转和路由管理,当前发现创建一个页面接入MapKit中的MapComponent,使用手指进行地图拖动和双指捏合手势进行地图放大或缩小时,触摸事件不会百分百触发,大概率会失效,且地图控件view越小,此现象越严重。

将当前页面通过router方式进入后,现象消失,不清楚是HMRouter的问题还是底层Navigation的问题

测试代码如下:

import { HMLifecycleState, HMRouter, HMRouterMgr } from "@hadss/hmrouter";
import { map, mapCommon, MapComponent } from "@kit.MapKit";
import { AsyncCallback } from "@ohos.base";

@HMRouter({
  pageUrl: 'MapTestPage'
})
@Component
export struct MapTestPage {
  private mapOptions?: mapCommon.MapOptions;
  private callback?: AsyncCallback<map.MapComponentController>;
  private mapController?: map.MapComponentController;
  currentLatitude: number = 34.758910506
  currentLongitude: number = 113.779708481

  aboutToAppear(): void {
    const lifecycleOwner = HMRouterMgr.getCurrentLifecycleOwner();
    lifecycleOwner?.addObserver?.(HMLifecycleState.onShown, (ctx): void => {
      this.onPageShow()
    })
    lifecycleOwner?.addObserver?.(HMLifecycleState.onHidden, (ctx): void => {
      this.onPageHide()
    })

    // 地图初始化参数,设置地图中心点坐标及层级
    this.mapOptions = {
      position: {
        target: {
          latitude: this.currentLatitude, //纬度
          longitude: this.currentLongitude, //经度
        },
        zoom: 15
      },
      myLocationControlsEnabled: true,
      compassControlsEnabled: false,
    };


    // 地图初始化的回调
    this.callback = async (err, mapController) => {
      if (!err) {
        // 获取地图的控制器类,用来操作地图
        this.mapController = mapController;
        this.mapController.setMyLocationEnabled(true);
        this.mapController.on("mapLoad", () => {
          console.error('地图加载成功')

        });
        this.mapController.on("error", (error) => {
          console.error("error", `on-error: Code: ${error.code}, message: ${error.message}`);
        });
      }
    }
  }

  onPageShow(): void {
    // 将地图切换到前台
    if (this.mapController) {
      this.mapController.show();
    }
  }

  onPageHide(): void {
    // 将地图切换到后台
    if (this.mapController) {
      this.mapController.hide();
    }
  }

  aboutToDisappear(): void {

  }

  build() {
    Stack() {
      MapComponent({ mapOptions: this.mapOptions, mapCallback: this.callback })
        .width('100%')
        .height('100%')
    }
  }
}

更多关于HarmonyOS 鸿蒙Next HMRouter框架下,使用MapComponent,触摸事件触发有问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复
hm的 问题,因为ejs里面加了事件穿透,用于做跟手动画的。你设置模板,替换掉原来的ejs就行了

更多关于HarmonyOS 鸿蒙Next HMRouter框架下,使用MapComponent,触摸事件触发有问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next HMRouter框架下,使用MapComponent时遇到触摸事件触发问题,可能是由于事件分发机制或组件属性设置不当导致的。

  1. 确认事件监听:确保MapComponent已正确设置触摸事件监听器。使用setTouchListener方法绑定监听器,检查监听器内部逻辑是否按预期执行。

  2. 检查事件拦截:确认是否有其他父级组件或布局拦截了触摸事件。可以通过重写父组件的onTouchEventonInterceptTouchEvent方法,打印日志来跟踪事件流向。

  3. 组件属性:检查MapComponent的属性设置,特别是与触摸相关的属性,如clickablefocusable等,确保它们被设置为允许接收触摸事件的状态。

  4. 布局层级:确认MapComponent的布局层级是否合适,避免被其他UI元素遮挡或覆盖,导致触摸事件无法正确传递。

  5. 版本兼容性:检查当前使用的HarmonyOS SDK版本与MapComponent的兼容性,确保没有已知的触摸事件相关bug。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部