APIcloud平台开发第二天笔记

最新推荐文章于 2024-06-26 15:11:04 发布

Huhui-coder

最新推荐文章于 2024-06-26 15:11:04 发布

阅读量6.6k

点赞数 1

分类专栏： APIcloud 文章标签： AP

本文链接：https://blog.csdn.net/qq_40299179/article/details/81233970

版权

APIcloud 专栏收录该内容

3 篇文章 1 订阅

订阅专栏

APIcloud开发培训第二天

1.理解APIcloud应用执行流程

1.1流程说明

1531706242782

流程：首先是APP启动(可以是其他应用调用，也可以是用户直接启动)，接着引擎初始化，Widget初始化，Window初始化，Module初始化，EventQueue初始化，CmmandQueue Init命令队列初始化， RunTime Ready 运行时环境准备，之后便是模块加载(HTML,CSS,组件，Loader)，最后由 APIcloud 进行 Hybird Render。

2.Widget中代码执行之前，由引擎默认创建的两个UI组件实例

是一个APP所有的UI组件的父容器，由引擎初始化完毕后自动创建，如果关闭了主Widget，那么整个应用也就退出了。

2.2根窗口（Root Window）

是Window组件的一个实例，由引擎初始化完毕后自动创建，用于加载content事件所指定的HTML文件(通常为widget根目录下的index.html),Window的name固定为’root’。

3.config文件解析

APICloud引擎初始化完成后的第一个操作就是解析config.xml文件

每一个Widget 包必须有一个名为 config.xml （大小写敏感）的配置文件，它位于Widget包的根目录下。该配置文件包含了关于该Widget的重要信息，如：名称、作者信息、描述、云端ID、偏好设置、权限配置、模块概览等等，并且该配置文件也是整个Widget的入口。

3.1了解config文件作用

一个简单的config配置文件如下

<widget id="A12345678901"  version="0.0.1">
    <name>API Example</name>
    <description>
        API Example App.
    </description>
    <author email="developer@apicloud.com" href="//www.apicloud.com">
        APICloud.SIR
    </author>
    <content src="index.html" />
    <access origin="*" />
    <preference name="windowBackground" value="#FFF" />
    <permission name="call" />
    <feature name="weiXin">
        <param name="urlScheme" value="wx7779c7c063a9d4d9" />
    </feature>
</widget>

配置文件各字段描述

widget父元素描述了该Widget的基本属性，如表1所示。

属性名	描述	备注
id	应用ID，由云服务器自动分配。它是该Widget在云端的唯一标识。云服务器根据此ID对Widget进行管理并提供辅助服务，如：更新升级、统计分析、推送服务等。	必选
version	Widget的版本号	必选
sandbox	配置此属性后，APICloud应用在运行之初，将会在设备的SD卡上建立与此属性同名的文件夹根目录，并将该目录默认为本应用的沙箱根路径，此后应用运行过程中所有涉及的文件操作如：文件读写，拍照、下载等等，操作结果的文件都将存放在该路径下。该属性仅Android平台生效	可选

配置中的XML元素如表2所示。

表2. Widget配置元素

元素名	描述	备注
name	Widget的名称。如：QQ、新浪微博、微信等	必选
description	Widget的简单描述信息	可选
author	Widget的作者信息	可选
content	Widget运行的起始页，支持相对/绝对路径 ————	必选
access	在哪些页面里面可以访问APICloud的扩展API。一般配置“*”，代表所有页面都允许访问	可选
preference	偏好设置。配置Widget的一些运行时属性，如：页面是否支持弹动效果、窗口默认背景、页面是否显示滚动条等。该配置可在APICloud Studio的GUI界面中选择并使用。详细请参考Preference Guide	可选
permission	权限配置。通过此配置向系统声明Widget所用到的系统权限。如：直接拨打电话、直接发送短信、发起定位等。该配置可在APICloud Studio的GUI界面中选择并使用。详细请参考Platform Permission	必选
feature	功能配置。通过此配置，向系统声明需要使用哪些功能，以及需要传递给该功能的数据。如：使用新浪微博、使用微信分享等。该配置可在APICloud Studio的GUI界面中选择并使用。详细请参考Feature Guide	可选
font	字体配置。通过此配置，将自定义字体加入到应用中，使其可以在前端页面使用该字体	可选

