第20章移动应用开发实战ppt课件全

上传人:cn****1 文档编号:587408007 上传时间:2024-09-05 格式:PPT 页数:7 大小:10.99MB
返回 下载 相关 举报
第20章移动应用开发实战ppt课件全_第1页
第1页 / 共7页
第20章移动应用开发实战ppt课件全_第2页
第2页 / 共7页
第20章移动应用开发实战ppt课件全_第3页
第3页 / 共7页
第20章移动应用开发实战ppt课件全_第4页
第4页 / 共7页
第20章移动应用开发实战ppt课件全_第5页
第5页 / 共7页
点击查看更多>>
资源描述

《第20章移动应用开发实战ppt课件全》由会员分享,可在线阅读,更多相关《第20章移动应用开发实战ppt课件全(7页珍藏版)》请在金锄头文库上搜索。

1、APP软件启动时,在正式进入APP软件界面之前,会首先通过几个引导面向用户介绍该款APP软件的主要功能与特色,第一印象的好坏会极大地影响到后续的产品使用体验。功能分析功能分析制作制作步骤步骤在本案例的制作过程中,每个引导页面都是一个不同的图片,通过创建jQuery Mobile页面,并且在页面的内容区域中顺序插入4张不同的图片,通过CSS样式控制4张图片的显示效果,最后通过添加相应的JavaScript脚本代码来实现在各APP引导页之间的滑动效果。实战练习实战练习移动移动APP引导页引导页 最终文件:光盘最终文件第20章20-1.html视频:光盘视频第20章20-1.swf 20.2移移动应

2、用首用首页移动应用与网站相似,由多个不同功能的页面构成,其中最重要的就是移动应用的首页面,在该页面中通常会安排导航元素,使用户能够快速进入自己感觉兴趣的内容中,并且为了方案方户的操作,需要能够实现流畅的操作体验。功能分析功能分析制作背景图轮换制作背景图轮换背景图片轮换效果与上一节中讲解的APP引导页使用了不同的制作方法,在页面中使用项目列表的方式来放置各背景图片,通过CSS样式来控制背景图片的显示效果,最后添加相应的JavaScript脚本代码实现背景图片的滑动轮换效果。实战练习实战练习制作背景图制作背景图轮换轮换 最终文件:光盘最终文件第20章20-2.html视频:光盘视频第20章20-2

3、-2.swf 制作可滑动的底部导航栏制作可滑动的底部导航栏在页面底部放置导航菜单,每个导航菜单项都采用图标与文字相结合的方式,便于用户的理解和操作。导航菜单分为两个大部分,分别放置在标签中,这样可以通过与背景图片滑动切换相同的方式来实现导航菜单的滑动切换效果。实战练习实战练习制作可滑动的底部导航栏制作可滑动的底部导航栏 最终文件:光盘最终文件第20章20-2.html视频:光盘视频第20章20-2-3.swf 20.3订餐餐APP随着移动互联网的不断发展,人们上网的习惯也在悄然发生变化,由原来的PC端桌面浏览器逐步向移动终端设备过渡,而开发基于移动终端设备的应用系统已成为各互联网企业的共识。本

4、节将使用jQuery Mobile框架,开发一从此移动终端订餐APP。系统分析系统分析制作启动页面制作启动页面通常在启动APP时都会显示一个启动页面,该启动页面可以放置宣传广告、推广活动等信息内容,经过一定时间后自动跳转到APP首页面中,从而起到有效的宣传推广作用。实战练习实战练习制作启动页面制作启动页面 最终文件:光盘最终文件第20章20-3loading.html视频:光盘视频第20章20-3-2.swf 制作订餐制作订餐APP首页面首页面APP启动页面显示5秒钟后自动跳转到APP首页面,在该页面中将通过项目列表的方式来展示不同类型风味的食品,单击相应的食品类型可以进入选择区域的界面中。实

5、战练习实战练习制作订餐制作订餐APP首页首页面面制作订餐城市页面制作订餐城市页面在首页面中选择需要的食品类型即可进入选择订餐城市页面,在该页面中同样使用项目列表的形式表现订餐城市名称,不同的是在该页面中加入了列表过滤功能,可以使用户快速找到需要订餐的城市。实战练习实战练习制作订餐城市页面制作订餐城市页面 最终文件:光盘最终文件第20章20-3index.html视频:光盘视频第20章20-3-3.swf最终文件:光盘最终文件第20章20-3select-city.html视频:光盘视频第20章20-3-4.swf制作餐厅列表页面制作餐厅列表页面在select-city.html页面中单击相应的

6、订餐城市,即可进入该城市餐厅列表页面,可以在该页面中查看相应的餐厅,该页面的餐厅列表与首页面中的食品类型列表非常相似。实战练习实战练习制作餐厅列表页面制作餐厅列表页面制作餐厅介绍页面制作餐厅介绍页面在餐厅列表页面中单击某个餐厅即可进入该餐厅的介绍页面,在该页面中将分两个部分对餐厅信息和餐厅联系方式进行介绍,并且使用jQuery Mobile中的布局网格将介绍信息内容分为两栏显示。实战练习实战练习制作餐厅介绍页面制作餐厅介绍页面最终文件:光盘最终文件第20章20-3select- restaurant.html视频:光盘视频第20章20-3-5.swf最终文件:光盘最终文件第20章20-3restaurant.html视频:光盘视频第20章20-3-6.swf20.4本章小本章小结本章通过3个具有代表性的移动应用案例的制作讲解,向读者介绍了使用HTML5、CSS3与jQuery Mobile相结合制作移动应用页面的方法。通过本章内容的学习,希望读者掌握移动应用页面的制作方法,并能够开拓读者在移动应用设计制作方面的思路,开发更优秀的移动应用。

展开阅读全文
相关资源
正为您匹配相似的精品文档
相关搜索

最新文档


当前位置:首页 > 建筑/环境 > 施工组织

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号