ionic 入门:DEMO学习


最近对一个框架比较感兴趣,它的名字叫——ionic! 它可以用H5做native app的hybrid开发,最主要的,它采用了angularjs作为其framework的框架,并且已经封装好了许多的UI组件,我觉得即使我不用来开发native app,只是用它来做web app的应用,应该也蛮合适的。

这个框架目前还算是比较新,现在的版本是__v1.0.0-rc.2__,并且有个奇怪的代号叫“palladium-platypus”,钯-鸭嘴兽?啥意思?

ionic官方在CodePan上做了一些demo,我们可以看着代码来学习一下该框架的运用。

动态 Loading 图,采用 svg 绘制

起航!一个空白页面,只包含一个 header-bar 组件

滑动侧边栏组件

标签与导航组件,会根据访问历史用动态方式切换不同视图

List组件,支持批量处理、拖曳重排、滑动操作等等

看看 ionic 中的 form 组件如何写

列表下拉刷新实现

actionsheet 组件

Accordion 组件

模式对话框


好吧,这个常用的UI组件大概就这些,都是通过angularjs的自定义指令方式封装好了。更多的 demo 就去 CodePen 瞅瞅吧。


文章版权本站所有,您可以转载,但请注明出处,谢谢!