<access origin="local" /> <access origin="http://apicloud.com" />

“`

preference xml字段中 name : appBackground 定义全局APP背景

若WindowBackground为透明，那么Window将展示App的背景，同时如果FrameBackground也为透明，那么Frame将展示App的背景。

preference xml字段中 name : appBackground 定义windowBackground背景

preference xml字段中 name : frameBackgroundColor 定义frameBackgroundColor背景

preference xml字段中 name : pageBounce 定义是否可以弹动
描述：配置页面是否可以弹动。若不配置，window默认不弹动，frame默认可以弹动；若配置，则window和frame是否可以弹动默认都以此配置的为准。

横向滚动条：

竖直滚动条：

描述：APICloud应用在启动时向用户展示一个启动界面，并控制该启动界面在适当的时候隐藏。如该字段置为false，则启动页需要开发者自行调相关接口关闭(api.removeLaunchView)。置为true，则引擎自动关闭。默认显示3秒后关闭，如3秒内网页未加载完毕则一直等待，直到网页加载完毕再关闭启动页。

描述：配置应用界面是否和设备状态栏重合，表现效果为系统的状态栏是否覆盖在当前应用上，即“沉浸式效果”。

描述：配置应用是否全屏运行。如果该字段为true，应用将以全屏的方式启动，并以全屏方式运行。运行过程中可随时通过APICloud开放的API（api.setFullScreen）控制退出全屏或重新进入全屏。云编译有效。

描述：配置应用是否自动检测更新。如果该字段为true，应用在启动时将自动与云端握手，并检查本应用是否有更新，是否被强制关闭，是否强制更新等（以上控制可在云端控制台“版本”中设置）。应用运行过程中会根据这些设置进行相关操作，如：自动下载、强制关闭应用等；若配置为false，则不会弹出任何更新提示。云编译有效。

描述：配置应用是否支持增量更新以及云修复。如果该字段为true，应用在启动时将自动与云端握手，并检查本应用当前版本下是否有增量包更新，是否需要进行云修复。应用运行过程中会根据这些设置进行相关操作，如：提示更新下载、静默更新下载等。云编译有效。

描述：配置应用是否处于调试模式。如果该字段为true，标识应用进入调试模式，应用运行过程中发生的因代码书写失误等原因导致的Js报错（引起执行中断）信息，将会以弹窗的方式覆盖在应用最上方，供开发者参考。

描述：配置是否允许使用第三方键盘。若不允许，键盘弹出后将不能选择第三方输入法进行输入。只支持iOS，云编译有效。

描述：配置键盘弹出后页面的处理方式。云编译有效。
resize：弹出键盘时会把页面往上推移，iOS平台resize和auto等效;
pan：弹出键盘时页面不会被往上推移
auto：由系统根据输入框位置决定是否页面往上推移

描述：配置是否显示键盘上方的工具条。该配置只对通过api对象方法打开的页面有效。只支持iOS。

描述：配置是否允许iOS 11及以上系统中页面元素默认的拖拽行为。只支持iOS。

//配置一个值：

//配置多个值，各值之间用竖线 | 隔开：

描述：用于配置字体文件，配置以后在前端页面里面就可以使用该字体。字体文件需放在widget目录里面，可以同时配置多种字体。目前只支持iOS，云编译有效。

//配置一个值：

//配置多个值，各值之间用竖线 | 隔开：

描述：用于配置iOS后台运行，配置后可以实现后台播放音乐、获取位置信息等功能。云编译有效。

“`

1531712097216

3.2掌握config文件使用

4.引擎的两个重要事件

4.1contet事件

此事件是在引擎解析config.xml文件中的Contont标签时产生，是事件队列中的第一个事件。引擎通过处理此事件得到应用（Main Widget）的根窗口（Root Window）需要自动加载的HTML文件。

指明Widget的起始页

4.2 apiready事件

