基于智能手机的菜谱APP设计与实现

毕业设计说明书基于智能手机的菜谱APP设计与实现2020年5月15日基于智能手机的菜谱APP设计与实现摘要：自进入21世纪以来，随着当今时代的不断地发展以及现代科学技术的不断地进步，智能手机的应用质量和应用功能等方面都得到了很大的提升和改善。现在移动不断进步和成熟，互联网的发展，在此背景下，互联网也在不断推动着智能手机和移动应用APP软件的发展，继而对于手机端移动应用的开发和推广带来了巨大的优势。对当前主流手机系统来说，以IOS系统为主的苹果智能手机和以Android系统为主的安卓智能手机因其随身使用便利，使用快捷和其独特的高端智能化的优点获得了社会各阶层大众用户的好评。并且我们现在社会人们日常生活的品质与发展水平在不断地提高，对于日常生活的各个方面的细节质量要求会更加的细节化，它涉及到了人们日常生活中的衣食住行各个方面。对于饮食方面，相关菜谱APP被越来越多的受到人们的喜爱。移动互联时代与APP的应用，让人们随时随地可以浏览使用APP来进行学习制作美食，享受美食。无论我们社会经济发展以及如何更迭变迁，通过美食话题来进行分析社交，对人们的人际交往和人情交往都起着非常重要的作用。关键词：HTML CSS JavaScript 移动应用Design and Implementation of Recipe APP Based on Smart PhoneAbstract：Since entering the 21st century, with the continuous development of the current era and the continuous progress of modern science and technology, the application quality and application functions of smart phones have been greatly improved and improved. Now that mobile technology is advancing and maturing, Under this background environment, the development and promotion of smart phone APP application software has gained a great advantage. Smartphones such as Apple phones and Android phones have also won praise from users because of their easy portability, fast use, and high-end intelligence. And now people's living standards are constantly improving. Naturally, the requirements for quality of life will also be higher and higher. It involves all aspects of People's Daily life. For diet, the related recipe APP is more and more popular. The era of mobile internet and the application of APP allow people to browse and use APP to learn to make food and enjoy food anytime, anywhere. No matter how society develops, the socialization of food topics plays an important role in people's interpersonal relationships and interpersonal relationships.Keywords：HTML CSS JavaScript Mobile Application目 录摘要Abstract目录1 APP设计背景及技术11.1研究背景11.2研究目的和意义11.3设计思想背景21.4技术介绍简介41.4.1 HBuilder开发工具简介41.4.2 HTML(Hyper Text Markup Language)简介41.4.3 CSS(Cascading Style Sheets)简介51.4.4 JavaScript简介51.4.5 jQuery简介61.4.6 MUI框架简介62 APP概要设计72.1同类型APP分析72.2菜谱APP设计需求72.3菜谱APP界面及功能设计82.4菜谱APP流程图83 APP详细设计说明93.1用户登录界面93.2用户注册界面103.3广场界面123.4搜索界面153.5收藏界面173.6个人设置界面193.7菜品详情界面224 总结29参 考 文 献30致 谢31IV1 APP设计背景及技术1.1研究背景在当今社会下，手机给大众带来的便利都是有目共睹的，无论在学习还是生活、工作中，都需要依靠手机来进行日常操作。伴随着现代科技的不断地进步与社会更迭发展，现下智能手机的产品质量及应用功能等方面都得到很大的提升和改善。就从手机的外观上来讲，早期的翻盖直板式手机变为现下流行触摸全屏模式的手机，迎合了用户对手机的需求，给用户使用智能手机时带来了更为丰富的直观效果体验。触摸屏手机的快速发展，要求更高的手机APP的多样性的应用，例如美食，摄影，运动，阅读，健康等不同企业类型的APP的出现，同时也引领了智能手机应用程序的快速增长1。现在移动不断进步和成熟，互联网的发展，在此背景下，智能手机APP应用软件的开发和推广一直是一个非常大的优势。IPhone和Android手机等智能手机凭借携带方便，快捷的使用和高端智能特性赢得了广大用户的好评。如今，一大批优秀的应用开发对于开发设计APP应用软件的渴望非常强烈。移动互联网应用开发涉及到苹果的IOS和Android系统应用平台，涉及范围广泛延伸到美容，汽车，服装，娱乐，媒体等行业服务的发展的智能手机APP。在科技技术不断地发展进步下，APP应用系统软件将成为中国移动互联网金融市场中不可小觑的一股力量。1.2研究目的和意义现在社会人们日常生活的品质与发展水平在不断地提高，对于日常生活的各个方面的细节质量要求会更加的细节化，它涉及到了人们日常生活中的衣食住行各个方面。对于饮食来说，每个人都需要一日三餐，越来越多的人开始关注美食2。在移动互联网飞速发展的时代下，结合大众对美食的执念，关于饮食类的菜谱APP或订餐APP也不断被开发设计出来。这些餐饮美食APP也越来越受到人们的喜爱。菜谱APP的使用可以以让人们从制作和享受美食中开拓身心。相对于各类菜谱过去停留在书本上面，菜谱APP将显示整个生产过程在他们的照片和视频中，长远发展来说，对于菜谱APP应用软件会成为各大应用商场平台的潜力股。移动应用软件平台的出现满足了移动互联网下用户对于手机应用软件的个性需求，在提供的各类应用APP中，大多是音乐，媒体，娱乐等相关应用程序，而关于美食类APP主要是以外卖订餐类和菜谱教学类为主，对于我们生活发展水平的不断努力提高，为追求更加美好的生活品质，相对于外卖类APP，应用程序食谱越来越受欢迎。移动互联时代与APP的应用，让人们可以随时随地可以制作美食，享受美食。目前我国国内企业应用进行比较广泛APP有：好豆菜谱，下厨房，美食杰等。主打人群基本是家庭妇女，企业职工等，想要满足自身对于美食制作的需求，同时也不想要花费过长时间或者制作要求繁杂，对于这种类型用户群体来说，可以随时随地在浏览APP时在线学习如何做出既制作简单又非常美味的吃食，这在极大程度上拥有了一群家庭用户群体3。菜谱APP作为大众类APP，社会各界层人士都可以学习。1.3设计思想背景在现在手机应用软件平台上的App主要分为三类：一类是Web App4，它是通过访问浏览器去实现APP的功能；一个是原生应用程序，也就是Native APP，它是通过应用商店安装的；还有一类是Hybrid App。原生App也就是Native App，它自始至终都依赖着智能终端操作系统OS，对于原生APP的开发开说，它受限于由智能手机终端进行操作管理系统发展提供的应用研究程序接口API（Application Programming Interface）5，应用分析程序接口是一些企业预先定义好的函数，或者指软件信息系统具有不同学生组成一个部分衔接的约定。原生移动应用APP的设计的主要模式是“终端+应用”模式，所以原生App开发也就是指一个基于本地实际操作管理系统的App开发企业服务。这种开发模式也是当前主流的移动应用模式。如今,当今移动应用软件平台上的应用程序APP主要是以原生编程语言编写的。在它能够接入和兼容比较好的原生应用，可以支持在线消息推送或离线消息推送，也可以是本地资源访问，以及调用手机摄像头，拨号，蓝牙等操作功能6。在设计开发原生Native APP的过程中会有许多的优势，主要是通过针对企业不同的应用技术，可以更加有效地节约宽带成本，在通过手机访问本地存储的相关信息资源时，加载信息速度会更快，并且打开相应信息界面的速度也更快。这样不仅为广大用户群体在使用移动应用APP时提供了更加流畅的使用效果体验，也让用户群体在使用时享受到了快速的网络服务。Web App也就是以HTML5为主要技术的应用APP开发，通过利用Web技术来达到手机移动应用App的设计体验。因为Web技术企业本身发展需要通过各大网络浏览器的支持才能对APP进行分析展示和用户可以动态信息交互，因而Web App主要运用到的技术是HTML57、CSS、JavaScript等。Web App每个应用都是由多个页面相互联系组成，HTML5、CSS样式、JS代码构成一个页面描述8。Web APP的显著优势在于一次开发，多平台使用。现下企业大多都是主流网络浏览器如火狐浏览器，苹果手机自带Safari或者各大主流国产浏览器等都支持HTML5。不仅节省了时间，还提高了运行效率。HTML5也支持移动手机端的跨应用切换，使用者不需要返回桌面，就可以在不同的APP之间相互进行切换。HTML5书写代码清晰简洁，明了易懂，还可以进行加密，在本地进行解密后即可运行，更加安全9。但由于网络技术本身，HTML5技术所设计开发出来的移动应用APP在使用效果和手机运用性能的整体操作体验上有较大的缺陷，在某种情况下，Web APP的反应速度较慢，各个页面之间切换流畅性不太好，也无法像原生APP一样调用手机摄像头、麦克风，蓝牙等，所以有些时候用户使用Web APP时的性能体验感较差。Hybrid App开发也就是混合应用APP开发，它是指在开发设计一款App应用的时候，以提高整体设计效率，节省开发成本，使用的原生APP技术和HTML5开发的技术来设计的混合和APP发展的10。一般企业来说，这种模式下进行开发系统设计的APP也就可以是以一个网页的模式来呈现，在此模式下的移动应用APP开发设计也是一种互补的设计开发模