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

 

 

 

 

 

 

 

 

 

 

 

————占位符

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM