流行的移動端UI框架

微信公衆號 幾種移動端UI框架介紹
微信公衆號開發,主要是移動端網頁的頁面開發,在這裏推薦3個移動端UI框架:WeUI、SUI和Mint UI。html

1. WeUI
1.1 WeUI
WeUI是微信官方設計團隊爲微信 Web 開發量身設計,能夠令用戶在HTML5應用中的使用感知更加統一。前端

組件包含button、cell、dialog、 progress, toast、article、icon等等。jquery

資源
官方Demo:https://weui.io/前端框架

Github:https://Github.com/weui/weui (★13402)微信

js支撐:weui.js框架

缺點:缺乏高級組件;截至目前,WeUI還未提供swiper、上拉加載、下拉刷新組件。網站

示例
   ui

 

1.2 weui.js
爲WeUI的的輕量級 js 封裝。提供了Alert、Confirm、Toast、Loading、ActionSheet等等交互功能。設計

資源
官網Demo:https://weui.io/weui.js/htm

Github:https://Github.com/weui/weui.js/

示例
  

 

2. SUI
SUI Mobile 是阿里巴巴共享業務事業部SDC團隊(UED)提供的一套手機UI庫。

是一套基於 Framework7 很是適合開發跨平臺Web App的UI庫。

組件包含下拉刷新、上拉加載、日曆、省市選擇器、幻燈片、路由等等。

資源
官網:http://m.sui.taobao.org/

官方Demo:http://m.sui.taobao.org/demos/

Github:https://Github.com/sdc-alibaba/SUI-Mobile (★4437)

js支撐:Zepto.js;SUI須要Zepto.js的支撐。

注意:此UI框架最後有效提交日期爲2016/04/27,根據自身業務需求是否使用此框架。

示例


 

3. Mint UI
Mint UI是餓了麼推出的一款基於Vue的移動端UI框架。

資源
文檔:http://mint-ui.Github.io/docs/#!/zh-cn2

官方Demo:http://elemefe.Github.io/mint-ui/#/

Github:https://Github.com/ElemeFE/mint-ui/

js支撐:Vue.js;Mint UI分別提供了支持Vue1和Vue2的版本。

示例

 

 

四、jquery weui

jQuery WeUI 是專爲微信公衆帳號開發而設計的一個簡潔而強大的UI庫,包含所有WeUI官方的CSS組件,而且額外提供了大量的拓展組件,豐富的組件庫能夠極大減小前端開發時間。

jQuery WeUI 的最大特色是它只提供UI組件,並不會對項目所使用的框架和其餘庫有任何的限制,幾乎能夠在任何環境下使用。不管你的項目是基於jQuery,仍是 React, Angular, Vue, 你都會發現 jQuery WeUI 能很是方便的和他們結合使用。既是你的項目是一個有很悠久歷史的老項目,也幾乎能夠作到拿來即用。

jQuery WeUI 提供了總共30+ 個很是實用的組件:列表,表單,卡片,對話框,下拉刷新等。

官方網站:http://www.jqweui.cn/

 

五、mui

mui是dcould公司出品的前端框架,號稱最接近原生App體驗的前端框架

官方網站:https://www.dcloud.io/mui.html

相關文章
相關標籤/搜索