基于HBuilderX创建移动app项目并利用mui实现简单页面跳转

刚开始学,听老师讲了一些介绍,要求我们做一个页面跳转,当时内心真的是万马奔腾,他的是使用什么icon的来实现的,但是我没看不懂怎么实现页面跳转的,就使用了mui来做了。百度了很多内容,杂七杂八的,所以自己总结了一下。
这是我项目的下载链接https://github.com/laowuniubi/androidApp.git
使用mui创建的页面跳转,浏览器是不能实现的。所以大家要下载模拟器或者虚拟机Android SDK(因为我刚好用Android studio,所以用虚拟机)
在HBuilderX的工具插件安装中下好插件,如下
在这里插入图片描述在这里插入图片描述
在下好了虚拟机后,先打开虚拟机,不能会有提示让你手动调试,打开后在运行界面选择手机或模拟器运行
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第1张图片
他会自动检查你当前是否有虚拟机运行,有的话显示你的虚拟机,我这里已经连上了。
在这里插入图片描述
先利用HBuilderX创建一个基于mui的5+App的项目
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第2张图片
新建一个目录page,存储HTML代码,格局如下所示:
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第3张图片
效果图如下:
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第4张图片
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第5张图片
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第6张图片
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第7张图片
基于HBuilderX创建移动app项目并利用mui实现简单页面跳转_第8张图片
接下来写代码了:
刚试过代码上传总卡死,那就大家去GitHub下载我的代码吧。

你可能感兴趣的:(基于HBuilderX创建移动app项目并利用mui实现简单页面跳转)