小米快應用中心具備傳統APP完整的應用體驗，無需安裝、即點即用，快應用中心集合所有快應用，便于節省手機的實用空間性，非常的便捷簡單。

小米快應用中心介紹

快應用是基于手機硬件平臺的新型應用形態，它根植于rom級別，具備傳統app完整的應用體驗。第三方應用基于這種形態可以更為直接的觸達用戶，為用戶帶來高效愉快的體驗�？鞈�用是基于手機硬件平臺的新型應用形態，它根植于rom級別，具備傳統app完整的應用體驗。第三方應用基于這種形態可以更為直接的觸達用戶，為用戶帶來高效愉快的體驗。

小米快應用中心特色

1、免安裝應用設計，不需要安裝占用你的手機內存，在線即可操作。

2、多樣化的應用分類方式，可以按照自己的需求進行分類管理。

3、只需安裝一次即可支持所有快應用，操作上面更加的具有可擴展性。

4、添加到桌面的app，隨時可以進行搜索尋找，方便管理使用記錄。

小米快應用中心說明

1.快應用是基于手機硬件平臺的新型應用形態，標準是由主流手機廠商組成的快應用聯盟聯合制定。

2.快應用標準的誕生將在研發接口、能力接入、開發者服務等層面建設標準平臺，以平臺化的生態模式對個人開發者和企業的開發者全品類開放。

3.快應用具備傳統APP完整的應用體驗，無需安裝、即點即用。

快應用有什么用？

在公眾號「小米開放平臺」當天的推送文章中，我們可以看到這樣的段落：

快應用使用前端技術棧開發，原生渲染，同時具備HTML5頁面和原生應用的雙重優點。用戶無需下載安裝，即點即用，享受原生應用的性能體驗。

這個說法是不是似曾相識?沒錯，這些都是微信小程序的賣點：同樣使用前端技術棧，同樣具備HTML5與Native App的雙重優勢，用戶使用微信小程序和快應用，也皆可以「即點即用」。

回過頭看看同樣擁有這些賣點的支付寶小程序吧。對比微信與支付寶兩個小程序平臺的開發文檔，除了一些特定接口因業務需要而有所差異之外，二者的接口、組件相似度極高;實際上手中，開發者也完全可以做到將小程序幾乎零成本地從微信移植到支付寶。

因此，快應用極有可能與支付寶一樣，使用與微信小程序看齊的開發標準，盡最大可能，降低開發者的開發門檻，進一步吸引更多小程序，特別是微信小程序，移植到快應用平臺。

如何學透快應用界面開發？

一、入門式

從官網的介紹可以知道，快應用是以前端技術棧作為開發基礎，渲染是Native來渲染的。

從這句話中我們可以明確兩個點：

1. 快應用不是Html5

2. 可以用前端經驗去開發

如果你有過前端的開發經驗，來做快應用，會很快，當然如果你有開發經驗，做快應用，也很快，快應用的入門門檻不高。

如果你是一個前端小白，也可以通過看官網來入門的，官網地址在 https://doc.quickapp.cn/

這里我來簡單說一下入手開發快應用的步驟

1. 對著文檔安裝好環境，熟悉hap-toolkit的使用

2. 對著文檔看下我們提供的教程部分

3. 看看官網提供的sample 的例子

二、進入正題

本文主要講解快應用的界面布局

界面布局其實就是兩大塊：

1. 樣式：修飾頁面

2. 結構（骨架）

三、樣式部分

快應用的樣式部分和Html5相比，進行了一些縮減，但是也增加了一些特有的。

1.盒模型

框架使用border-box模型，暫不支持content-box模型與box-sizing屬性。

因此，高度height和寬度width 都包括padding和border

2.長度單位

快應用僅僅支持px和% 兩種單位，和web不一樣，px是參考項目基準寬度，在manifest的config.designWidth 可以動態配置，默認寬度是750.

所以這里我們會有一個設計稿寬度和框架樣式的一個轉換關系。

設計稿1px / 設計稿基準寬度 = 框架樣式1px / 項目配置基準寬度

一般我們推薦設計稿的寬度為750，那么開發者，可以按照設計稿中的像素進行開發。

3.選擇器

目前支持的僅有5種：id，class，tag，并列，后代。

舉例說明一下：

在快應用里面用這些基本的選擇器就可以了，CSS3里面一些比較新的選擇器目前暫不支持。

強調一句，如果使用后代選擇器，不要嵌套層級太多了。

再舉一個例子

比如我們在開發中經常碰到  “文本不能超過2行，超過2行，用省略號表示” 這樣的需求。

在快應用中是用lines 屬性，在html5里面 這個是-webkit-line-clamp 這個屬性（僅webkit支持的，未列入草案）

因此，習慣了之前前端開發的同學，這種布局方式，不要在快應用中使用了。

四、結構部分

這部分需要明確兩個東西：用什么布局、怎么布局。

1）用什么布局？ 

用組件（標簽）進行布局，快應用提供了一些組件，供開發者使用。

組件（標簽）分為幾大類：

1. 容器組件

2. 基礎組件

3. 表單組件

4. 媒體組件

5. 畫布組件

6. 其他組件

7. 第三方組件

需要說明一點的是，這里的標簽寫法和html5 寫法類似，但是他們兩者沒有任何關系，含義也不一樣【至于什么是一樣，讀者可以自己琢磨】。

這里我大致總結了下標簽與html5中不一致的部分，方便開發者進行開發。

1. 顯示文本放置于text組件, 不能放置于div組件

2. 基礎組件中：a, text 組件支持內部嵌套 組件，其他不支持

3. a的子組件：span

4. text的子組件：a 和span

如果想查閱組件可以參考 https://doc.quickapp.cn

這塊相對來說，比html5縮水了不少。同時也說明，快應用入門門檻不高，非常適合開發，省時省力。

2）怎么布局？

前面提到過，快應用不支持浮動float，絕對定位absolute，相對定位relative，所以不要嘗試在快應用采用這種布局方式。

快應用默認采用的是彈性盒（flex）布局方式。

但是快應用的flex布局和html5 布局也有一些不同，這里要知道一些不同的地方。

flex布局這塊，主要弄清楚2個核心概念：主軸和交叉軸；容器和項目

1）主軸和交叉軸

這里的是一致的，主軸和交叉軸可以根據設置，可以交換的。

2）容器和項目

快應用的組件中，有容器這個組件分類，但是僅僅支持三個標簽（div，list-item，tabs）。

換一句話說，就是僅僅在這些元素上才支持flex布局，其他的元素上是不支持的。因此不要在其他元素上，比如a標簽上寫display：flex，這些代碼也是不生效的。但是在html5里面這是可以的。

項目就是容器內的子組件了。當然也支持嵌套使用。