移动WebUI库(H5框架)有哪些,看这⾥就够了
前⾔
今年上半年,项⽬组在项⽬开发的过程中建⽴了⼀套风格统⼀,组件丰富完善,命名统⼀规范的PC端UI库,适⽤于做⼤型站点,该UI库也是应⽤到了整个平台的项⽬中,在各个项⽬组中进⾏推⼴。因为项⽬的保密性,这⾥不⽅便给出实际项⽬,当然⽬前这套UI库也不是开源的。
下半年开始,我们偏向做移动Web的同学也开始考虑要梳理出这样⼀套适⽤于移动端的UI库,与PC端UI库命名规范保持⼀致,便于项⽬组同学在PC项⽬和移动项⽬中随意切换,当然,移动端的组件和样式以及交互与PC端都是有很⼤差别的,⽐如PC端的下拉菜单,在移动端可能就需要弹出的picker来实现了。鉴于此,我们尽快建⽴移动端UI库是⾮常有必要和有意义的,做之前我⼤量看了下⽬前移动端的UI库,以及H5,⽐较丰富和切实的了解了更多的应⽤场景,本⽂将介绍各个移动端框架,没有技术,只有⼀个列表,勿喷,谢谢!
移动Web UI库列表
1、
Framework7 - is a free and open source mobile HTML framework to develop hybrid mobile apps or we
b apps with iOS & Android native look and feel. It is also an indispensable prototyping apps tool to show working app prototype as soon as possible in case you need to.
2、
MSUI 是阿⾥巴巴共享业务事业部UED团队的作品。⽬的是为了⼿机H5页⾯提供⼀个常⽤的组件库,减少重复⼯作。
SUI Mobile 是⼀套基于 Framework7 开发的UI库。它⾮常轻量、精美,只需要引⼊我们的CDN⽂件就可以使⽤,并且能兼容到 iOS
6.0+ 和 Android 4.0+,⾮常适合开发跨平台Web App。
3、
Frozen UI是⼀个开源的简单易⽤,轻量快捷的移动端UI框架。基于⼿Q样式规范,选取最常⽤的组件,
做成⼿Q公⽤离线包减少请求,升级⽅式友好,⽂档完善,⽬前全⾯应⽤在腾讯⼿Q增值业务中。
4、
中国⾸个开源 HTML5 跨屏前端框架,相⽐国外框架,Amaze UI 关注中⽂排版,根据⽤户代理调整字体,实现更好的中⽂排版效果;兼顾国内主流浏览器及 App 内置浏览器兼容⽀持。
Amaze UI 以移动优先(Mobile first)为理念,从⼩屏逐步扩展到⼤屏,最终实现所有屏幕适配,适应移动互联潮流。
5、
最接近原⽣APP体验的⾼性能前端框架。
6、
WeUI 是⼀套同原⽣视觉体验⼀致的基础样式库,由官⽅设计团队为内⽹页和⼩程序量⾝设计,令⽤户的使⽤感知更加统⼀。
7、
Vux(读⾳ [v’ju:z],同views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于页⾯。
基于webpack+vue-loader+vux可以快速开发移动端页⾯,配合vux-loader⽅便你在WeUI的基础上定制需要的样式。
vux-loader保证了组件按需使⽤,因此不⽤担⼼最终打包了整个vux的组件库代码。
8、
Weex 是⼀套简单易⽤的跨平台开发⽅案,能以 web 的开发体验构建⾼性能、可扩展的 native 应⽤,为了做到这些,Weex 与 Vue 合作,使⽤ Vue 作为上层框架,并遵循 W3C 标准实现了统⼀的 JSEngine 和 DOM API,这样⼀来,你甚⾄可以使⽤其他框架驱动Weex,打造三端⼀致的 native 应⽤。
9、
antd-mobile 是 Ant Design 的移动规范的 React 实现,服务于蚂蚁及⼝碑⽆线业务。
10、
基于 vuejs 1.0 开发 material design 风格的移动端 WEB UI 库, 设计资源参考 CARBON FrameWork7。
11、
uiKit是⼀款轻量级、模块化的前端框架,可快速构建强⼤的web前端界⾯。
12、
H-ui是轻量级前端框架,简单免费,兼容性好,适⽤于中国⽹站。
13、
Layui 诞⽣于2016年⾦秋,是⼀款带着浓烈情怀的国产前端UI框架,她追求极简,⼜不失丰盈的内在,说她是史上最轻量的结晶,似乎并不为过。⼀切都源⾃于她对原⽣态的执着,对前端社区的那些噪杂声⾳的过滤,以及她本⾝的精⼼雕琢。
14、
YDUI Touch 专为移动端打造,在技术实现、交互设计上兼容主流移动设备,保证代码轻、性能⾼;使⽤ Flex 技术,灵活⾃如地对齐、收缩、扩展元素,轻松搞定移动页⾯布局;实现强⼤的屏幕适配布局,等⽐例适配所有屏幕。什么?⽤得不开⼼?轻松切换 px;⾃定义Javascript组件、Less⽂件、Less变量,定制⼀份属于⾃⼰的YDUI。
15、
reactnativeui框架基于sandal(基础sass库)扩展的移动端UI库。具体设计思想可参看sheral——⼀个⽅便定制及扩展的UI组件库
16、
⼀个基于 vue.js 和 ionic 样式的 UI 框架,⽤于快速构建移动端单页应⽤。
17、
基于 Vue.js 的移动端组件库
Mint UI 包含丰富的 CSS 和 JS 组件,能够满⾜⽇常的移动端开发需要。通过它,可以快速构建出风格统⼀的页⾯,提升开发效率。
真正意义上的按需加载组件。可以只加载声明过的组件及其样式⽂件,⽆需再纠结⽂件体积过⼤。
考虑到移动端的性能门槛,Mint UI 采⽤ CSS3 处理各种动效,避免浏览器进⾏不必要的重绘和重排,从⽽使⽤户获得流畅顺滑的体验。 依托 Vue.js ⾼效的组件化⽅案,Mint UI 做到了轻量化。即使全部引⼊,压缩后的⽂件体积也仅有 ~30kb (JS + CSS) gzip。
18、
基于 Vue 2.0 和 Material Desigin 的 UI 组件库
1.组件丰富
Muse UI 基本实现了 Material Design 设计规范类的所有组件,另外还开发许多的功能性的组件
2.可定制
Muse UI 使⽤less⽂件,所有的颜⾊都有⼀个变量维护,通过编写 less ⽂件完成⾃定义主题,另外组件内部也提供⼀些修改效果的参数 3.基于 Vue 2.0
Muse UI 基于 Vue2.0 开发,Vue2.0是当下最快的前端框架之⼀,⼩巧,api友好,可⽤于开发的复杂单页应⽤。
20、
QMUI Web 是⼀个专注 Web UI 开发,帮助开发者快速实现特定的⼀整套设计的框架。
框架主要由⼀个强⼤的 Sass ⽅法合集与内置的⼯作流构成。通过 QMUI Web,开发者可以很轻松地提⾼ Web UI 开发的效率,同时保持了项⽬的⾼可维护性与稳健。
该框架同步有针对Android和IOS风格的移动UI框架。
后⾯有优秀的专注于移动端开发的UI库⼤家可以⼀起来补充啊!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论