一、通過(guò)APICloud進(jìn)行App前端布局和數(shù)據(jù)交互
App前端布局：
Window ：窗口
Frame：子窗口
FrameGroup：一組子窗口的集合

目前成都創(chuàng)新互聯(lián)已為上千余家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)絡(luò)空間、網(wǎng)站托管運(yùn)營(yíng)、企業(yè)網(wǎng)站設(shè)計(jì)、成都網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶(hù)導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶(hù)和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

window+frame+html代碼的布局方式
整個(gè)頁(yè)面最外面是一個(gè)window，頭部和導(dǎo)航固定不變，為一個(gè)frame，下方內(nèi)容區(qū)域又是一個(gè)frame，整個(gè)frame里面就是具體的頁(yè)面內(nèi)容了，里面嵌套了html\css代碼

打開(kāi)新窗口的過(guò)程，就是在一組window+frame+html這種組合下，打開(kāi)另一組window+frame+html組合的過(guò)程

頁(yè)面內(nèi)容簡(jiǎn)單的情況下，可以直接在window當(dāng)中加載htmlcss代碼

打開(kāi)子窗口：api.openFrame

function openFrame(){
    api.openFrame({
        name:"",  //子窗口的名稱(chēng)
        url:"",  //子窗口的地址
        rect:{ //x和y是坐標(biāo)位置，子窗口顯示的起始坐標(biāo)，w和h是，寬度和高度
            x:0,
            y:0,
            w:"auto",
            h:"auto"
        }
    })
}

打開(kāi)子窗口組：api.openFrameGroup
打開(kāi)新窗口：api.openWin

下拉刷新：api.setRefreshHeaderInfo

apiready = function(){
    api.setRefreshHeaderInfo({
        visible:true,
        bgColor:"#ccc",
        textColor:"#fff",
        textDown:"拉一下試試",
        textUp:"試試就試試",
        showTime:true
    },function(){
        //coding...
        //查詢(xún)數(shù)據(jù)庫(kù)
        //判斷是否有新數(shù)據(jù)
        //更新新數(shù)據(jù)
        api.refreshHeaderLoadDone();
    })
}

定義的方法統(tǒng)一放在：

apiready = function(){
    openFrame();
}

數(shù)據(jù)交互：
數(shù)據(jù)存儲(chǔ)：
file模塊：目錄操作，文件操作
文件存儲(chǔ)方式，用于圖片、文檔的上傳下載刪除管理
db：本地sqlite數(shù)據(jù)庫(kù)
用于離線數(shù)據(jù)的存儲(chǔ)
localstorage：html5，localstorage
用于一些變量的存儲(chǔ)傳遞，比如用戶(hù)的登錄狀態(tài)、多個(gè)頁(yè)面之間的變量傳遞
注意：cookie、session無(wú)法使用
preterence：setPrefs、getPrefs、removePrefs
apicloud封裝好的偏好數(shù)據(jù)存儲(chǔ)模塊，如應(yīng)用皮膚、字體大小等個(gè)性化的設(shè)置

與自建服務(wù)器的網(wǎng)絡(luò)通信
api.ajax

WiFi真機(jī)同步配置
在APP Loader里面，點(diǎn)擊小圓圈，進(jìn)入配置頁(yè)
在APICloud Studio 2 項(xiàng)目，右鍵 查看wifi真機(jī)同步ip和端口
如果顯示連接失敗，則：打開(kāi)電腦防火墻，允許APICloud Studio 2 使用專(zhuān)用和共用網(wǎng)絡(luò)

這樣：在代碼中可以console.log()內(nèi)容，在APICloud Studio 2控制臺(tái)可以即時(shí)顯示出來(lái)

本地修改了代碼，同步到云端：

• 在做云端同步前,開(kāi)發(fā)者需要將變更的文件,做一次本地提交: 右鍵文件或目錄或項(xiàng)目根目錄 -> Git -> Git add + commit
• 云端同步,指的是將已提交到本地 GIT 倉(cāng)庫(kù)的變更,同步到云端SVN/GIT服務(wù)器;未做本地提交的文件變更,不會(huì)提交到云端 SVN/GIT 服務(wù)器

請(qǐng)?jiān)诘撞枯斎肟蜉斎胍欢胃恼f(shuō)明,以完成本地提交

• 輸入的說(shuō)明文字,請(qǐng)不要以 # 開(kāi)頭.

• 輸入完成后,請(qǐng) ctrl/cmd + S 保存,以完成本地提交.
• 只有進(jìn)行了本地提交的文件變更,才能使用云端同步功能,將變更同步到云端.
• 云端同步支持批量提交,即本地提交多次,只需要一次云端同步即可全部同步到服務(wù)器.
• 沒(méi)有網(wǎng)絡(luò)也可以進(jìn)行本地提交
• 暫時(shí)不想進(jìn)行本地提交的文件,請(qǐng)使用本地代碼時(shí)光機(jī)手動(dòng)備份代碼: 右鍵項(xiàng)目根目錄->代碼管理->本地代碼時(shí)光機(jī)->手動(dòng)備份
• 如果提示 "Nothing to commit",可安全忽略此提示.

通過(guò)使用AppLoader，在AppLoader里面安裝正在開(kāi)發(fā)的app，用數(shù)據(jù)線連接電腦，配置好ip和端口，點(diǎn)擊wifi增量同步，可以編輯代碼，在app里面實(shí)現(xiàn)同步更新

在手機(jī)上也可以額外安裝該app，那么可以使用該app，進(jìn)行安裝、推送更新等測(cè)試

二、API對(duì)象
apiready = function () {
var appId = api.appId; //比如： A6980386445546
var appName = api.appName; //比如： AppLoader
var appVersion = api.appVersion; // 比如： 1.0.0
var systemType = api.systemType; // 比如： ios
var systemVersion = api.systemVersion; // 比如： 8.0
var deviceModel = api.deviceModel; // 比如： iPhone 5
var operator = api.operator; // 比如：中國(guó)移動(dòng)
var connectionType = api.connectionType; //比如： wifi
var fullScreen = api.fullScreen; // 比如： true
var screenWidth = api.screenWidth; // 比如： 640
var screenHeight = api.screenHeight; // 比如： 960
var winName = api.winName; //比如： root
var winWidth = api.winWidth; azs // 比如： 320 此屬性值不同于屏幕的分辨率，比如 iPhone 5 的分辨率為 640x1136，但是其 winWidth 為 320，因此前端需根據(jù) winWidth 和 winHeight 來(lái)進(jìn)行布局
var winHeight = api.winHeight; // 比如： 568
var frameName = api.frameName; //比如： trans-con
var frameWidth = api.frameWidth; // 比如： 320,若當(dāng)前環(huán)境為 window 中，則值和 winWidth 相同
var frameHeight = api.frameHeight; // 比如： 504,若當(dāng)前環(huán)境為 window 中，則值和 winHeight 相同
var pageParam = api.pageParam; //比如： {"name" : "tans-con"} JSON用于獲取頁(yè)面間傳遞的參數(shù)值，為 openWin()、openFrame() 等方法中的 pageParam 參數(shù)對(duì)應(yīng)值
var wgtParam = api.wgtParam; //比如： {"name": "API Demo"},用于獲取 widget 間傳遞的參數(shù)值，為 openWidget() 方法中的 wgtParam 參數(shù)對(duì)應(yīng)值
var appParam = api.appParam; // 比如： appLoader,當(dāng)應(yīng)用被第三方應(yīng)用打開(kāi)時(shí)，傳遞過(guò)來(lái)的參數(shù)，字符串類(lèi)型
var statusBarAppearance = api.statusBarAppearance; // 比如： true,當(dāng)前應(yīng)用狀態(tài)欄是否支持沉浸式效果，布爾類(lèi)型
var wgtRootDir = api.wgtRootDir; //widget: //協(xié)議對(duì)應(yīng)的真實(shí)目錄，即 widget 網(wǎng)頁(yè)包的根目錄，字符串類(lèi)型
var fsDir = api.fsDir; //fs: //協(xié)議對(duì)應(yīng)地真實(shí)目錄，字符串類(lèi)型
var cacheDir = api.cacheDir; //cache://協(xié)議對(duì)應(yīng)的真實(shí)目錄，字符串類(lèi)型

}

三、跳轉(zhuǎn)頁(yè)面的兩種方式

1、
api.openFrame ({
    name: 'AllGroup',
    url: '../AllGroup.html',
    reload:'true',
    rect:{
        x:0,
        y:41,
        w:'auto',
        h:'auto'
    },
    bounces: false,
    pageParam: {
        "id":api.pageParam.id 
    }
});

2、
api.openWin({
    name: type,
    url: 'header/'+type+'.html',
    bounces: false,
    pageParam: {
    "id":id //id
    }
});
說(shuō)明：pageParam是用來(lái)在頁(yè)面間傳值的，獲取上一頁(yè)面?zhèn)鱽?lái)的值的方式是api.pageParam.id(其中id是在傳值時(shí)的變量名,若變量名為name,這里就寫(xiě)api.pageParam.name).