此事件是在api对象准备完毕后产生，在每个Window或Frame的HTML代码中都需要监听此事件，以确定APICloud扩展对象已经准备完毕，可以调用了。注意只有在

  apiready = function(){
                ....
            };

中，可以调用APIcolud 封装的方法和属性，暴露在全局windows对象上的属性和方法

5.API对象

api对象是APICloud在全局作用域内唯一的一个扩展对象，api对象下包含了一个APP最常使用的扩展方法和属性，如窗口操作、事件监听、网络请求、设备访问等等。api对象无需引入，可以直接使用。而APICloud的扩展模块，都需要通过api.require方法引入后才能使用。

5.1查看api对象功能

api 对象提供了构建应用程序所需要的一些基本的方法[Method]，如窗口操作、相册和网络数据访问等；以及一些常见的属性[Attribute]，如屏幕宽度（screenWidth），系统类型（systemType）等；还有一些常用事件[Event]，如电量低（batterylow）事件、应用进入后台（pause）事件。api 对象不需要 require 引用，可以直接在 js 中使用。

Attribute 属性

appId 应用的 ID，可以在网站控制台概览里面查看，字符串类型
appName 应用在桌面显示名称，字符串类型
appVersion 应用版本号，字符串类型
systemType 手机平台的系统版本，字符串类型
version 引擎版本信息，字符串类型
deviceId 设备唯一标识，字符串类型
screenWidth 屏幕分辨率宽，数字类型
screenHight 屏幕分辨率高，数字类型
winName 当前 window 名称，字符串类该属性值为 openWin() 时传递的 name 参数值，注意首页的名称为 root
winWidth 当前 window 宽度，数字类型
winHeight 当前 window 高度，数字类型
frameName frame 名称，字符串类型若当前环境为 window 中，则该属性值为空字符串
frameWidth frame 宽度，数字类型若当前环境为 window 中，则值和 winWidth 相同
frameHeight frame 高度，数字类型若当前环境为 window 中，则值和 winHeight 相同
safeArea 页面不被其它内容（如状态栏）遮住的区域，JSON对象通过safeArea能够知道当前页面哪些地方被遮住，从而做出相应的调整，保证页面重要元素不被遮挡住。比如应对顶部header被状态栏遮住一部分，可以为header增加一个paddingTop，如： header.style.paddingTop = api.safeArea.top + ‘px’;

在比如在iPhone X上面，底部的导航菜单会被虚拟Home键遮住一部分，可以为footer增加一个paddingBottom，如：

footer.style.paddingBottom = api.safeArea.bottom + ‘px’;
pageParam 页面参数，JSON 对象类型用于获取页面间传递的参数值，为 openWin()、openFrame() 等方法中的 pageParam 参数对应值 var pageParam = api.pageParam; //比如： {“name” : “tans-con”}
wgtParam widget 参数，JSON 对象类型用于获取 widget 间传递的参数值，为 openWidget() 方法中的 wgtParam 参数对应值 var wgtParam = api.wgtParam; //比如： {“name”: “API Demo”}
appParam 当应用被第三方应用打开时，传递过来的参数，字符串类型建议通过appintent事件监听应用被第三方应用调起，并在事件回调里面获取参数进行处理。
statusBarAppearance 当前应用状态栏是否支持沉浸式效果，布尔类型 var statusBarAppearance = api.statusBarAppearance; // 比如： true
wgtRootDir widget: //协议对应的真实目录，即 widget 网页包的根目录，字符串类型

注意该目录为只读，不要往该目录下面写文件 var wgtRootDir = api.wgtRootDir; /* 比如： /private/var/mobile/Containers/Bundle/Application/56218B5B-1B59-48CD-8080-DAC54DB46446/UZApp.app/widget */

