SnapchatStudy

snapstudy_demo.gif

SnapchatStudy_第1张图片
snapchat.jpg

这是自学iOS以后开的第一个稍微完整一点的项目,也是最早(阶段性)完成的。但是还不够完整,有一些设想的模块还没做,不过把最主要的功能完成了,UI部分就是照着SnapChat写的,尽量做到一致吧,但是其实还是有一些细节没做到。因为第一次写,中间掉了挺多次坑,也有大面积推倒重来的时候,不过总体还是写得很开心,我就是喜欢这种长得很可爱的App呀* -*

后台数据管理

后台采用的Parse.com,真的好好用!而且guide写得超级好,连界面都模仿的苹果的风格,行文清晰易懂。
User类型采用的是Parse的自带类PFUser,它提供了很方便的SignUp和LogIn方法,还是异步的。
Message类是自定义的PFObject,表示的是每一条消息,里面还存了发送者、接收者、时间、未读等信息。
然后我还建了个Conversation类,也是PFObject,保存的是一个对话。因为登录以后第一个界面显示的是当前所有存在对话的联系人的名字,这个类就是为了便于显示这个列表而创建的。一开始没有创建这个类,采用查询所有后台存的Message来找到和登录用户有关的对话的方法,实在有效率问题。而且这个列表界面更新还挺经常的,比如新建一个对话,比如有信息已读后被自动删除了,比如有新的信息到达,这个界面都需要更新,�如果不考虑效率就会比较慢。最后我的解决办法就是创建这样一个类,维护和查询这个类的列表比查询所有Message快很多。但是其实还是不能算得上scalable的,毕竟现在用户太少,Conversation的数量级在n^2。不知道微信这样的应用是怎么做的?

功能实现

阅后即焚的功能是通过一个定时器,到了时间以后,直接在后台把相关的Message删除而实现的。后台删除以后,界面只需要刷新数据就可以看到阅后即焚的效果了。gif里展示的有点快,留意一下可以看到,在打开聊天界面以后,输入的过程中,原来显示的消息会后来变不见了,这就是消息已读以后就会定时被删除的原因。
对话列表和聊天界面的信息都是向后台发PFQuery请求拿到的,然后展示在页面上,需要的时候刷新。所有的请求都是异步的,请求完成后回到主线程刷新界面。我感觉整个界面还是蛮流畅的。

UI界面

SnapChat的界面不算复杂,但是风格比较活泼,有很多小细节做的很精致细腻,比如界面间的切换动画,一些小元素的动画等。
写UI的过程踩了很多坑,一直在边踩边查,边查边踩…对话列表和聊天界面写的比较顺利,就是一直在自定义各种cell和view,键盘事件处理的场景还比较简单。聊天界面采用的是一个ChatViewController嵌套两个内部controller(MessageTableViewController,InputBoxController)来写,这样消息展示和键盘输入都有专门的控制器来处理,顶层的控制器负责和后台交互以及刷新数据等逻辑。
添加好友和已有好友部分做的是很简单的处理,就直接在tableview上打勾来添加了…然后做了一个searchBar和右边的字母索引。
主要框架搭起来以后开始添加一些细节,比如对话列表的背景,自定义了萌萌的下拉刷新。最后是手势的交互,之前全是按照navigationController的默认行为实现的,其实原app实现得非常灵活,有在大界面左右滑动来切换,也有在cell上滑动来切换,切换的时候还会有点小细节动画。写这部分的时候卡了挺多次,最后写了自定义segue,自定义了一个可以右滑出底层背景并做跳转的cell。写的时候被手势打架折腾了很久...

To-do List

嗯还有很多模块没完成呢。现在只是阶段性总结。
一个是照相模块没有做,SnapChat的相机很可爱的!只是当时一看就有点蒙圈没什么思路,所以就先往后放了。
然后就是加好友的模块,做的太简单了,应该有个好友验证系统,这个怎么用Parse实现还要想一想,有一点小思路但是一直没有时间写。
还有很多可爱的小动画,包括一些我已经实现的,感觉还是在照虎画猫的程度,细腻的感觉还差很多。

你可能感兴趣的:(SnapchatStudy)