您当前的位置:首页 > 职场资讯 > IT员分享

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

来源:今日职场 时间:2017-09-23 作者:IT痕迹 浏览量:

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

 

Ionic是开源的移动应用开发框架,便于构建高质量的本地和网络技术先进的web应用程序。Ionic是基于Angular,有许多显著的性能提升,可用性和功能都在不断的进行改进。只需要会一点前端知识就能玩转Ionic。

Ionic的应用程序创建开发主要通过Ionic命令行实用工具(“CLI—命令行界面”),并使用cordova构建和部署本地应用。建立Ionic项目,您需要安装最新版本的CLI和cordova。在你这样做之前,你需要一个node.js的最新版本。这些在我之前的文章有安装教程。

  • 官网地址:

    http://ionicframework.com/

  • 版本更新说明:

    https://github.com/ionic-team/ionic/blob/master/CHANGELOG.md

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

学习ionic需要了解的知识:

  • HTML5

  • CSS3

  • TypeScript(JavaScript)

  • Angular2+

下面是一些组件的示例,不同系统有不同的样式,下面展示iOS上的。

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

动作表单-Action Sheets

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

时间选择器-DateTime

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

浮动的按钮-Floating Action Buttons

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

分割按钮-Segment

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

Inputs-输入框

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

表格布局-Grid

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

小芯片-Chip

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

弹窗对话框1-Alert

HTML5 APP开发:接近原生性能的HTML5移动应用开发框架(Ionic)

弹窗对话框2-Popover

想要查看更多的ionic组件示例,可以在App Store和Google Play下载Ionic2Components应用,该APP即为官方所有组件的展示。

  • 组件在线演示地址:

    http://ionicframework.com/docs/api/

组件只能作用在用户与界面交互上,想要调用原生设备功能就需要cordova,他提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头、麦克风、GPS等。在应用商店下载Ionic Native即可体验部分插件。

分享到:
官方微信

Copyright C 2018 All Rights Reserved 版权所有 今日职场人力资源服务 苏ICP备12049413号-3

地址:中国山东菏 鄄城县沭阳县软件园B栋10楼 电话(Tel):400-8005-185 EMAIL:305146227@qq.com

Powered By PHPYun.

用微信扫一扫