很多移动开发者喜欢使用原生代码开发,但这种方式并不是一个银弹,在需要快速以及低成本开发的时候Hybrid App(混合应用)就体现了它的优势。

HTML5 移动UI框架(例如Ionic)让你创建垮平台Hybrid App与NativeAPP相似的效果,而使用的则是
HTM5, CSS and JavaScript。如果你已经是一个web开发者了那么选择hybird将是一个较好的开发方式。而且只需要编写一套代码就可以在多个平台中使用。通过Cordova(PhoneGap)提供的javascriptAPI可以访问到照相机或传感器这类硬件设备。最后再编译成原生安装包发到各应用商店。

目前市面上有需要移动端的UI框架可供选择,接下来将介绍几款其中的佼佼者。

Ionic

在近几年,ionic成为了Hybrid App开发框架中的领军者,并且ionic的开发小组继续更新,并保持领先优势。ionic一直保持免费和开源,而且它还拥有庞大的生态系统,可以在社区中找到大量的资源。

ionic添加了对android材料设计的支持,同时ionic也包括了angular。像其他流行的Hybrid App框架一样,ionic也可以利用cordova来实现对原生硬件的调用。

ionic框架具有可维护性和可扩展性,使用了简单清晰的标记,大量移动端特殊优化的css(Sass),HTML5 and JavaScript 组件。

优点:

  • 基于Angularjs
  • 预置的类原生组件
  • 强大的社区

** 缺点:**

  • 需要了解Angularjs
  • 插件更新较慢
  • 动画性能较弱

官方网站

Onsen UI

Onsen UI是相对较新的框架,但是却给Ionic带来了冲击。Onsen采用Apache license开源协。Onsen UI 有通过angular的指令实现了大量的组件也提供基于jQuery的组件 。两个框架很类似但是还是存在一些不同:

与 ionic 相比

  • 两个框架都依赖与angular指令,但Onsen UI支持jQuery。
  • 两个框架都支持Android 4+, iOS 6+,Onsen UI 支持Firefox OS和桌面浏览器。但ionic没有官方的桌面浏览器支持,但还是可以用。
  • 都支持分屏显示技术
  • 都是扁平是风格,但个人觉得Ionic更好看点。
  • ionic支持SASS而Onsen UI 则是基于 Topcoat Css library。
  • Onsen UI 文档较好,但ionic的社区较活跃。
  • Onsen UI 有一个自己的IDE called Monaca IDE.

官方网站

jQuery Mobile

jQuery 依然在游戏领域与其他移动端框架抗衡。jQuery Mobile 建立在jQuery和jQueryUI的基础上。允许开发者创建webapp获得与平板、pc上无差别的用户体验。因此它无法提供类似移动端原生控件外观和体验的app.

官方网站

Mobile Angular UI

这是为bootstrap和angular的粉丝而准备的。 通过 Mobile Angular UI ,可以通过bootstrap3和Angular 构建 移动应用。

Mobile Angular UI 提供指令可以构建移动端UI Component 例如 overlays, switches.sidebars,scrollable .

官方网站

结论

目前市面上最常用的几款开源的移动端框架,总体上来均不错,但如果是要追求最终app的视觉效果则Ionic与Onsen是较好的选择,它们的UI看上去更像原生控件。如果你是jquery的粉丝,并且不想尝试使用其他的那么可以选择jQuery Mobile 简单高效。
如果你熟悉angular与bootstarp那么Mobile Angular UI则是不错的选择。

除了开源的框架外还有一些企业级框架这些框架功能强大但需要相应的费用,比如Sencha Touch 与 Kendo UI 。


参考链接

[01] http://noeticforce.com/best-hybrid-mobile-app-ui-frameworks-html5-js-css

几款开源的hybird移动app框架分析的更多相关文章

  1. 推荐一款开源的C#TCP通讯框架

    原来收费的TCP通讯框架开源了,这是一款国外的开源TCP通信框架,使用了一段时间,感觉不错,介绍给大家 框架名称是networkcomms 作者开发了5年多,目前已经停止开发,对于中小型的应用场景,够 ...

  2. metasploit 一款开源的渗透测试框架

    渗透神器漏洞利用框架metasploit from: https://zhuanlan.zhihu.com/p/30743401 metasploit是一款开源的渗透测试框架软件也是一个逐步发展与成熟 ...

  3. 越折腾越好用的 3 款开源 APP

    高中的时候我特别喜欢捣鼓手机,然后我一个哥们儿在我的强烈推荐下买了个 HTC Dream(G1) 手机. G1 作为谷歌的第一个亲儿子,它出厂搭载的是 Android 1.5 系统,但当时已经出到了 ...

  4. 移动app框架inoic功能研究

    原生移动app框架inoic功能研究 本篇只侧重框架提供的功能和能力的研究,请关注后续实际部署使用体验. 一.inoic是什么? inoic是一个可以使用Web技术以hybird方式开发移动app的前 ...

  5. (转)12款开源JavaScript库

    JavaScipt几乎是所有前端开发人员必会的编程语言,并且,随着各种移动APP的串红,JavaScript还可以用来开发移动应用.除此以外,为了丰富前端/移动开发,有不少开发者推出了各种基于Java ...

  6. 开源巨献:Google最热门60款开源项目

    文章整理于互联网.本文收集了 60款 Google 开源的项目,排名顺序按照 Github ★Star 数量排列. 0.机器学习系统 TensorFlow  ★Star 62533 TensorFlo ...

  7. [转]Web App 框架选择之百度&腾讯

    百度的GMU GMU(Global Mobile UI)是百度前端通用组开发的移动端组件库,GMU是基于zepto的mobile UI组件库,提供webapp.pad端简单易用的UI组件.具有代码体积 ...

  8. 如果你不知道这11款常见的Web应用程序框架 就说明你out了

    本文推荐了11款常见的Web应用程序框架,并列出了相关的学习资料和下载文档.如果对这些项目还不熟悉,就赶紧学起来吧~ Rails Rails是Ruby on Rails的简称,是一款开源的Web应用框 ...

  9. 一款开源免费的.NET文档操作组件DocX(.NET组件介绍之一)

    在目前的软件项目中,都会较多的使用到对文档的操作,用于记录和统计相关业务信息.由于系统自身提供了对文档的相关操作,所以在一定程度上极大的简化了软件使用者的工作量. 在.NET项目中如果用户提出了相关文 ...

随机推荐

  1. Linux中grep搜索用法

    有测试文件test.txt一枚,内容如下 aaabbbcccAAADDDEEEabcsdfjasldjfbcdokmABC 一.基本搜索常用1.现在想把abc okm筛选出来 grep "a ...

  2. TypeLoadException: 找不到 Windows 运行时类型“Windows.UI.Xaml.Controls.Binding

    奇怪的问题,我以为是我不小心添加了什么标签导致的,后来发现...坑爹,把项目名字改一下,然后移除掉,接着再加载一下就可以了.......崩溃了,,,,事实证明==>这个时候再把名字改回去也是不报 ...

  3. 【Win10 应用开发】集成语音命令

    记得老周以前在写WP8应用开发的文章时,曾经写过语音命令集成的文章,后来8.1的时候“小娜”问世,但考虑到其变化不大,故老周没有补写相应的文章. 今天,老周打算补一下Win 10通用应用开发中,有关语 ...

  4. OpenCascade Chinese Text Rendering

    OpenCascade Chinese Text Rendering eryar@163.com Abstract. OpenCascade uses advanced text rendering ...

  5. samba服务器安装,共享nginx目录

    Samba是一个能让Linux系统应用Microsoft网络通讯协议的软件,类似于win的网上邻居,让windows和linux实现文件共享 1.安装smaba服务 yum install samba ...

  6. WCF 实体更改发布后,如何不影响调用方?

    应用场景:使用 WCF 有一个坏处,就是如果我们经常对 WCF 应用程序更新,有时候调用方也要进行 Update Service,但调用方往往会很多,那么这个工作就会很讨厌,比如 WCF Servic ...

  7. ZOJ Problem Set - 1115 Digital Roots

    水题记录: 注:此题题目并没有限定数值的大小,所以要用字符串进行处理 #include <stdio.h> #include <string.h> int main() { ] ...

  8. RMAN Catalog创建、配置和管理

    环境:RHEL6.4 + Oracle 11.2.0.4 一.创建数据库catdb 1.1 官档的建库脚本示例 1.2 根据我实际环境修改如下项 1.3 创建必要目录并赋予权限 1.4 执行脚本建库 ...

  9. [linux]挂载smb

    什么是 smb 服务器消息区块(英语:Server Message Block,缩写为SMB,服务器消息区块),又称网络文件共享系统(英语:Common Internet File System,缩写 ...

  10. CSS魔法堂:"那不是bug,是你不懂我!" by inline-block

    前言  每当来个需要既要水平排版又要设置固定高宽时,我就会想起display:inline-block,还有为了支持IE5.5/6/7的hack*display:inline;*zoom:1;.然后发 ...