1、不支持模拟器,需要真机!
2、Map地图需要在AGC上申请权限,需要在AGC上创建对应的项目
地址:
AppGallery Connect
2.1 AGC中项目创建
2.1.1 添加项目
2.1.2 起个名字
2.1.3 添加应用:
2.1.4 选择HarmonyOS APP,点击到APP ID中
2.1.5 定义应用名称和应用包名
2.1.6 开通地图服务
2.1.7 创建成功:
2.2 Dev Eco Studio创建云项目
2.2.1 云模板创建项目
2.2.2 包名保持一致
2.2.3 链接到你AGC平台上创建的项目,这里我缺少了一个默认数据保存位置,点击设置一下就可以了
2.2.4 修改Index页面中的代码为官方案例代码:
官方案例代码链接:文档中心
import { MapComponent, mapCommon, map } from '@kit.MapKit';
import { AsyncCallback } from '@kit.BasicServicesKit';
@Entry
@Component
struct HuaweiMapDemo {private TAG = "HuaweiMapDemo";private mapOptions?: mapCommon.MapOptions;private callback?: AsyncCallback<map.MapComponentController>;private mapController?: map.MapComponentController;private mapEventManager?: map.MapEventManager;aboutToAppear(): void {// 地图初始化参数,设置地图中心点坐标及层级this.mapOptions = {position: {target: {latitude: 39.9,longitude: 116.4},zoom: 10}};// 地图初始化的回调this.callback = async (err, mapController) => {if (!err) {// 获取地图的控制器类,用来操作地图this.mapController = mapController;this.mapEventManager = this.mapController.getEventManager();let callback = () => {console.info(this.TAG, `on-mapLoad`);}this.mapEventManager.on("mapLoad", callback);}};}// 页面每次显示时触发一次,包括路由过程、应用进入前台等场景,仅@Entry装饰的自定义组件生效onPageShow(): void {// 将地图切换到前台if (this.mapController) {this.mapController.show();}}// 页面每次隐藏时触发一次,包括路由过程、应用进入后台等场景,仅@Entry装饰的自定义组件生效onPageHide(): void {// 将地图切换到后台if (this.mapController) {this.mapController.hide();}}build() {Stack() {// 调用MapComponent组件初始化地图MapComponent({ mapOptions: this.mapOptions, mapCallback: this.callback }).width('100%').height('100%');}.height('100%')}
}
2.2.5 entry/src/mian/ets下的module.json5中设置metadata字段,其中name值为“client_id",value的值从AGC中复制。
2.2.6 并在配置文件module.json5中申请权限:
2.3 手动生成签名并配置
2.3.1 点击生成key和CSR
2.3.2 选择一个文件夹保存.p12
2.3.3 设置保存路径
2.3.4 起个别名
2.3.5 创建空白文件夹保存CSR文件,同样记住,后面要用
2.3.6 在证书、APP ID和Profile中新增证书并下载
2.3.7 添加Profile
点击下载: