apicloud使用指南

ApiCloud

ApiCloud平臺介紹

ApiCloud首頁
在線教程文檔
ApiCloud是一個國內的Hybird APP平臺，提供Hybird APP一站式開發服務。可以將使用HTML、CSS和JS制作的應用直接編譯為能在安卓和IOS平臺上運行的APP。另外，其所提供的代碼托管和在線編譯服務，可以大大節省開發時間和開發成本。

環境搭建

注冊賬號

https://www.apicloud.com/signup

Alt text

下載IDE

http://www.apicloud.com/devtools

Alt text

安裝手機調試APP

可以在開發軟件的幫助菜單中找到以下二維碼：

Alt text

創建應用

Alt text

Alt text

刪除默認生成的launch和icon文件夾。

APP開發

配置config.xml

https://docs.apicloud.com/Dev...

<!--應用的ID和版本號，這里的版本號沒有任何用處-->
<widget id="A6948895441294" version="0.0.1">  <!--啟動時自動打開的頁面，即名字為root的window中顯示的頁面--><content src="index.html"/><!--APP背景（一般無需設置）--><preference name="appBackground" value="rgba(0,0,0,0)"/><!--window的默認背景（一般無需設置）--><preference name="windowBackground" value="rgba(0,0,0,0)"/>  <!--frame的默認背景（一般無需設置）--><preference name="frameBackgroundColor" value="rgba(0,0,0,0)"/> <!--是否自動關閉啟動頁--><preference name="autoLaunch" value="true"/><!--是否自動云端更新（一般無需設置）--><preference name="autoUpdate" value="true"/><!--是否允許云端修復（一般無需設置）--><preference name="smartUpdate" value="false"/><!--是否是DEBUG模式（一般無需設置）--><preference name="debug" value="true"/><!--是否是沉浸式樣式--><preference name="statusBarAppearance" value="true"/>
</widget>

沉浸式樣式

Alt text

簡單開發

使用HTML、CSS和JS以及它們的衍生框架制作出移動端網頁，并在制作時注意以下問題：

1、每個頁面的head部分加入

<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">

2、使用api.css作為CSS Reset使用。
3、盡量不要使用jQuery等比較重的前端框架去直接操作DOM。
4、布局主要使用適配 -webkit- 的彈性盒子布局。

編譯打包

1、將整個項目的代碼進行提交（右鍵項目—云端同步—提交）。
2、在開發者控制臺（https://www.apicloud.com/console）中打開項目并繼續進行以下步驟。
3、端設置：設置安卓圖標（144像素的png圖像）和IOS圖標（1024像素的png圖像）。
4、證書：提供對應平臺的證書，安卓證書可以在線生成，IOS證書需要使用IOS開發者賬號在IOS官方獲取。
5、代碼：根據代碼更新日志確認代碼已經上傳完畢。
6、模塊：將項目中所有使用的模塊添加。
7、云編譯：填寫應用名稱和英語名稱；選擇平臺、類型；填寫版本號；點擊云編譯。

補充：3位版本號的一般計算規則

1、不影響功能的頁面更新或顯示性錯誤修復時增加最小的版本號。
2、沒有增加和刪除功能，只是對現有功能進行更新，而且能兼容舊版本的數據時增加中間的版本號。
3、增加或刪除功能，或者對現有功能進行更新后不能再兼容舊版本數據時增加最大的版本號。

三大原生布局系統

固然，使用原本的HTML+CSS+JS就能完成布局和視圖切換。但是，為了更好的原生兼容性和運行速度，推薦使用ApiCloud封裝好的原生布局系統： window 、 frame 和 widget 。

window

在APP中，window指用戶看到的整個屏幕。如果是非沉浸式樣式，window的繪制起點（x=0 y=0）為通知欄以下的左上角；如果是沉浸式樣式，window的繪制起點（x=0 y=0）為整個用戶屏幕的左上角。

window的寬度和高度是自動決定的，程序員無法干涉。

frame

frame是指的用戶視圖的某個局部，它有自己的繪制起點和寬高。除非特殊場景需要（比如地圖），frame不能超出window以外。

在創建一個frame時，程序員可以指定x、y、寬和高。

widget

考慮到運行效率和實現難度，有些效果使用HTML+CSS+JS不是很合適。此時，就要使用ApiCloud封裝好的原生模塊去顯示。

注意：widget一定會處于布局的最上層，而且本身不參與頁面流，一般需要在頁面中使用其它布局為其預留位置。

tapmode

在需要監聽點擊事件的標簽（包括a標簽）中加入 tapmode 屬性可以取消掉手機端JS對于點擊事件的300ms延遲（主要針對IOS系統，安卓系統使用viewport禁止縮放后會自動取消這個延遲）。

另外，tapmode屬性可以接受一個class名作為屬性值，當用戶按住這個標簽時，會自動使用這個class；當用戶松手后，會刪除這個class。

api和$api

api和$api是ApiCloud封裝的兩個JS對象，可以在JS代碼中直接使用。

api主要封裝一些直接與安卓系統或IOS系統進行交互的native方法（比如獲取手機電量，調起攝像頭，引入其他模塊，進行數據存取等）。

$api是類似于jQuery的前端輔助框架，比jQuery更加輕量級。（需要引入api.js）

api的主要用法

https://docs.apicloud.com/Cli...

因為api對象需要和系統進行交互，因此需要等待這個對象初始化完畢。需要訪問這個對象的代碼要放在以下結構中執行($api中大部分方法無此限制)：

apiready = function(){//在這里里面才可以訪問api對象，否則會報api沒有定義的錯誤。
}

常用屬性

//當前網絡類型 
api.connectionType
"unknown"        //未知
"ethernet"       //以太網
"wifi"           //wifi
"2g"             //2G網絡
"3g"             //3G網絡
"4g"             //4G網絡
"none"           //無網絡//window寬度，數字類型，以像素為單位
api.winWidth
//window高度，數字類型，以像素為單位
api.winHeight//以json形式返回打開頁面時傳遞的參數，配合api.openWin()和api.openFrame()中的pageParam屬性使用
api.pageParam//widget協議對應的目錄，為只讀目錄，不要在應用運行期間向此目錄寫入
api.wgtRootDir
//fs協議對應的目錄
api.fsDir
//cache協議對應的目錄
api.cacheDir

調用api對象相關方法時的通用形式

//api對象上的方法（核心API）
api.方法名(參數,回調函數);
//引用其他模塊
var module = api.require("模塊名");
module.方法名(參數,回調函數);//參數均為json參數
//如果有回調函數，那么遵循這種格式：
function(ret,err){//ret為方法成功執行時的結果//err為方法執行失敗時的結果
}

文件協議

有很多應用都需要讀寫手機的本地文件，這本身可以通過api對象或部分模塊中提供的方法來實現。在讀寫文件時，需要一個文件路徑來指定要讀寫的文件，為了方便表示文件的路徑，ApiCloud封裝了多種文件協議。
注意：文件協議只能在JS方法中使用。如果要在HTML或CSS中使用，也要經過JS中轉一下。

widget://

與項目的根目錄對應，可以在APP運行期間用來在JS里直接獲取開發過程使用的文件。這個是只讀目錄，不能在APP運行期間向內寫入。

fs://

使用fs模塊時常用的讀寫目錄，可用于永久存儲一些文件（如下載功能）。

cache://

應用緩存目錄。

配置存取

當需要存儲的數據比較多時，可以使用文件來存儲。但大多數應用需要的存儲量不是很大（比如用戶對當前應用的主題選擇、不同網絡下的資源獲取、音量、是否允許通知等），此時就可以使用配置存取的api來操作。

prefs相關

由系統底層實現，理論上無容量限制。

//存值，值必須為字符串
api.setPrefs({key:"鍵",value:"值"});
//取值
var 值 = api.getPrefs({key:"鍵",sync:true});
//刪除
api.removePrefs({key:"鍵"});

storage相關

由HTML5新對象localStorage實現，有容量限制。

//存值，如果值為對象，則必須是可以被json序列化的對象
$api.setStorage("鍵",值);
//取值
var 值 = $api.getStorage("鍵");
//刪除
$api.rmStorage("鍵")
//清空
$api.clearStorage()

窗口操作

api.openWin()

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/news/254129.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/254129.shtml
英文地址，請注明出處：http://en.pswp.cn/news/254129.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

halcon對光源打光不均勻進行平場矯正

halcon對光源打光不均勻進行平場矯正

* Image Acquisition 01: Code generated by Image Acquisition 01 *******預處理&#xff0c;生成RGB三通道的平場矯正的圖像 *1.繪制檢測ROI *2.對檢測的ROI進行平場矯正 *3.平場矯正方法采用均值對減方法 read_image (ImageWhite, C:/Users/Administrator/Desktop/平場矯正/…
閱讀更多...
一般面試題

一般面試題

1.瀏覽器訪問一個網頁的整個過程&#xff0c;附帶連接協議&#xff1f; 2.tcp和upd的區別&#xff1f; 3.tcp報頭&#xff1f; 4.網絡協議的7層和5層分別是什么&#xff1f; 5.ipv6的知識&#xff1f; 6.網絡分包&#xff1f; 7.求素數的改進方法&#xff1f;轉載于:https://ww…
閱讀更多...
Python 執行代碼的兩種方式

Python 執行代碼的兩種方式

1、交互執行即黑屏命令行執行 優點:即時調時程序&#xff0c;調試方便 缺點&#xff1a;無法永久無法保存代碼 2、即文件存儲代碼執行Python代碼文件 優點&#xff1a;可以永久保存代碼 缺點&#xff1a;調試不方便轉載于:https://www.cnblogs.com/liuxiaowei/p/7163473.html
閱讀更多...
金屬圓柱求取傾斜角度

金屬圓柱求取傾斜角度

方法1&#xff1a; count_seconds (Seconds1)read_image (Image, 9_7750_f3d301de6764d94.jpg)get_image_size (Image, Width, Height)dev_open_window (0, 0, Width, Height, black, WindowHandle)dev_display (Image)rgb1_to_gray (Image, GrayImage)dev_display (GrayImage)…
閱讀更多...
編程開發之--java多線程學習總結（2）同步代碼塊

編程開發之--java多線程學習總結（2）同步代碼塊

1、第一種解決辦法&#xff1a;同步代碼塊&#xff0c;關鍵字synchronized package com.lfy.ThreadsSynchronize;/*** 1、使用同步代碼塊* 語法&#xff1a;synchronized (同步鎖) {//需要同步操作的代碼 }同步鎖&#xff1a;為了保證每個線程都能正常的執行原子操作&a…
閱讀更多...
swift 隨機數

swift 隨機數

1.一行代碼生成隨機數 arc4random() 如果要生成一個生成在一定范圍內的隨機整數: func randomIn(#min: Int, max: Int) -> Int { return Int(arc4random()) % (max - min 1) min} 該方法會生成[min, max]范圍內的隨機整數轉載于:https://www.cnblogs.com/qiyiyifan/p/…
閱讀更多...
u-boot裁減

u-boot裁減

http://blog.csdn.net/menuconfig/article/details/2276078u-boot裁減的主要方法是通過刪除不需要的命令來減小可執行代碼體積。比如說&#xff0c;如果不需要網絡相關的功能&#xff0c;則可以將網絡相關的所有命令全部刪除&#xff0c;可以節約可觀的flash空間。一般u-boot的…
閱讀更多...
PhpStudy 升級 MySQL 版本到5.7

PhpStudy 升級 MySQL 版本到5.7

1&#xff1a;備份當前數據庫數據、 最好是導成 SQL 文件2&#xff1a;備份 PhpStudy 下的 MySQL 文件夾、以防升級失敗、還可以使用舊版本的數據庫3&#xff1a;下載MySQL5.7、解壓、然后放在 PhpStudy 下的 MySQL 文件夾下地址&#xff1a;https://dev.mysql.com/downloads/f…
閱讀更多...
使用直線標定板進行相機畸變校正，并且進行9點標定（halcon）

使用直線標定板進行相機畸變校正，并且進行9點標定（halcon）

直線標定板圖片&#xff1a; 機械吸頭位置圖片&#xff1a; 處理代碼 read_image (Image, 直線標定板圖片/Left201118140641772.bmp) get_image_size (Image, Width, Height) dev_close_window () dev_open_window_fit_image (Image, 0, 0, -1, -1, WindowHandle) dev_display…
閱讀更多...
github設置添加SSH

github設置添加SSH

很多朋友在用github管理項目的時候&#xff0c;都是直接使用https url克隆到本地&#xff0c;當然也有有些人使用 SSH url 克隆到本地。然而&#xff0c;為什么絕大多數人會使用https url克隆呢&#xff1f; 這是因為&#xff0c;使用https url克隆對初學者來說會比較方便&…
閱讀更多...
linux設置套接字緩沖區的大小

linux設置套接字緩沖區的大小

系統提供的socket緩沖區大小為8K&#xff0c;你可以將之設置為64K&#xff0c;尤其在傳輸實時視頻時。 socket發送數據時候先把數據發送到socket緩沖區中&#xff0c;之后接受函數再從緩沖區中取數據&#xff0c;如果發送端特別快的時候&#xff0c;緩沖區很快就被填滿&#x…
閱讀更多...
【Java MyBatis Generator】使用generator自動生成Dao，Mapping和實體文件

【Java MyBatis Generator】使用generator自動生成Dao，Mapping和實體文件

具體請參照&#xff1a; http://blog.csdn.net/fengshizty/article/details/43086833 按照上面博客地址&#xff0c;下載Generator的依賴包&#xff1a; 如下是我的配置文件&#xff1a; 1 <?xml version"1.0" encoding"UTF-8"?>2 <!DOCTYPE ge…
閱讀更多...
h5移動端設備像素比dpr介紹

h5移動端設備像素比dpr介紹

首先介紹一下概念 devicePixelRatio其實指的是window.devicePixelRatio window.devicePixelRatio是設備上物理像素和設備獨立像素(device-independent pixels (dips))的比例。 公式表示就是&#xff1a;window.devicePixelRatio 物理像素 / dips 好了&#xff0c;到了這里有出…
閱讀更多...
halcon直線標定板對相機標定的效果評估（對比矯正前后、對比標定板矯正效果）

halcon直線標定板對相機標定的效果評估（對比矯正前后、對比標定板矯正效果）

原圖 程序源碼 * gen_caltab (7, 7, 0.0025, 1/2.5, GB025標定板.descr, GB025標定板.ps) * Calibration 01: Code generated by Calibration 01 * CameraParameters : [0.048105,-44.0585,8.31518e-006,8.3e-006,641.37,588.269,1280,1024] * CameraPose : [-0.000849522,-0.…
閱讀更多...
【QQ輸入法】QQ輸入法-剪切板 釋放內存

【QQ輸入法】QQ輸入法-剪切板 釋放內存

發現一個神奇的情況&#xff1a; 清除和關閉的操作&#xff1a; 1. 2.右鍵 3.點擊 4.清空 5.最后需要關閉 QQ輸入法的進程
閱讀更多...
Socket編程原理

Socket編程原理

什么是SocketSocket接口是TCP/IP網絡的API&#xff0c;Socket接口定義了許多函數或例程&#xff0c;程序員可以用它們來開發TCP/IP網絡上的應用程序。要學Internet上的TCP/IP網絡編程&#xff0c;必須理解Socket接口。Socket接口設計者最先是將接口放在Unix操作系統里面的。如果…
閱讀更多...
【XLL 框架庫函數】 TempActiveCell/TempActiveCell12

【XLL 框架庫函數】 TempActiveCell/TempActiveCell12

這兩個函數創建 XLOPER/XLOPER12 &#xff0c;包含了當前激活工作表上的單元格引用。 LPXLOPER TempActiveCell(WORD row, BYTE col); LPXLOPER12 TempActiveCell12(RW row, COL co); 參數 row 引用行號&#xff0c;行號參數是從0開始的&#xff0c;因此 第一行就是0. col 引用…
閱讀更多...
POJ 3264 Balanced Lineup【線段樹區間查詢求最大值和最小值】

POJ 3264 Balanced Lineup【線段樹區間查詢求最大值和最小值】

Balanced Lineup Time Limit: 5000MS Memory Limit: 65536KTotal Submissions: 53703 Accepted: 25237Case Time Limit: 2000MSDescription For the daily milking, Farmer Johns N cows (1 ≤ N ≤ 50,000) always line up in the same order. One day Farmer John decides to…
閱讀更多...
halcon測試一張圖片是否過曝或過暗

halcon測試一張圖片是否過曝或過暗

read_image (Image, 1.bmp) count_obj (Image, Number) if(Number<0)return() endif min_max_gray (Image, Image, 0, Min, Max, Range) if(Min<1)*圖像過暗 endif if(Max>254)*圖像過曝 endif
閱讀更多...
真的要做一輩子的程序員嗎？來自10年程序員的心聲

真的要做一輩子的程序員嗎？來自10年程序員的心聲

經常聽一些同學說&#xff1a;不知道下一份工作該去哪類公司做些什么&#xff0c;我的職場人際一團糟老板不重視我&#xff0c;我現在成長的非常慢所以又想跳槽了&#xff0c;我看不到公司的發展前景好迷茫&#xff0c;其實這一切的困惑都來源于沒有做好職業規劃或者你根本就沒…
閱讀更多...
最新文章

Copyright @ 2022~2023