Event事件
- apiready 此事件是在api对象准备完毕后产生，在每个Window或Frame的HTML代码中都需要监听此事件，以确定APICloud扩展对象已经准备完毕，可以调用了。
```
apiready = function() {
    bMap = api.require("bMap");        
}
```
- batterylow 设备电池电量低事件，字符串类型
```
api.addEventListener({
    name: 'batterylow'
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});
```
- batterystatus 设备电池状态改变事件，如电量变化或正在充电，字符串类型
```
api.addEventListener({
    name: 'batterystatus'
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});
```
- keyback 设备 back 键被点击事件，仅 Android 平台有效，字符串类型该事件必须在 Window 中注册才有效，Frame 中注册无效，并且只在当前屏幕上的 window 才能收到回调。
```
api.addEventListener({
    name: 'keyback'
}, function(ret, err) {
    alert('按了返回键');
});
```
- keymenu 设备 menu 键被点击事件，仅 Android 平台有效
  
  该事件必须在 Window 中注册才有效，Frame 中注册无效，并且只在当前屏幕上的 window 才能收到回调。
  - volumeup 设备音量加键被点击事件，仅 Android 平台有效
  该事件必须在 Window 中注册才有效，Frame 中注册无效，并且只在当前屏幕上的 window 才能收到回调。
```
api.addEventListener({
    name: 'volumeup'
}, function(ret, err) {
    alert('按了音量加键');
});
```
- volumedown 设备音量减键被点击事件，仅 Android 平台有效该事件必须在 Window 中注册才有效，Frame 中注册无效，并且只在当前屏幕上的 window 才能收到回调。
```
api.addEventListener({
    name:'volumedown'
}, function(ret, err){        
    alert('按了音量减键');
});
```
- offline
- online
- pause
- resume
- scrolltobottom
- shake
- takescreenshot
- appidle
- swipedown
- swipeleft
- swiperight
- swiperip
- tap
- longpress
- viewappear
- viewdisappear
- noticeclicked
- appintent
- smartupdatefinish
- launchviewclicked
- keyboardshow
- keyboardhide
- safeareachanged

Method方法

1.1窗口系统

openWin 打开window

若window已存在，则会把该window显示到最前面，同时若url有变化或者reload参数为true时，页面会重新加载。若当前正在进行openWin、closeWin等带动画过渡的window操作，调用此方法会失效。

openWin({params})
```
api.openWin({
  name: 'page1',
  url: './page1.html',
  pageParam: {
      name: 'test'
  }
});
```

closeWin 关闭 window

若当前正在进行 openWin、closeWin 等带动画过渡的 window 操作，调用此方法会失效

closeWin({params})

//关闭当前window，使用默认动画
api.closeWin();

//关闭指定window，若待关闭的window不在最上面，则无动画
api.closeWin({
  name: 'page1'
});

closeToWin 关闭到指定 window，最上面显示的 window 到指定 name 的 window 间的所有 window 都会被关闭

若当前正在进行 openWin、closeWin 等带动画过渡的 window 操作，调用此方法会失效

closeToWin({params})
```
api.closeToWin({
  name: 'root'
});
```
setWinAttr 设置window属性参数有： bounces ——（可选项）页面是否弹动 bgColor ——（可选项）背景色，支持图片和颜色，格式为#fff、#ffffff、rgba(r,g,b,a)等，图片路径支持fs://、widget://等APICloud自定义文件路径协议，同时支持相对路径 scrollToTop ——（可选项）当点击状态栏，页面是否滚动到顶部。若当前屏幕上不止一个页面的scrollToTop属性为true，则所有的都不会起作用。只iOS有效 scrollEnabled ——（可选项）页面内容超出后是否可以滚动，只支持iOS vScrollBarEnabled ——（可选项）是否显示垂直滚动条 hScrollBarEnabled ——（可选项）是否显示水平滚动条 scaleEnabled ——（可选项）页面是否可以缩放

openFrame 打开 frame

若 frame 已存在，则会把该窗口显示到最前面并显示，如果 url 和之前的 url 有变化，或者 reload 为 true 时，页面会刷新

此方法对 frameGroup 里面的 frame 不起作用

openFrame({params})

api.openFrame({
  name: 'page2',
  url: './page2.html',
  rect: {
      x: 0,
      y: 0,
      w: 'auto',
      h: 'auto'
  },
  pageParam: {
      name: 'test'
  }
});   //一般在Window页中会使用，并且要写在apiready = function(){
  ...  
}中

closeFrame 关闭frame closeFrame({params})
```
api.closeFrame({
  name: 'page2'
});
```
setFrameAttr 设置frame属性 setFrameAttr({params})
bring FrameToFront 调整 frame 到前面 bringFrameToFront({params})
- setFrameToBack 调整 frame 到前面 bringFrameToFront({params})

1.2应用管理

installApp 安装应用，如果是苹果的AppStore应用地址，将会跳转到AppStore应用详情页面

//Android用法： api.installApp({ appUri: ‘file://xxx.apk’ }); //iOS用法： api.installApp({ appUri: ‘https://list.kuaiapp.cn/list/KuaiAppZv7.1.plist’ //安装包对应plist地址 });
uninstallApp 卸载应用，只支持Android api.uninstallApp({ packageName: ‘com.yourcompany.yourapp’ });
openApp 打开手机上其它应用，可以传递参数 //iOS中的使用方法如下： api.openApp({ iosUrl: ‘weixin://’, //打开微信的，其中weixin为微信的URL Scheme appParam: { appParam: ‘app参数’ } }); //Android中的使用方法如下： api.openApp({ androidPkg: ‘android.intent.action.VIEW’, mimeType: ‘text/html’, uri: ‘http://www.baidu.com’ }, function(ret, err) { if (ret) { alert(JSON.stringify(ret)); } else { alert(JSON.stringify(err)); } });
appInstalled //异步返回结果： api.appInstalled({ appBundle: ‘xxx’ }, function(ret, err) { if (ret.installed) { //应用已安装 } else { //应用未安装 } }); //同步返回结果： var installed = api.appInstalled({ sync: true, appBundle: ‘xxx’ }); if (installed) { //应用已安装 } else { //应用未安装 }
rebootApp 重启应用，云修复完成后可以调用此方法来重启应用使云修复生效。

api.rebootApp();
openWidget api.openWidget({ id: ‘A00000001’, animation: { type: ‘flip’, subType: ‘from_bottom’, duration: 500 } }, function(ret, err) { if (ret) { alert(JSON.stringify(ret)); } else { alert(JSON.stringify(err)); } });
closeWidget api.closeWidget({ id: ‘A00000001’, retData: { name: ‘closeWidget’ }, animation: { type: ‘flip’, subType: ‘from_bottom’, duration: 500 } });

ajax

// 表单方式提交数据或文件 
api.ajax({ url: 'http://192.168.1.101:3101/upLoad', 
           method: 'post', 
           data: { values: { name: 'haha' }, 
           files: { file: 'fs://a.gif' } 
           } 
           }, function(ret, err) {
           if (ret) {
           api.alert({ msg: JSON.stringify(ret) }); } else { api.alert({ msg: JSON.stringify(err) }); } }); // 提交JSON数据 api.ajax({ url: 'http://192.168.1.101:3101/upLoad', method: 'post', headers: { 'Content-Type': 'application/json' }, data: { body: { name: 'haha' } } }, function(ret, err) { if (ret) { api.alert({ msg: JSON.stringify(ret) }); } else { api.alert({ msg: JSON.stringify(err) }); } });

cancelAjax api.cancelAjax( { tag: ‘publish’ });

download

api.download({
  url: url,
  savePath: 'fs://test.rar',
  report: true,
  cache: true,
  allowResume: true
}, function(ret, err) {
  if (ret.state == 1) {
      //下载成功
  } else {

  }
});

cancelDownload api.cancelDownload({ url: url });

imageCache

api.imageCache({
  url: 'http://a.hiphotos.baidu.com/image/w%3D400/sign=2abe1c77d4ca7bcb7d7bc62f8e086b3f/64380cd7912397ddf9f4bdb05a82b2b7d1a287f0.jpg'
}, function(ret, err) {
  var url = ret.url;
});

readFile

//异步返回结果：
api.readFile({
  path: 'fs://a.txt'
}, function(ret, err) {
  if (ret.status) {
      var data = ret.data;
  } else {
      alert(err.msg);
  }
});

//同步返回结果：
var data = api.readFile({
  sync: true,
  path: 'fs://a.txt'
});

writeFile

setPrefs

api.setPrefs({
  key: 'k',
  value: '1'
});

getPrefs