3、關(guān)閉頁(yè)面
api.closeWin({name:pagename});pagename是所要關(guān)閉頁(yè)面的全名稱(chēng)

四、沉浸式效果實(shí)現(xiàn)
在config.xml文件配置是否開(kāi)啟:
<preference name="statusBarAppearance" value="true" />
沉浸式效果配置說(shuō)明
在Window或Frame的apiready事件后，調(diào)用$api.fixStatusBar()方法;

五、CSS Framework
清除瀏覽器默認(rèn)樣式（借鑒CSS Reset，Normalize.css）
禁用系統(tǒng)長(zhǎng)按菜單（-webkit-touch-callout:none）
禁用字體大小自動(dòng)調(diào)整（-webkit-text-size-adjust:none）
去掉點(diǎn)擊高亮（-webkit-tap-highlight-color:rgba(0, 0, 0, 0)）
禁止選擇內(nèi)容（-webkit-user-select:none）
清除浮動(dòng)（.clearfix）
加載更多默認(rèn)樣式（.loading_more）
<permission name="call"/>打電話
<permission name="sms"/>短信
<permission name="camera"/>相機(jī)
<permission name="record"/>錄音
<permission name="location"/>位置
<permission name="fileSystem"/>
<permission name="internet"/>
<permission name="bootCompleted"/>開(kāi)機(jī)啟動(dòng)
<permission name="hardware"/>控制振動(dòng)/閃光燈/屏幕休眠
<permission name="contact"/>聯(lián)系人

六、選擇器
var main = $api.byId('main');
var headerPos = $api.offset(header);

七、pageParam
頁(yè)面參數(shù)，JSON 對(duì)象類(lèi)型
用于獲取頁(yè)面間傳遞的參數(shù)值，為 openWin()、openFrame() 等方法中的 pageParam 參數(shù)對(duì)應(yīng)值

八、打開(kāi)一個(gè)frame組

api.openFrameGroup({
name: 'group1',
background: '#fff',
scrollEnabled: false,
rect: {
    x: 0,
    y: 0,
    w: 'auto',
    h: 'auto'
},
index: 0,
frames: [{
    name: 'frame1',
    url: 'frame1.html',
    bgColor: '#fff'
}, {
    name: 'frame2',
    url: 'frame2.html',
    bgColor: '#fff'
}]
}, function(ret, err) {
    var index = ret.index;
});

關(guān)閉一個(gè)frame組

api.closeFrameGroup({
    name: 'group1'
});

九、apicloud使用ajax，傳遞參數(shù)，data的使用方法和qjuery的不一樣

data : {
        values: {
            deviceName:"",
        }
}

外面套上values

十、tapmode和parseTapmode屬性詳解

一、在開(kāi)發(fā)的過(guò)程中，直接給元素綁定事件屬性onclick，會(huì)點(diǎn)擊沒(méi)反應(yīng)，這時(shí)，給標(biāo)簽加上tapmode，就解決了問(wèn)題，查了一下，原來(lái)，tapmode具有速點(diǎn)擊事件功能，在觸發(fā)事件中加入tapmode可以消除JS中標(biāo)準(zhǔn)click事件的300毫秒延遲；同時(shí)，它具有觸發(fā)可顯示樣式的效果，tapmode='css樣式類(lèi)' 屬性，當(dāng)該元素touchstart touchmove的時(shí)候就會(huì)展現(xiàn)css樣式。
實(shí)例<div class="menu" tapmode onclick="setAlert()">零食</div>

function setAlert(){
alert('你好');
}

1.tapmode具有速點(diǎn)擊事件功能，在觸發(fā)事件中加入tapmode可以消除JS中標(biāo)準(zhǔn)click事件的300毫秒延遲；
2.tapmode具有觸發(fā)可顯示樣式的效果，tapmode='xxx'屬性，’xxx‘為css樣式類(lèi)，當(dāng)該元素touchstart touchmove的時(shí)候就會(huì)展現(xiàn)xxx樣式。

二、parseTapmode屬性
解析元素 tapmode 屬性，優(yōu)化點(diǎn)擊事件處理
默認(rèn)頁(yè)面加載完成后，引擎會(huì)對(duì) dom 里面的元素進(jìn)行 tapmode 屬性解析，若是之后用代碼創(chuàng)建的 dom 元素，則需要調(diào)用該方法后 tapmode 屬性才會(huì)生效
api.parseTapmode()

網(wǎng)站題目：APICloud教程
網(wǎng)站鏈接：http://www.rwnh.cn/article18/ihjjgp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、電子商務(wù)、Google、企業(yè)建站、品牌網(wǎng)站制作、定制網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)