HarmonyOS 鸿蒙Next 华为地图全屏化

发布于 1周前 作者 songsunli 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 华为地图全屏化

setFullScreen(status: boolean) {

    window.getLastWindow(getContext(this)).then((window) => {

        window.setWindowLayoutFullScreen(status)

}) }

您好,上次您说用这种方法,在地图页让它全屏,然后退出页面时设为false。虽然可以达到需求。但是在退出页面后,然后显示的下面一层的页面,会出现从全屏到不全屏的一个效果,这个效果不好。 有没有办法在地图页用expandSafeArea来实现地图全屏


更多关于HarmonyOS 鸿蒙Next 华为地图全屏化的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

可参考下

import { MapComponent, mapCommon, map } from '@kit.MapKit';
import { AsyncCallback } from '@kit.BasicServicesKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { display } from '@kit.ArkUI';
[@Entry](/user/Entry)
[@Component](/user/Component)
struct HuaweiMapDemo {
  private TAG = "HuaweiMapDemo";
  private mapOption?: mapCommon.MapOptions;
  private callback?: AsyncCallback<map.MapComponentController>;
  private mapController?: map.MapComponentController;
  [@State](/user/State) displayHeight: number = 0
  [@State](/user/State) message: string = 'Hello World';
  aboutToAppear(): void {
    let displayClass: Array<display.Display> = [];
    display.getAllDisplays((err: BusinessError, data: Array<display.Display>) => {
      displayClass = data;
      const errCode: number = err.code;
      if (errCode) {
        console.error('Failed to obtain all the display objects. Code: ${err.code}, message: ${err.message}');
        return;
      }
      this.displayHeight = data[0].height
      console.info('Succeeded in obtaining all the display objects. Data: ' + JSON.stringify(data));
    });
    // 地图初始化参数,设置地图中心点坐标及层级
    this.mapOption = {
      position: {
        target: {
          latitude: 39.9,
          longitude: 116.4
        },
        zoom: 10
      }
    };
    // 地图初始化的回调
    this.callback = async (err, mapController) => {
      if (!err) {
        // 获取地图的控制器类,用来操作地图
        this.mapController = mapController;
        this.mapController.on("mapLoad", () => {
          console.info(this.TAG, `on-mapLoad`);
        });
      }
    };
  }
  build() {
    Column(){
      Stack() {
        // 调用MapComponent组件初始化地图
        MapComponent({ mapOptions: this.mapOption, mapCallback: this.callback })
          .width('100%')
          .height(this.displayHeight + 'px')
          .margin({
            top: -10
          })
      }
      .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP,SafeAreaEdge.BOTTOM])
    }
  }
}

更多关于HarmonyOS 鸿蒙Next 华为地图全屏化的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


针对HarmonyOS 鸿蒙Next 华为地图全屏化问题,以下是一些可能的解决方案:

  1. 检查应用设置

    • 确保华为地图应用已更新至最新版本,以支持HarmonyOS 鸿蒙Next的全屏特性。
    • 在应用设置中检查是否有全屏模式选项,并将其开启。
  2. 调整布局设置

    • 如果你是开发者,请检查应用的布局文件,确保没有UI元素或布局设置阻碍全屏显示。
    • 尝试使用expandSafeArea方法,并在布局组件(如Column、Row、Stack)上应用,以确保内容填充整个屏幕。
  3. 系统级设置

    • 检查系统设置中是否有关于全屏模式的选项,如“导航栏显示”或“状态栏显示”,确保它们不会干扰华为地图的全屏显示。
  4. 代码层面调整

    • 如果你是开发者,并正在使用Map Kit服务,请确保已正确配置API,并在代码中实现了全屏显示逻辑。
    • 尝试调整地图组件的paddingmargin属性,以确保地图内容不受其他UI元素的干扰。

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

回到顶部