//异步返回结果：
api.getPrefs({
  key: 'userName'
}, function(ret, err) {
  var userName = ret.value;
});

//同步返回结果：
var userName = api.getPrefs({
  sync: true,
  key: 'userName'
});

**removePrefs **api.removePrefs({ key: ‘k’ });

clearCache clearCache({params}, callback(ret, err))

api.clearCache(function() {
  api.toast({
      msg: '清除完成'
  });
});

1.3网络通信

1.4数据存储

1.5消息事件

addEventListener 监听事件，可支持用户自定义事件和消息事件。

addEventListener({params}, callback(ret, err))

params: name：为字符串类型，自定义事件或系统事件名

extra：JSON对象，额外数据
```
//如监听网络连接事件
api.addEventListener({
  name: 'online'
}, function(ret, err) {
  alert('已连接网络');
});
```
removeEventListener 移除事件监听 removeEventListener({params})
```
api.removeEventListener({
  name: 'online'
});
```

sendEvent 将任意一个自定义事件广播出去，该事件可在任意页面通过 addEventListener 监听收到。 sendEvent({params})

params

name:字符串，任意事件的名称；

extra：字符串或者JSON对象，在监听页面的回调中，可以通过ret.value 取

api.sendEvent({
  name: 'myEvent',
  extra: {
      key1: 'value1',
      key2: 'value2'
  }
});

//html页面a：
api.addEventListener({
  name: 'myEvent'
}, function(ret, err) {
  alert(JSON.stringify(ret.value));
});

//html页面b：
api.addEventListener({
  name: 'myEvent'
}, function(ret, err) {
  alert(JSON.stringify(ret.value));
});

//a、b页面都将收到 myEvent 事

accessNative 使用 SuperWebView 时，js 向原生发送消息。此方法只在使用 SuperWebView 时有效。

accessNative({params}, callback(ret, err))

params

name

类型：字符串
默认值：无

描述：消息名称。

extra

类型：JSON 对象
默认值：无
描述：（可选项）附带的参数。

api.accessNative({
  name: 'showMenu',
  extra: {
      key: 'value'
  }
}, function(ret, err) {
  if (ret) {
      alert(JSON.stringify(ret));
  } else {
      alert(JSON.stringify(err));
  }
});

notification 向用户发出震动、声音提示、灯光闪烁、手机状态栏通知等提示行为，支持闹钟功能。如果是状态栏通知，当用户点击该通知，页面可以通过监听 noticeclicked 事件获取该通知相关内容

notification({params}, callback(ret, err))

//仅震动
api.notification({
  vibrate:[100, 500, 200, 500, 300, 500, 400, 500]
});

//仅提示音
api.notification({
  sound:'default'
});

//提示音+震动
api.notification();

//弹出状态栏通知
api.notification({
  notify: {
  title: '通知标题',
      content: '通知内容'
  }
});

//闹铃
api.notification({
  notify: {
      content: '闹钟'
  },
  //每周一、二、三、四、五的7点30分闹铃
  alarm: {
      hour: 7,
      minutes: 30,
      daysOfWeek: [2, 3, 4, 5, 6]
  }
}, function(ret, err) {
  var id = ret.id;
});

cancelNotification 取消本应用弹出到状态栏的某个或所有通知，也可以清除设定的闹铃 cancelNotification({params})

params

id 调用notification 返回的ID

api.cancelNotification({ id: 1 });

startLocation startLocation({params}, callback(ret, err))

params

accuracy : 字符串取值范围

filter: 位置更新所需要的最小距离

autostop :获取到位置信息后是否自动停止定位


