基于工作项目的Android高级开发实战（第2版） 课件 第12、13章 点餐系统客户端、第13章 ThinkPHP、课程思政QQ在线聊天APP整体设计

Android项目开发实战Android项目开发实战第12章

跟我做在线点餐系统(3)客户端开发本章大纲8-1、设计思路8-2、文件结构8-3、开发步骤8-4、知识点8-5、课后题8-1

设计思路8-1

设计思路客户端8-1

设计思路客户端客户端设计思路可简单描述如下：设计服务器访问功能类HttpPostUtil，实现客户端与服务端信息交互。设计主视图FirstActivity，用于选择注册或登录。设计注册视图RegisterActivity，通过HttpPostUtil，与服务端的Register.php进行信息交互，实现用户注册。设计登陆视图LoginActivity，通过HttpPostUtil，与服务端的Image.php及Login.php进行信息交互，实现用户登录。设计工具类ImageLoader、FileCache及MemoryCache，访问服务端，实现菜单图片的异步加载。设计语言设置类MenuFragment，实现多语言菜单。8-1

设计思路设计数据封装类MenuBean，封装订单信息。设计菜单显示适配器类MenuListAdapter，负责显示菜单信息，以及通过ImageLoader，获取菜单图片。设计菜单视图MenuActivity，通过MenuFragment选择菜单语言，并且通过HttpPostUtil，与服务端的ShowMenu.php进行交互，获取相应语言的菜单信息，然后将菜单信息传递给MenuListAdapter，实现菜单的显示。以及实现订单的生成，并将订单信息通过MenuBean封装后，传递给订单视图OrderActivity。设计订单显示适配器类OrderListAdapter，负责显示订单信息。设计订单视图OrderActivity，通过OrderListAdapter显示订单，并通过HttpPostUtil，与服务端的AddOrder.php进行交互，实现下单。8-2

文件结构8-2

客户端文件结构点菜系统客户端为android客户端。主要实现功能包括注册，登陆，查看多语言菜单，下单功能。餐厅可为每张桌子配备一台手机，当有不同客户光临的时候，通过手机端点餐。在收银台的电脑的管理端可以查看所点菜式的中文名和数量。主要描述分5个模块。分别为：主界面：跳转登录或者注册界面。登陆模块：验证码，登录后获得对面座位的信息。注册模块：注册用户和座位号的信息。菜单模块：根据所选标签，获取不同语言菜式，选择菜式和数量发送到订单界面。订单模块：查看已点菜式和数量，提醒用户确定无误后将订单发送到服务端。8-2

客户端文件结构8-3

开发步骤8-3-1

主界面（1）创建工程新建Android工程diancai，然后在src中如图9-2建立包名。8-3-1

主界面（2）创建启动界面（主界面）视图右键包com.sziit.diancai.activity，选择new->other。弹出选择框，选择Android->Android

Activity->BlankActivity->next，Launcher

Activity打钩8-3-1

主界面（3）编写主界面布局将本书资源文件中的相关图片复制到“.\diancai\res\drawable-hdmi”。打开activity_first.xml，编写布局文件，添加两个按钮，一个登陆按钮，一个注册按钮。代码如下8-3-1

主界面（4）编写主界面代码打开FirstActivity.java，在onCreate()加载按钮并监听跳转到相应界面。代码如下：8-3-2

注册模块（1）创建注册视图右键包com.sziit.diancai.activity，选择new->other。弹出选择框，选择Android->Android

Activity->BlankActivity->next，新建RegisterActivity，8-3-2

注册模块（2）编写注册视图布局打开activity_register.xml，编写代码如下：8-3-2

注册模块（3）编写OKHTTP访问功能类在com.sziit.diancai.utils包中新建功能类OkhttpUtil.java,封装HTTP

POST信息的发送方法并返回json数据。代码如下，请根据服务器端的IP地址设置服务器IP地址（与数据库中设置的IP保持一致）：8-3-2

注册模块（4）编写注册视图代码打开RegisterActivity.java，编写代码如下，在子线程中调用“.\diancai\src\com.sziit.diancai.utils\OKHttpUtil.java”，实现HTTP异步访问。8-3-2

注册模块（5）添加Internet访问权限打开AndroidManifest.xml，添加Internet访问权限，代码如下：.\diancai\AndroidManifest.xml<uses-permission

android:name="android.permission.INTERNET"

/><uses-permissionandroid:name="android.permission.ACCESS_WIFI_STATE"/>8-3-3

登陆模块（1）创建登陆视图右键包com.sziit.diancai.activity，选择new->other。弹出选择框，选择Android->Android

Activity->BlankActivity->next，新建LoginActivity8-3-3

登陆模块（2）编写登陆视图布局打开activity_login.xml，编写代码如下：8-3-3

