APICloud教程

Posted 2022-01-01

一、通过APICloud进行App前端布局和数据交互
App前端布局：
Window ：窗口
Frame：子窗口
FrameGroup：一组子窗口的集合

window+frame+html代码的布局方式
整个页面最外面是一个window，头部和导航固定不变，为一个frame，下方内容区域又是一个frame，整个frame里面就是具体的页面内容了，里面嵌套了html\css代码

打开新窗口的过程，就是在一组window+frame+html这种组合下，打开另一组window+frame+html组合的过程

页面内容简单的情况下，可以直接在window当中加载htmlcss代码

打开子窗口：api.openFrame
function openFrame()
api.openFrame(
name:"", //子窗口的名称
url:"", //子窗口的地址
rect: //x和y是坐标位置，子窗口显示的起始坐标，w和h是，宽度和高度
x:0,
y:0,
w:"auto",
h:"auto"

)

打开子窗口组：api.openFrameGroup
打开新窗口：api.openWin

下拉刷新：api.setRefreshHeaderInfo
apiready = function()
api.setRefreshHeaderInfo(
visible:true,
bgColor:"#ccc",
textColor:"#fff",
textDown:"拉一下试试",
textUp:"试试就试试",
showTime:true
,function()
//coding...
//查询数据库
//判断是否有新数据
//更新新数据
api.refreshHeaderLoadDone();
)

定义的方法统一放在：
apiready = function()
openFrame();

数据交互：
数据存储：
file模块：目录操作，文件操作
文件存储方式，用于图片、文档的上传下载删除管理
db：本地sqlite数据库
用于离线数据的存储
localstorage：html5，localstorage
用于一些变量的存储传递，比如用户的登录状态、多个页面之间的变量传递
注意：cookie、session无法使用
preterence：setPrefs、getPrefs、removePrefs
apicloud封装好的偏好数据存储模块，如应用皮肤、字体大小等个性化的设置

与自建服务器的网络通信
api.ajax