应用APICloud平台,能够应用前端技术疾速开发iOS、Android App、小程序、Web等多端利用。在开发过程中,调用模块能够极大的晋升开发效率。本文分为三个局部,通知大家如何应用APICloud 的原生模块、H5模块以及多端组件,疾速实现性能开发。

一、原生模块应用教程

原生模块是指应用 Android 和 iOS原生开发语言封装的功能模块。封装好的模块能够应用js调用。

1、增加模块

进入 APICloud 控制台,找到模块库,搜寻要应用的模块。

点击”+“进行增加

2、编译自定义loader ,并下载安装到手机

自定义loader是Android或iOS安装包,也是咱们进行开发调试的运行环境。代码批改后,应用开发工具 Studio 3 的 wifi 同步性能,把代码同步到自定义loader中,能够查看批改代码的运行成果。 如下图,点击自定义loader 导航, 点击【编译android 自定义loader】按钮或 【编译iOS自定义loader】按钮,进行编译。编译实现后,应用手机扫描二维码,下载安装到手机。

3、依据模块文档,编写调用模块的代码。 应用模块前肯定要仔细阅读模块文档,尤其是反对平台,是否Android、iOS都反对,不要写完代码才发现只反对某一平台,做无用功。某些模块封装第三方平台的SDK, 如极光推送模块,在应用这类模块时,不仅要浏览模块文档,还要浏览极光官网的文档。

以UIButton 模块为例:https://docs.apicloud.com/Cli...

关上编辑器,在页面编写代码,以调用UIButton模块的open 接口为例:

如何应用 Studio 3 编辑器检出我的项目,新建我的项目,提交或更新代码,本文不做介绍,可参考以下Studio 3文档进行学习。

https://docs.apicloud.com/api...

4、应用 Studio 3 wifi 同步性能,将代码同步到自定义loader 查看代码运行成果。

如下图,点击真机同步快捷键 , 点击 【通过wi-fi 连贯新的设施】, 弹出二维码和ip地址、端口号。

关上手机上的自定义loader,点击浅灰色圆圈,弹出如下界面,点击扫一扫,能够扫描上图的二维码,主动连贯。或者手动输出ip 地址和端口号,而后点连贯。连贯胜利后,灰色圆圈变绿色。

在开发工具我的项目根目录上右键 - 抉择 WiFi 同步全量 命令,就能够把代码同步到自定义loader。( 留神手机上自定义loader 要处于关上状态,不能退到后盾。)

运行成果如下图:能够看到按钮模块的成果曾经显示在页面上。

其余注意事项:

(1)如果应用须要在config.xml 中配置appkey , 或res 目录下须要配置文件。这两种情景,要配置代码后,先提交代码,再编译自定义loader,这样这些配置项能力失效。

(2)open 接口的fixedOn 参数指定模块所在页面的name,如果传谬误,会造成模块不显示。

二、H5模块应用教程

H5模块是指应用HTML、CSS、JS语言开发的模块。所以这类模块须要下载模块源码,在页面中援用。

将下载后的代码包解压:

将 libs 目录下的base.js 复制到我的项目script 目录下,并在页面中引入,如下图:

wifi 同步后,运行成果如下:

三. 多端组件应用教程

多端组件是指应用 avm.js 开发的组件,通常同时适配Android、iOS、小程序、H5 , 具体反对状况还要看每个组件的阐明文档。

同样须要组件下载源码,复制到我的项目中,在页面引入依赖的组件。留神多端开发模式,应用的是stml 页面,语法相似vue 。在openFrame 或 openWin 时 avm 参数传true,能够关上stml 页面。

将a-button.stml 页面复制到我的项目的components目录,因为a-button.stml 又依赖a-icon.stml index.js Toast.js , 所以将这些文件也放到components目录。通过浏览readme.md 文档,能够查查看a-button.stml 的应用介绍。如下图,通过在 view 标签中 增加 a-button 标签,在 script 标签中通过 import 语法引入组件。

WiFi 同步到自定义loader 运行成果如下:

如果应用ACT组件,举荐从Github或Gitee下载。
Github 地址:https://github.com/apicloudco...
Gitee 地址 :https://gitee.com/apicloud/act