apicloud的使用

apicloud的使用

APICloud官方文档地址:https://docs.apicloud.com/APICloud/creating-first-app

——————安装studio和AppLoader——————

1、直接安装apicloud studio2(不要搞什么sublime的插件了,太麻烦。)

2、安装jdk,百度搜索jdk(java开发运行环境),并下载和安装。

3、手机安装apploader,用于真机同步测试。下载网站:http://docs.apicloud.com/Download/download

——设置 - 通用 - 设备管理 - 点击证书并信任。

——————apicloud studio2的初始设置——————

1、右键 - 创建apicloud项目

2、右键某文件 - 实时预览

3、开启自动刷新:设置Packages - 核心包 - apicloud - 设置 - settings - 自动刷新

编译自定义loader的两种方式:

1, APICloud Studio 中的项目上右键,然后选中“云编译自定义AppLoader”, 等待编译完成。 然后用手机扫描二维码将自定义loader安装到手机。

2, 在网站上编译自定义loader,如下图。编译完成后,安装到手机。然后进行WiFi真机同步(参考下面的介绍)。

APPloader和自定义Loader的区别:

官方的APPLoader包含了一些常用的功能。自定义Loader是你自己选择了很多功能模块,然后编译成安装包。可以支持这些功能模块的测试效果(控制台 - 模块 - 自定义Loader)。

——————APIcloud平台提供的存储——————

file - 文件存储,文件的上传下载之类的。

db - 本地sqllite数据库,离线存储

localhostStorage - H5提供的存储,一般是存储变量,如登录状态之类的。可以起到变量传递作用,即不同界面直接调用。session和cookie是手机中是无法使用的。

preterence(平台封装好的) - setPrefs、getPrefs、removePrefs(个性化设置,如皮肤、字体大小等)

——————控制台——————

端设置:icon建议上传128*128的。启动页,至少应该上传一个1280*1920的图片

——————快捷键——————

格式化:ctrl+alt+B 

预览界面(电脑):ctrl+shift+V

插入AUI组件:ctrl+alt+A

WIFI增量同步:ctrl(command)+I

WiFi真机预览:Control + O

——————关于界面布局——————

window - 窗口,frame - 子窗口,frameGroup - 子窗口组合

一般处理方式:整个界面是一个window,然后window加载一个或多个frame,frame加载html代码,如下:

—— 特别简单的,直接加载html也可以。

—— 般frame会用于,除了头部和顶部外的部分。

—— 动画效果(下拉导航、侧拉敞口),窗口切换之类的,都是用封装好的原生模块,以保证体验。

—— 还有很多原生模块都可以混合是用,也保证了用户体验。

 ——————界面开发——————

 一、创建应用的两种方式:

1)在web的控制台,点击创建应用即可

2)在APICloudStudio中:文件 - 新建 - APICloud移动应用/页面框架等。

二、提交到云端:

第1步:本地提交:

==>>项目右键:git --> Git add + commit,输入备注,cmd + S保存,即可 将代码提交到本地 GIT 仓库。

第2步:提交云端:

==>>项目右键:代码管理 - 同步到云端。

三、关于包结构:

“config.xml”和 “index.html” 必须包含,其它均为可选。“

——“config.xml”是配置文件,

——“index.html”是启动页面,

——“icon”为图标文件目录。(仅供APICloud Studio本地测试版本使用,云端正式版本不需要在此设置,以减小应用包大小)

——“launch”为启动图片目录。(供APICloud Studio本地测试版本使用,云端正式版本不需要在此设置,以减小应用包大小)

——“html”html网页文件

——“res”为资源目录

——“script”为脚本目录

——“css”为样式目录

——“wgt”为子wgt目录,子widget根目录名称为widgetId

——更多详情:https://docs.apicloud.com/Dev-Guide/widget-package-structure-manual

四、config.xml 配置文件

“id”: 必填,应用ID,由云服务器自动分配。它是该应用的唯一标识。
“version”:必填,应用的版本号。
“name”:必填,应用名称。
“description”:可选,应用简单描述信息。
“content”:必填,应用运行的起始页。
“permission”:必填,权限配置。 (详细介绍见应用配置指南文档)

五、前端开发框架:

提供了api.css和api.js作为默认样式,可以不用,或者混用

参考前端框架手册:https://docs.apicloud.com/Front-end-Framework/framework-dev-guide

六、端API的调用:

——核心模块不需要单独引入,拓展模块需要单独引入。

参考api文档:https://docs.apicloud.com/Client-API/api

 七、模块的调用:

——控制台,模块库添加即可。

var dialogBox;
apiready = function() { 
    dialogBox = api.require('dialogBox');
}

八、真机同步:

——项目右键 - 查看真机同步IP和端口,然后在手机的apploader上同步即可。更多请查看手册。wifi真机同步用的比较多。

九、studio的入门:

https://docs.apicloud.com/Dev-Tools/studio-dev-guide

猜你喜欢

转载自blog.csdn.net/yangmy_Shy/article/details/87255428
今日推荐