概 述 JRedu 在上一篇博客中,我们学习了如何使用Hbuilder创建一个APP,同时如何使用MUI搭建属于自己的第一款APP,没有学习的同学可以戳链接学习: http://www.cnblogs.com/jerehedu/p/7832808.html 今天这篇博客,我们继续深入学习MUI框架,主要学习这几个方面:加载子页面.页面跳转并传值,底部选项卡的多种实现方式. 一.MUI加载子页面 1加载子页面详解 在mobile app开发过程中,经常遇到卡头卡尾的页面,也就是说头部和尾部保持…
  前  言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用HTML5开发手机APP,而随着手机硬件设备配置的不断提升,各种开发框架的不断优化,也使着H5开发的混合APP的体验越来越趋于原生!那么在本系列博客中,我们就来一探H5开发APP的神秘面纱吧~~ 一. 移动APP项目搭建 由于我们的H5编写的都是一个个网页,需要使用浏览器打开才能使用,这显然不是APP的使用方式. 那么我们才能将一个手机网站,封装成一个APP呢? 时下热门的Cordova.Phon…
出处:http://www.cnblogs.com/jerehedu/p/7832808.html  前  言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用HTML5开发手机APP,而随着手机硬件设备配置的不断提升,各种开发框架的不断优化,也使着H5开发的混合APP的体验越来越趋于原生!那么在本系列博客中,我们就来一探H5开发APP的神秘面纱吧~~ 一. 移动APP项目搭建 由于我们的H5编写的都是一个个网页,需要使用浏览器打开才能使用,这显然不是APP…
出处:http://www.cnblogs.com/jerehedu/p/7832808.html  前  言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用HTML5开发手机APP,而随着手机硬件设备配置的不断提升,各种开发框架的不断优化,也使着H5开发的混合APP的体验越来越趋于原生!那么在本系列博客中,我们就来一探H5开发APP的神秘面纱吧~~ 一. 移动APP项目搭建 由于我们的H5编写的都是一个个网页,需要使用浏览器打开才能使用,这显然不是APP…
微软的toolkit团队为我们为我们提供了这样一套组件,叫做TransitionServices服务. 简单说一下它具备的效果: turnstile(轴旋转效果): turnstile feather(羽毛式轴旋转效果): continuum(继承动画效果): slide(滑动效果): rotate(旋转效果). 这里我们实现一下Turnstile效果: 一.首先,我们要下载Silverlight for Windows Phone Toolkit (没有Windows phone Toolki…
1.页面跳转 import { NavController } from 'ionic-angular'; constructor(public navCtrl: NavController) { } goNews(){ this.navCtrl.push(NewsPage); } 2.tabs页面 1)添加tabs页面的菜单项目 创建页面就不说了,直接添加tabs项目 其实就是直接对着写就行 2)去掉二级页面 tabs 菜单,修改返回按钮文字 找到app.moudule.ts 修改下面代码 i…
经过一段时间的学习,做公司项目,对mui框架有了更加深入完整的了解,其实刚开始接触HBuilder中的mui框架只是简单的了解,并没有深入的研究,后来由于工作的需求,不得不深入研究,并运用的项目中去. mui框架采用html5来开发手机app,包括Android跟ISO,真正做到一套代码能在Android跟ISO上很好的运行,一般用html5开发网页,页面跳转采用a连接,这样会导致页面切换时出现白屏,并且页面跳转时会出现动画效果,如果作为pc端还可以,但用来开发手机app的话,效果肯定惨不忍睹,…
HTML5手机APP开发入(5) 回顾一下 HTML5手机APP开发入(4) 如何自定义Component,directive HTML5手机APP开发入(3) 如何实现MVC的代码重构,自定义一个Provider Service,Injectable 依赖注入 HTML5手机APP开发入门(2) 利用ionic2 向导生成一个项目并开发一个简单的通讯录的APP HTML5手机APP开发入门(1) ionic2+angular2 开发环境的配置 内容 完成一个登录验证的功能 这里我要向大家介绍一…
HTML5手机APP开发入(4) 课程内容 完成一个自定义的Component用来展现通讯录用户的明细信息如下图 http://bootsnipp.com/snippets/featured/profile-card 涉及的知识点: Component的定义,输入/输出 步骤 新建一个Component文件定义contactinfo.html HTML 代码从http://bootsnipp.com/snippets/featured/profile-card 复制过来 新建一个contacti…
HTML5手机APP开发入(3) 课程内容: 按照AngularJs MVC框架进行代码重构,新建一个DataService服务类使用SQLite插件实现储存对通讯录的本地存储. 涉及的知识点: Angular2 Injectable的使用熟成的模块依赖注入 引用类库 引用SQLite插件和 Storage,SqlStorage模块 重构代码 新建一个Model 新建一个modules目录,新建一个contact.ts,定义一下字段的类型 新建一个dataService 引用类或plugin p…