很多移动开发者喜欢使用原生代码开发,但这种方式并不是一个银弹,在需要快速以及低成本开发的时候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. Java 网络爬虫获取页面源代码

    原博文:http://www.cnblogs.com/xudong-bupt/archive/2013/03/20/2971893.html 1.网络爬虫是一个自动提取网页的程序,它为搜索引擎从万维网 ...

  2. jquery中on/delegate的原理

    jquery中on/delegate的原理 早期版本中叫delegate, 后来有过live函数,再后来统一用on.下面的方法等效: // jQuery 1.3 $(selector).(events ...

  3. Mesh Algorithm in OpenCascade

    Mesh Algorithm in OpenCascade eryar@163.com Abstract. Rendering a generic surface is a two steps pro ...

  4. Java设计模式之工厂模式(Factory)

    前言: 前面学习了建造者设计模式,接下来学习一下Retrofit中使用的另外一个设计模式,工厂设计模式!!!里面采用工厂模式使得数据转换得到完全解耦,工厂模式的好处用到了极致,如此好的设计模式我们怎能 ...

  5. mac下无法识别手机usb问题

    一.无论是mac还是windows下连接手机调试android程序,一定要确认手机开启了usb调试.如果没有开启请参考我的步骤.      设置->关于手机->版本号    连续点击版本号 ...

  6. Android仿qq聊天记录长按删除功能效果

    最近项目在做IM即时通讯开发,在删除聊天列表的时候跟删除聊天详细信息的时候,产品经理想要跟ios一样,在当前选中行上方弹出一个删除窗口.于是先从网上找demo,找了一个发现是Dialog做的,我感觉没 ...

  7. 如何高效地向Redis插入大量的数据

    最近有个哥们在群里问,有一个日志,里面存的是IP地址(一行一个),如何将这些IP快速导入到Redis中. 我刚开始的建议是Shell+redis客户端. 今天,查看Redis官档,发现文档的首页部分( ...

  8. Golang类型转换

    类型转换 1.int转string strconv.Itoa(i) 2.string转int i, err = strconv.Atoi(s) 或者 i, err = ParseInt(s, 10, ...

  9. Hive创建表格报【Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. MetaException】引发的血案

    在成功启动Hive之后感慨这次终于没有出现Bug了,满怀信心地打了长长的创建表格的命令,结果现实再一次给了我一棒,报了以下的错误Error, return code 1 from org.apache ...

  10. spring笔记--依赖注入之针对不同类型变量的几种注入方式

    控制反转和依赖注入讲的都是一个概念,只不过是站在了不同的角度,所谓的依赖注入: 是指在运行期,由外部容器动态地将依赖对象注入到组件中.当spring容器启动后,spring容器初始化,创建并管理bea ...