- api.startLocation({ accuracy: '100m', filter: 1, autoStop: true }, function(ret, err){ if(ret && ret.status){ //获取位置信息成功 }else{ alert(JSON.stringify(err)); } }); 
-

stopLocation api.stopLocation();

getLocation

api.getLocation(function(ret, err) {
  if (ret && ret.status) {
      //获取位置信息成功
  } else {
      alert(JSON.stringify(err));
  }
});

startSensor startSensor({params}, callback(ret, err))

api.startSensor({
  type: 'accelerometer'
}, function(ret, err) {
  if (ret && ret.status) {

  } else {

  }
});

stopSensor api.stopSensor({ type: ‘accelerometer’ });

call 拨打电话或进行 FACE TIME

api.call({
  type: 'tel_prompt',
  number: '10086'
});

sms 调用系统短信界面发送短信，或者直接发送短信

sms({params}, callback(ret, err))

params

numbers：电话号码

text ：文本内容

silent：后台发送时，numbers 支持多个，可同时将一条信息发送给多个号码

api.sms({ numbers: ['10086'], text: '测试短信' }, function(ret, err) { if (ret && ret.status) { //已发送 } else { //发送失败 } });

mail 发送邮件 mail({params}, callback(ret, err))

params

recipients：字符串数组收件人

subject ：字符串邮件主题

body ：邮件内容

attachments：数组附件地址
- 描述：（可选项）附件地址。支持fs://协议，以及其他模块或者api返回的路径，附件必须是位于设备公共存储空间，系统邮件APP能访问到的存储。
```
api.mail({
  recipients: ['test@163.com'],
  subject: '邮件测试',
  body: '这是一封测试用的邮件',
  attachments: ['fs://test.jpg']
}, function(ret, err) {
  if (ret && ret.status) {
      //已发送
  } else {

  }
});
```

需要手机上配置好用户账号

openContacts 在应用内打开系统通讯录界面选择联系人 openContacts(callback(ret, err))

ret : _类型：JSON 对象

{ status:true, //操作成功状态值 name:”“, //姓名 phone:”” //电话号码 }

err：类型：JSON 对象

api.openContacts(function(ret, err) {
    if (ret && ret.status) {
        var name = ret.name;
        var phone = ret.phone;
    } else {

    }
});

setFullScreen 设置是否全屏
setStatusBarStyle
setScreenOrientation
setKeepScreenOn
toLauncher
setScreenSecure
setAppIconBadge
getPhoneNumber

1.6设备访问

1.7UI组件

alert 弹出带一个按钮的对话框，更多按钮的对话框请使用confirm方法
confirm 弹出带两个或三个按钮的confirm对话框 confirm({params}, callback(ret, err))
prompt 弹出带两个或三个按钮和输入框的对话框 prompt({params}, callback(ret, err))

actionSheet 底部弹出框 actionSheet({params}, callback(ret, err))

api.actionSheet({
  title: '底部弹出框测试',
  cancelTitle: '这里是取消按钮',
  destructiveTitle: '红色警告按钮',
  buttons: ['1', '2', '3']
}, function(ret, err) {
  var index = ret.buttonIndex;
});

showProgress 显示进度提示框
hideProgress 隐藏进度提示框
toast 弹出一个定时自动关闭的提示框
openPicker 打开时间选择器

setRefreshHeaderInfo 显示默认下拉刷新组件，使用默认下拉刷新组件时页面必须设置为弹动。

api.setRefreshHeaderInfo({
  loadingImg: 'widget://image/refresh.png',
  bgColor: '#ccc',
  textColor: '#fff',
  textDown: '下拉刷新...',
  textUp: '松开刷新...'
}, function(ret, err) {
  //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态

});

setCustomRefreshHeaderInfo 显示自定义下拉刷新组件。使用自定义下拉刷新组件之前，需要在config.xml里面配置要使用的自定义下拉刷新模块名称，如：

或者在使用openWin、openFrame等方法打开页面时传入customRefreshHeader参数来指定。

setCustomRefreshHeaderInfo({params}, callback(ret, err))

api.setCustomRefreshHeaderInfo({
  bgColor: '#C0C0C0',
  images: {
      pull: 'widget://image/refresh/pulling.png',
      transform: [
          'widget://image/refresh/transform0.png',
          'widget://image/refresh/transform1.png',
          'widget://image/refresh/transform2.png',
          'widget://image/refresh/transform3.png',
          'widget://image/refresh/transform4.png',
          'widget://image/refresh/transform5.png',
          'widget://image/refresh/transform6.png'
      ],
      load: [
          'widget://image/refresh/loading0.png',
          'widget://image/refresh/loading1.png',
          'widget://image/refresh/loading2.png',
          'widget://image/refresh/loading3.png',
          'widget://image/refresh/loading4.png',
      ]
  }
}, function(ret, err) {
  //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态

});

refreshHeaderLoading 设置下拉刷新组件为刷新中状态
refreshHeaderLoadDone 通知下拉刷新数据加载完毕，组件会恢复到默认状态 api.refreshHeaderLoadDone();

showFloatBox 展示一个悬浮框，浮动在屏幕上。

api.showFloatBox({
  iconPath: 'widget://image/icon.png',
  duration: 3000
});

1.8多媒体

getPicture 通过调用系统默认相机或者图库应用，获取图片以及视频媒体文件。 getPicture({params}, callback(ret, err))
saveMediaToAlbum 保存图片和视频到系统相册
startRecord 录制amr格式音频
stopRecord 结束amr格式音频
startPlay 播放本地音频，支持amr格式
stopPlay 停止播放音频 api.stopPlay();
openVideo api.openVideo({ url: ‘fs://res/1.mp4’ });

1.9模块加载

require 引用模块 var bMap = api.require(“bMap”);

1.10Web app 历史

1.11其他

5.2api对象常用方法使用

6. 屏幕适配

6.1实现

设置 viewport

推荐的 UI尺寸是720x1280

优先考虑绝对计量类的单位 px，应先在UI效果图中（如720x1280尺寸图）量出元素的宽或高对应的 px 值，再除以屏幕倍率（如分辨率为720x1280设备的屏幕倍率通常为 2) 得到书写样式时的确切数值。

7.前端框架

api.js

api.css

8.状态栏处理

8.1 沉浸式状态栏效果说明

8.2 沉浸式效果实现

在config.xml文件配置是否开启:

在Window或Frame的apiready事件后，调用$api.fixStatusBar()方法;

api.setStatusBarStyle

9.界面布局相关API

api.openWidget()
api.closeWidget()

9.2 Window相关API
9.3 Layout相关API

FrameGroup
SlidLayout
DrawerLayout
9.4 Frame相关API
10.搭建APP整体框架，完成APP静态数据版本

10.1 页面UI结构分析

10.2 按照UI架构设计创建对应UI组件及H5文件

根据UI架构设计文档(ui-architecture.xmind)，创建需要的Window或Frame，以及Window或Frame所需加载的H5页面文件

10.3 编写Window或Frame所对应的H5页面
- 使用HTML标签构建页面元素: 注意要使用语义化标签
- header
- nav
- section
- footer
- 使用CSS为页面元素添加样式: 常用元素样式定义常用规范
- display
- position
- width
- height
- box-sizing
- 使用弹性盒子布局(flexbox): 注意考虑浏览器兼容性
- display: -webkit-box
- display: -webkit-flex
- display: flex
  
  –
- -webkit-box-orient: vertical
- -webkit-flex-flow: column
- flex-flow: column
  
  –
- -webkit-blox-orient: horizontal
- -webkit-flex-flow: row
- flex-flow: row
  
  –
- -webkit-box-flex: 1
- -webkit-flex: 1
- flex: 1
10.4 实现Frame之间切换
- 手势滑动切换
- 点击菜单切换
10.5 优化点击交互响应

消除webkit内核默认的onclick事件的300ms响应延迟
- tapmode属性
- api.parseTapmode方法
10.6 实现界面之间跳转

按照产品原型实现各UI界面之前的切换

10.7 实现页面之间的参数传递
- 参数pageParam
- api.pageParam
10.8 监听Android返回键，实现退出APP
- 监听keyback事件
10.9 阻止iOS滑动返回
- 设置slidBackEnabled参数

Huhui-coder

关注

1
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
APIcloud平台开发第二天笔记

APIcloud开发培训第二天1.理解APIcloud应用执行流程1.1流程说明流程：首先是APP启动(可以是其他应用调用，也可以是用户直接启动)，接着引擎初始化，Widget初始化，Window初始化，Module初始化，EventQueue初始化，CmmandQueue Init命令队列初始化， RunTime Ready 运行时环境准备，之后便是模块加...
复制链接

扫一扫