登陆模块（3）编写登陆视图代码打开LoginActivity.java，编写代码如下，在子线程中调用

“.\diancai\src\com.sziit.diancai.utils\HttpPostUtil.java”，实现HTTP异步访问。8-3-4

菜单模块（1）创建菜单视图按上面方法新建视图MenuActivity，对应的类文件与布局文件为MenuActivity.java和activity_menu.xml。8-3-4

菜单模块（2）预定义字符串值打开res/values/strings.xml。把列表名输入进去方便以后调用。.\diancai\res\values\strings.xml<?xml

version="1.0"

encoding="utf-8"?><resources><string

name="app_name">diancai</string><string

name="action_settings">Settings</string><string

name="hello_world">Hello

world!</string><string

name="title_activity_login">LoginActivity</string><string

name="title_activity_first">FirstActivity</string><string

name="title_activity_register">RegisterActivity</string><string

name="title_activity_menu">MenuActivity</string><string

name="title_activity_order">OrderActivity</string><string-array

name="language"><item>中文菜单</item><item>日文菜单</item><item>韩文菜单</item><item>英文菜单</item></string-array></resources>8-3-4

菜单模块（3）编写菜单视图布局编辑activity_menu.xml，代码如下。为一个空的FrameLayout。用于下边将不同的Fragment放进来。.\diancai\res\layout\activity_menu.xml<FrameLayoutxmlns:android="/apk/res/android"xmlns:tools="/tools"android:id="@+id/container"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MenuActivity"tools:ignore="MergeRootFrame"

></FrameLayout>8-3-4

菜单模块新建fragment_menu.xml。添加一个listview和一个button。.\diancai\res\layout\fragment_menu.xml<LinearLayout

xmlns:android="/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical"

><ListViewandroid:id="@+id/listView"android:layout_width="match_parent"android:layout_height="326dp"android:layout_weight="1.02"

></ListView><Buttonandroid:id="@+id/ok"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@drawable/shape"android:text="提交"/></LinearLayout>8-3-4

菜单模块新建menu_list_item.xml。用于设计菜单列表显示的每一项8-3-4

菜单模块（4）编写菜单视图代码编辑MenuActivity.java，代码如下。在actionbar上添加下拉菜单，然后实现ActionBar.OnNavigationListener接口，即可在点击相应下拉菜单项显示对面的内容，内容显示在一个Fragment中。8-3-4

菜单模块（5）编写菜单子页面代码在com.sziit.diancai.activity新建MenuFragment类，继承Fragment，编写代码如下，供菜单主视图调用8-3-4

菜单模块（6）异步加载菜式图片在com.sziit.diancai.utils新建FileCache.java文件缓存类。用于缓存异步加载的列表图片。8-3-4

菜单模块在com.sziit.diancai.utils新建MemoryCache.java内存缓存类。用于缓存异步加载列表的图片。8-3-4

菜单模块在com.sziit.diancai.utils新建ImageLoader.java。封装异步加载图片的方法。8-3-4

菜单模块（7）创建菜单信息接口在com.sziit.diancai.bean新建MenuBean，调用Serializable接口，实现菜单信息封装，代码如下。8-3-4

菜单模块（8）显示菜单在com.sziit.diancai.adapter新建MenuListAdapter类继承BaseAdapter。用于显示菜单列表项。获取对应控件。显示相应数据。监听加减按钮。用数组记录点菜数量。8-3-4

菜单模块（9）添加SD卡读取权限在AndroidManifest.xml添加权限读取sd卡的权限。.\diancai\AndroidManifest.xml<uses-permission

android:name="android.permission.WRITE_EXTERNAL_STORAGE"/><uses-permission

android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS"/>8-3-5

订单模块（1）创建订单视图按上面方法新建订单视图OrderActivity，对应的类文件与布局文件分别为OrderActivity.java和activity_order.xml。8-3-5

订单模块（2）编写订单视图布局编辑activity_order.xml，代码如下。8-3-5

订单模块（3）编写订单视图代码编辑OrderActivity.java，代码如下：8-3-5

订单模块（4）显示订单在com.sziit.diancai.adapter新建OrderListAdapter类继承BaseAdapter。用于显示订单。8-4

知识点8-4

知识点Javascript脚本语言:Javascript是一种增加网页交互性的脚本语言，跟Java语言以及Java服务器页面（JSP）没有任何关系。jQuery:jQuery是一套跨浏览器的Javascript库，简化HTML与Javascript之间的操作。本例中，使用Javascript以及jQuery，使用DIV+CSS进行页面布局,实现了菜单页面与订单页面中表格奇数行与偶数行颜色设置。8-4

知识点D:\xampp\htdocs\Order\ShowMenu.php<!DOCTYPE><html>.................................................................<!--引入Jquery，为菜单表格奇数行、偶数行、首行设置不同颜色--><script

