iPhone开发教程之重新构建iPhone聊天应用程序.pptx

中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgiPhoneiPhoneiPhoneiPhone开发教程之重新构建开发教程之重新构建开发教程之重新构建开发教程之重新构建 iPhone iPhone iPhone iPhone 聊天应用程聊天应用程聊天应用程聊天应用程序（一）序（一）序（一）序（一）架构一个 iPhone 聊天应用程序常用缩写词常用缩写词架构解决方案架构解决方案构建服务器脚本构建服务器脚本清单清单 1.chat.sql 1.chat.sql清单清单 2.add.php 2.add.php清单清单 3.test.html 3.test.html清单清单 4.messages.php 4.messages.php构建客户端代码构建客户端代码创建用户界面创建用户界面创建视图控制器创建视图控制器清单清单 5.iOSChatClientViewController.h 5.iOSChatClientViewController.h中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org常用缩写词常用缩写词DOM：文档对象模型IDE：集成开发环境SAX：XML 简单 APISQL：结构化查询语言UI：用户界面W3C：万维网联盟XIB：Xml 界面生成器XML：可扩展标记语言iPhoneiPhoneiPhoneiPhone开发教程之架构一个开发教程之架构一个开发教程之架构一个开发教程之架构一个 iPhone iPhone iPhone iPhone 聊天应用程序聊天应用程序聊天应用程序聊天应用程序中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org目前已有 4000 万台 iPhones 在用，您无疑对编写 iOS 应用程序感兴趣。但是从何着手呢？大多数应用程序都会连接网络，那么一个跨越两端的项目（比如说聊天应用程序）又是如何呢？本文将向您介绍如何利用服务器和客户端组件构建一个聊天应用程序。从本文可以学到编写 iOS 应用程序的整个流程。学完本文之后，我保证您会想要编写一个这样的应用程序。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org构建应用程序从架构解决方案开始。图 1 中的架构展示了 iOS 设备（这里是 iPhone）如何通过两个 PHP 页面连接到服务器。图图 1.Chat App 1.Chat App 客户端客户端/服务器架构服务器架构iPhoneiPhone开发教程之开发教程之架构解决方案架构解决方案中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org这两个 PHP 页面（add.php 和 messages.php）都连接到数据库，分别用于发布和检索消息。在我提供的代码中，数据库是 MySQL，但是您可以使用 DB2 或者您喜欢的任何其他数据库。我使用的协议是 XML。add.php 页面返回一个 XML 消息，指出消息发布是否成功。messages.php 页面返回发布到服务器的最新消息。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org在您开始之前，我想要介绍一下您将从本文学到的内容。数据库访问数据库访问。我将向您介绍如何使用 PHP 向数据库添加行和检索行。XML XML 编码编码。服务器代码演示如何将消息打包成 XML。构建构建 iOS iOS 界面界面。我将详细介绍如何为应用程序构建用户界面。查询服务器查询服务器。Objective-C 代码向 messages.php 页面发出 GET 请求，以得到最新的聊天消息。解析解析 XML XML。使用对 iOS 开发人员可用的 XML 解析器，您可以解析从 messages.php 返回的 XML。显示消息显示消息。应用程序使用一个定制列表项显示聊天消息；这一方法可以让您了解到如何定制自己的 iOS 应用程序的外观。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org发布消息发布消息。应用程序通过 add.php 将数据发布到服务器，add.php 将指导您完成发布过程。定时器定时器。定时器任务用于周期性地轮询 messages.php，看何时来了新的聊天项目。对于一个例子来说，这些内容太多了，应该为您开发您想要构建的任何类型的客户端/服务器 iOS 应用程序提供一组适当的工具。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org从创建数据库开始。我将我的数据库叫做 chat，您可以给您的数据库随便取个您喜欢的名字。您只需要确保在 PHP 中更改连接字符串，以匹配数据库的名称。用来为应用程序构建单个表的 SQL 脚本在清单 1 中。iPhoneiPhone开发教程之开发教程之构建服务器脚本构建服务器脚本中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgDROP TABLE IF EXISTS chatitems;CREATE TABLE chatitems(id BIGINT NOT NULL PRIMARY KEY auto_increment,added TIMESTAMP NOT NULL,user VARCHAR(64)NOT NULL,message VARCHAR(255)NOT NULL);iPhoneiPhone开发教程之开发教程之清单清单 1.chat.sql 1.chat.sql中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org这个简单的单表数据库只有 4 个字段：行的 id，这是一个自动递增的整数添加消息的日期添加消息的用户消息本身的文本您可以更改这些字段的大小，以适应您的内容。在生产系统中，您很可能还想要有一个带有姓名和密码字段的用户表，还有一个用户登录界面。对于本例来说，我想要让数据库尽量简单，所以数据库中只有一个表。您想要构建的第一部分代码是清单 2 中的 add.php 脚本。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgiPhoneiPhone开发教程之开发教程之清单清单 2.add.php 2.add.php中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org该脚本连接到数据库，并使用已发布的 user 和 message 字段存储消息。就是在简单的 INSERT 语句中，两个值被转义，以解决任何含义不确定的字符，比如说可能会扰乱 SQL 语法的单引号。为了测试 add 脚本，您创建一个 test.html 页面，如清单 3 所示，它只是将字段张贴到 add.php 脚本。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org Chat Message Test Form User:Message:iPhoneiPhone开发教程之开发教程之清单清单 3.test.html 3.test.html中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org这个简单的页面只有一个表单（指向 add.php）和两个文本字段（分别用于用户和消息）。然后还有一个 Submit 按钮，用于执行张贴。test.html 页面安装好之后，您就可以测试 add.php 脚本了。在浏览器中打开测试页面，结果类似于 图 2，User 字段中显示有值 jack，Message 字段中有值 This is a test，下面是一个 Submit Query 按钮。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org图图 2.2.消息发布测试页面消息发布测试页面从这里，您添加一些值并单击 Submit Query 按钮。如果一切正常，您会看到类似于图 3 的画面。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org图图 3.3.成功的消息发布成功的消息发布iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org否则，您可能会得到一个 PHP 堆栈跟踪，告诉您数据库连接失败或者 INSERT 语句不工作。消息添加脚本能够工作，下面应该构建 messages.php 脚本了，它返回消息列表。该脚本展示在清单 4 中。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org.mysql_real_escape_string($_REQUESTpast).ORDER BY added LIMIT 50);else$result=mysql_query(SELECT*FROM chatitems ORDER BY added LIMIT 50);?iPhoneiPhone开发教程之开发教程之清单清单 4.messages.php 4.messages.php中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgmessage added=id=iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org这个脚本稍微有点复杂。它做的第一件事是完成查询。这里有两种可能：如果提供了 past 参数，那么脚本只返回超过指定 ID 的消息。如果没有指定 past 参数，那么返回所有消息。使用 past 参数的原因是，您想要客户端是智能的。您想要客户端记住它已经看到过的消息，只寻找那些超过它已经具有的消息。客户端逻辑足够简单，它只保留它找到的最高值 ID，并作为 past 参数发送它。在开始时，它可以发送 0 作为值，相当于根本就不指定任何内容。脚本的第二部分从查询结果集中检索记录，并将它们编码成 XML。如果这一部分脚本能够工作，那么您在浏览器中打开这一页面时，会看到类似图 4 的效果。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org图图 4.4.聊天消息列表聊天消息列表iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org服务器脚本就算完成了。当然，您可以添加您想要的任何逻辑，额外的通道、用户验证和登录，等等。对于这个实验性的聊天应用程序，这个脚本已经工作得很好了。现在您可以构建将会使用这个服务器脚本的 iOS 应用程序了。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgiOS IDE 叫做 XCode。如果您还没有这个 IDE，那么需要从 Apple Developer Site（参见 参考资料）下载它。最新生产版本是 XCode 3，我这里的屏幕截图使用的就是这个版本。现在已经有了一个更新的版本，叫做 XCode 4，它在 IDE 中集成了 User Interface 编辑器，但是该版本目前还处于预览模式。XCode 安装好之后，现在就该使用图 5 所示的 New Project 向导构建应用程序了。iPhoneiPhone开发教程之开发教程之构建客户端代码构建客户端代码中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org图图 5.5.构建一个基于视图的构建一个基于视图的 iPhone iPhone 应用程序应用程序iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org开始最容易的应用程序类型是基于视图的应用程序。这种应用程序允许您在您选择的地方放置控件，并为您完成大多数 UI 设计。选择控件之后，再选择 iPhone 或 iPad。这一选择关系到您将在什么样的设备上进行模拟。您可以编写代码，以便在 iPhone 或 iPad 或者 Apple 即将推出的任何其他 i-设备上运行。单击 ChooseChoose 之后，您会被要求给应用程序命名。我将我的应用程序取名为“iOSChatClient”，但是您可以随便给自己的应用程序取一个您喜欢的名字。您给应用程序命名之后，XCode IDE 会构建核心应用程序文件。然后，编译并启动它，确保一切正常。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org创建应用程序之后，您就可以开发界面了。从视图控制器 XIB 文件开始，该文件位于 Resources 文件夹中。通过双击该文件夹，可以打开 Interface Builder，这是 UI 工具箱。图图 6.6.界面布局界面布局iPhoneiPhone开发教程之开发教程之创建用户界面创建用户界面中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org图 6 展示了我如何布局三个控件。顶部是文本框，用于输入您想要发送的消息。文本框的右边是 Send 按钮。下面是 UITableView 对象，其中展示了所有聊天记录。我会详细介绍如何在 Interface Builder 中完成这一切，但是我建议您下载项目代码，自己试验一下。尽管放心将该项目用作您自己的应用程序的模板。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org用户界面这就完成了。下一个任务是回到 XCode IDE，向视图控制器类定义添加一些成员变量、属性和方法，如清单 5 所示。iPhoneiPhone开发教程之开发教程之创建视图控制器创建视图控制器中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org#import interface iOSChatClientViewController:UIViewController IBOutlet UITextField*messageText;IBOutlet UIButton*sendButton;IBOutlet UITableView*messageList;NSMutableData*receivedData;NSMutableArray*messages;int lastId;iPhoneiPhoneiPhoneiPhone开发教程之开发教程之开发教程之开发教程之清单清单清单清单 5.iOSChatClientViewController.h 5.iOSChatClientViewController.h 5.iOSChatClientViewController.h 5.iOSChatClientViewController.h中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org NSTimer*timer;NSXMLParser*chatParser;NSString*msgAdded;NSMutableString*msgUser;NSMutableString*msgText;int msgId;Boolean inText;Boolean inUser;iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.orgproperty(nonatomic,retain)UITextField*messageText;property(nonatomic,retain)UIButton*sendButton;property(nonatomic,retain)UITableView*messageList;-(IBAction)sendClicked:(id)sender;endiPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org从顶部开始，我向类定义添加了 UITableViewDataSource 和 UITableViewDelegate。该代码用于驱动消息显示。类中有一些方法可以被回调，以便向表视图提供数据和布局信息。实例变量分为五组。顶部是对各种 UI 元素的对象引用、要发送的消息的文本字段、发送按钮和消息列表。下面是一些缓冲区，用于存储返回的 XML、消息列表和看到的最新 ID。lastID 从 0 开始，但是被设置为您看到的任何消息的最大 ID 值。它然后作为 past 参数的值被发送回服务器。iPhoneiPhone开发教程开发教程中国移动互联网研发培训专家www.embedtrain.org www.mobiletrain.org定时器每几秒钟触发一次，以查找来自服务器的新消息。最后一部分代码包含解析 XML 所需的所有成员变量。存在很多成员变量，这是因为 XML 解析器是一个基于回调的解析器，这表示它在类中保留有很多状态。成员变量下面是属性和单击处理程序。它们由 Interface Builder 用来将界面元素连接到这个控制器类。事实上，视图控制器中有了这些元素之后，就可以回到 Interface Builder，使用连接器控件将消息文本、发送按钮和消息列表连接到它们对应的属性，将 Touch Inside 事件连接到 sendClicked 方法。iPhoneiPhone开发教程开发教程