MyFlag Step6：app详细页面设计与代码编写

引言

这周前半部分的工作我们主要对页面进行了初步设计，也实现了一些功能代码，后半部分在页面方面进行了进一步的详细设计，并且编写了其他功能代码，总结一下工作目录：

• 页面详细设计与所有页面基本完成
• 客户端代码编写
• 后台代码编写

一、页面详细设计与所有页面基本完成

在前两天确定了所有界面的交互逻辑后，这周的后半部分，页面部分进行了进一步设计，目前已基本完成了所有界面的初步设计。这里介绍两个设计界面，主界面和我的好友界面：

1、主界面

首页包括以下信息：

• 新建flag按钮：点击后可以跳转到新建flag界面，新建自己的flag。
• 已立flag：显示我当前已经立的flag信息，信息包括个人还是团体，时间，监督人，奖励，以及是否完成。

2、我的好友

我的好友界面按照首字母顺序来为好友分类，并且支持首字母索引。

所有的界面初步设计都已经完成，在后期，还会针对设计中的不足，对界面进行修改。

二、客户端代码设计

客户端这两天主要进行了以下代码的编写：

• 添加好友
• 查看我的好友

1、添加好友

添加好友功能分为三个界面，分别是：

• 搜索用户id界面：在此界面中，对想要添加为好友的用户id进行搜索，如果id正确，会跳转到下一个界面
• 验证消息界面：在此界面中，如果搜索的用户id正确，想添加用户为好友，需要发送验证消息，说明自己的身份的信息，让对方做出确定
• 添加好友界面，在此界面中，添加好友的备注，然后点击发送按钮，便可以发送好友请求

界面间的跳转使用Intent携带上个界面获取到的信息来实现，在搜索id和发送好友请求界面分别需要调用搜索和发送好友请求的后台接口。发送好友成功后，将发送界面和验证消息界面全部finish，这部分功能部分截图如下：

2、查看我的好友界面

实现了使用FirstLetterUtil工具类来进行首字母顺序分类，并且自定义了LetterFilterListView控件，继承自listView，实现了用侧边字母进行好友检索，代码截图如下：

三、后台代码编写

本次后台主要做了一下几个任务：

• 针对Android端提出的几个问题进行了修改
• 添加了好友功能，对好友的问题进行了部分处理，暂时有添加、同意、对请求做出处理这几项功能，并对新添加的功能进行了测试

之所以想要先添加好友的功能主要是因为，在处理flag的时候需要用到好友的关系，所以先对这个进行了开发，我们决定暂时不先开发聊天功能，一是因为时间问题，另一个也是因为聊天功能相对来说没有那么重要，很多人都可以使用其他聊天工具进行聊天。在处理好友的时候，我们充分考虑了android的意见。采用了这个方法。

总结

本周的工作可以说做的还不错，起初本来是打算开发创建flag界面，但是创建flag需要邀请好友监督，所以就先做了好友功能，好友也算一个比较复杂的部分，解决了好友功能，相信我们之后的工作会更加顺利。