在apiCloud中找各种文档,论坛也没有找到如何使用第三方模块的相关知识。可能是我没找到地方吧~不管啦,反正我已经挖完坑了。这篇指南也不光是使用bMap吧。第三方模块基本上就是这个套路。正文开始。
小板凳、啤酒、火腿肠、花生米准备开始~
1. 在控制台创建一个新的应用

2. 本文使用的编辑器为官方的编辑器 APICloud Studio 2
,如下图:菜单栏上 依次选择 代码检出
> APICloud云端应用
> useMap
(实例创建的项目,这个随意)


3. bMap
是第三方模块,所以我们需要把这个模块添加到我们的现在的项目中来。有两种方法:
-
在APICloud Studio 2 中添加模块
-
在 开发控制台 左边的选项中选择模块
image
image
image
4. 加载组件成功有3步
-
关键就是这三步
image
4.1 申请百度地图的AK,这里我们只以安卓为例

4.2 进入后填入百度账号密码登录,然后跳转到下图,点击申请秘钥

4.3 创建应用有三步骤
4.3.1 SHA1获取参考教程
这里说下我如何获取的,用google搜索全都是 Android Studio 的获取方式,为此下了一个安装了。目的是为了让下图中存在 debug.keystore
我想应该有其它方法不过我没有花太多时间去弄.

4.3.2 包名的获取。控制台内选择证书 > com._______.xfx 就是包名了

4.3.3 创建应用

4.3.4 申请成功后的页面 ,访问应用(AK) 被我虚化的部分就是我们要用的AK啦

5. 在项目中的config.xml中配置bMap 的AK (中间的红框处复制到config.xml内)

6. 项目上鼠标右键,先将代码提交到本地,根据提示输入信息并保存即可。直到右侧上面会有提示层弹出。要仔细看弹出的提示信息。

7. 将代码提交到云端

8. 查看代码是否提交成功

9. [最关键的一步]云端编译自定义AppLoader
9.1 首先我们需要理解AppLoader 是做什么用的?这个起先我也不是很理解,研究透彻bMap后我明白了。这东西就是加载器,这不废话么??? 其实最主要的就是如果我们用第三方的模块就必须用自定义加载器。因为官方的AppLoader除了官方提供的各种组件是不会把第三方组件加载进来的。所以我们在使用第三方的模块的时候必须先在云端编译自定的APPloader然后下载下来。如果我们是用海马玩模拟器那么就安装在海马玩上。
-
官方提供的AppLoader都有哪些限制?看到下图,您明白了吧? 第三方模块要在config.xml中配置的
没有包含三方的模块所以我们用不了.下图是我在下面视频教程中截取的.3分41秒 .建议把此系列教程都看一遍基本都明白了.
入门基础初级代码篇第九讲 使用自定义AppLoader调试第三方SDK模块(一)image
9.2 在使用自定义APPloader前我们需要做一件事.在端设置里我上传一张自定义图标方便我们接下来的讲解.

9.3 项目右键> 云编译自定义APPLoader 点击绿色按钮,编译需要一点时间编译完后下载按钮就会变成蓝色高亮.提示您可以下载了.旁边会有个二维码您可以安装到手机里用于真机调试. 下来下的apk可以安装在海马玩模拟器里.用于模拟器内的调试.我们接下来用海马玩来调试


10. 最后一步
10.1 海马玩安装自定义的APPLoader 设置 > 其他设置 > Apk安装 选择下载好的自定义loader

10.2 下图图标可以看出我自定义的 和官方的区别,之前开发是不是一直都用的官方的?

10.3 将bMap Api中的这段实例代码复制到index.html内


10.4 打开useMap自定义loader 在小灰钮上点击添加WIFI真机同步配置.
填写好以后点击连接.

配置请参考下图,

10.5 右键全量同步 查看海马玩模拟器


哈哈哈哈哈 是不是很开心~~~ 教程结束 ~
网友评论