src="./jquery.min.js"

type="text/javascript"></script><script

type="text/javascript">$().ready(function(){$("#main

table

tr:even").addClass("t_even");$("#main

table

tr:odd").addClass("t_odd");$("#main

table

tr:first").removeClass("t_even");$("#main

table

tr:first").addClass("t_tit");});</script>.................................................................</html>8-5

课后习题8-5

习题项目三中，服务器IP是通过一个静态变量固定在程序中的，当服务器IP发生变化时，需要修改代码（项目一、二中的处理也是相似的），这很不方便。请尝试在客户端添加服务器IP的设置功能，使用户可随时更改服务器IP。可参考图11-3进行设计：（1）在登陆视图中添加一个设置按钮，点击后计入设置视图；（2）在设置视图中输入IP及端口号，即可完成服务器IP设置。8-5

习题这里给出一些提示：在客户端添加一个设置视图，获取用户输入的IP及端口号修改HTTP异步访问类HttpPostUtil代码，添加一个服务器

IP修改方法。注意，服务器IP修改后，与服务端功能模块如登陆、注册、下单等相关的URL都要进行调整。8-5

习题作业提交：（1）UI设计图（2）代码（服务端、管理端、客户端）（3）开发文档（需求、整体设计、详细设计）（4）单元测试报告移动终端软件开发实战移动终端软件开发实战第九章PHP开发框架初步本章大纲9-1、PHP开发框架简介9-2、ThinkPHP开发框架实例9-1、PHP开发框架简介9-1PHP开发框架简介1.1

框架的定义PHP开发框架就是一套具有一定结构的代码，提供了开发一个PHP

web服务器的基本功能代码。1.2

框架的优势（1）快速

PHP开发框架提供了开发一个PHP

web服务器的基本功能代码，避免了代码的重复编写，节省了开发时间。2）规范

一个PHP开发框架的结构是固定的，这相当于为开发者制定了开发规范，所有的开发者按照相同的规范开发程序，有利于开发中的合作以及后期维护。PHP开发框架相当于web开发的流水线。9-1PHP开发框架简介1.3常用的框架（1）Zendframework开发PHP语言的Zend公司提供的官方框架，功能最全页最为笨重。（2）CodeIgniter一个非常小巧的框架，开发灵活，速度快。（3）CakePHP一个重量级框架，耦合度高，开发大型项目会比较麻烦。（4）ThinkPHP国人框架，小巧，开发灵活，入门容易，不太适合大型项目。（5）HushFramework

国人框架，已被多个国内网络公司采用，运行效率高，沿用了ZendFramework的规范。9-1PHP开发框架简介1.4框架与MVC

目前大多数的框架都是基于MVC模式的。MVC是一种采

用Model-View-Controller（模型-视图-控制器）结构开

发程序的模式，强调程序中模型、视图、控制器三者分离。三者定义如下图所示：Model（模型）：程序中处理数据逻辑的部分，通常负责在数据库中存取数据。View（视图）：程序中数据显示部分，相当于用户界面。Controller

（控制器）：程序中负责与用户交互的部分，控制器接收到用户的操作后，根据用户的操作调用模型中的相应方法进行数据库操作等，最后将模型传递回来的数据传递给视图进行显示。9-1PHP开发框架简介9-2、ThinkPHP开发框架实例9-2

ThinkPHP开发框架实例本节中，将采用ThinkPHP框架，开发一个极简新闻系统，符合MVC模式。本例实现的功能如下图所示。2.1

View（视图）开发1）导入ThinkPHP框架

在文件夹“D:\xampp\htdocs\mynews\”中，新建一个文件夹“7”，将解压后的

ThinkPHP框架目录中所有的内容拷贝到此文件夹。拷贝完成后，确保下列文件与文件夹都在

“D:\xampp\htdocs\mynews\7”中。9-1PHP开发框架简介并确保下列文件与文件夹都在Application文件夹中，这些文件夹代表ThinkPHP应用程序中的各个模块。9-1PHP开发框架简介（2）创建程序管理模块•

在“D:\xampp\htdocs\mynews\7\Application\”中，新建一个文件夹“Admin”，用于存放管理程序输入输出的代码。将“D:\xampp\htdocs\mynews\7\Application\Home”中的所有文件与文件夹拷贝到

“D:\xampp\htdocs\mynews\7\Application\Admin\”文件夹中。拷贝完成后，确保下列文件与文件夹都在ewwss\\77\\AApppp“D:\xampp\htdocs\myn

lication\Admin\”中。9-1PHP开发框架简介9-1PHP开发框架简介（3）创建输出视图

“D:\xampp\htdocs\mynews\7\Application\Admin\View”文件夹中，创建一个

News文件夹，存放相应Controller（控制器）的输出视图。“D:\xampp\htdocs\mynews\7\Application\Admin\View\News”文件夹中，创建一个

news_list.html页面文件，该页面用于接收相应Controller（控制器）的输出数据，然后展示给用户。代码如下：（4）创建输入视图

在“D:\xampp\htdocs\mynews\7\”文件夹中，创建一个index.html页面，该页面为新闻发布系统的首页，也是

Controller（控制器）的输入页面。代码如下：9-1PHP开发框架简介2.2

Controller（控制器）开发

在

“D:\xampp\htdocs\mynews\7\Applicati

on\Admin\Controller\”文件夹中，创建

一个控制器类NewsController.class.php，在该类中创建一个news_list()方法，用于调用Model（模型）中的方法，查询数据库中的新闻列表，并把查询到的数据传递给

news_list.html页面。代码如下：9-1PHP开发框架简介9-1PHP开发框架简介2.3

Model（模型）开发（1）创建数据库SET

character_set_client

=

gbk;

SET

character_set_connection

=

gbk;SET

character_set_database

=

gbk;SET

character_set_results

=

gbk;SET

character_set_server

=

gbk;SET

collation_connection

=

gbk_chinese_ci;SET

collation_database

=

gbk_chinese_ci;SET

collation_server

=

gbk_chinese_ci;create

database

news;use

news;create

table

news(news_id

int

auto_increment

primary

key,title

char(100)

not

null);2.3

Model（模型）开发（2）给ThinkPHP提供的Model（模型）方法配置好参数即可。打开

“D:\xampp\htdocs\mynews\7\Applicati

on\Common\Conf\config.php”，填写如下代码，使ThinkPHP的Model（模型）可以访问localhost主机上mysql数据库中的名为news的数据库。9-1PHP开发框架简介注意命名规则：存放输出视图的文件夹：

News该输出视图对应的控制器类：NewsController该控制器类对应的PHP文件：NewsController.class.php2.4测试在浏览器中输入

“http://localhost/mynews/7/index.ht

ml”，打开新闻发布系统首页，点击“新闻列表”链接查看新闻列表。9-1PHP开发框架简介3、小结本章采用ThinkPHP框架，将新闻发布系统的新闻浏览功能改造成了MVC模式，实现了

Model-View-Controller（模型-视图-控制器）三者的分离。本章的代码中，HTML代码与PHP代码完全分离，Controller（控制器）与View（视图）之间仅通过一个

newsList变量传递数据，实现了页面美工人员与PHP程序员的工作完全的分离。9-3小结4、课后练习（1）为QQ在线聊天增加一对一聊天功能。（2）将QQ在线聊天系统采用ThinkPHP框架改造成MVC模式。9-4课后练习QQ在线聊天APP整体设计移动互联网应用开发技术课程思政本次疫情中，充分体现了我国医护人员爱岗敬业的专业精神大批医护人员展现了优秀的职业素质与心理素质，在抗疫的第一线，克服重重困难，坚守岗位，舍生忘死，救死扶伤祖国的建设中，各行各业都需要这种爱岗敬业精神作为一名未来的程序员，我们要干一行、爱一行，在工作中具有饱满的热情，能够克服困难，坚守岗位1项目需求分析1注册：填写用户名、密码，点击注册按钮进行注册。查询数据库，若库中无重复用户名，则注册成功。注册成功后，在数据库中新增一个用户1项目需求分析2登录：点击图4-1中的登录按钮进行登录。查询数据库，若用户名密码正确，则成功登陆。成功登陆后，进入QQ

主界面的会话子界面，列表中有一个默认的

QQ聊天群，如图4-3所示。1项目需求分析3群聊：点击QQ主界面中的群栏目进入群聊视图，如图所示。点击发送按钮可发群信息，信息发送成功后，在数据库中会增加一条聊天记录，如图所示。群内其他用户可实时的接收到当前用户发送的信息。2项目设计思路在线音乐播放器的开发包括客户端的开发与服务端的开发。服务端设计如图所示；客户端设计如图所示。用户信息及聊天信息等信息存储在在服务器上的MySQL数据库中。客户端向服务端发送数据库操作相应的增、删、改、查请求，实现注册、登陆、聊天。按功能模块划分，本项目开发可分为两个子任务：用户注册及登录模块开发；聊天信息发送与接收模块开发。每个功能模块的开发都包含了服务端与客户端的开发。下面结合设计图4-6与4-7，对两个子任务的设计思路分别进行阐述。2项目设计思路2项目设计思路-用户注册及登录模块1)

在服务端数据库中添加一个用户表，记录用户名、用户密码等信息。在服务端编写数据库连接代码conn.php，实现服务端各个代码模块与

MySQL数据库的连接。在服务端编写注册功能代码registe