• 仿微信聊天界面小项目总结


          从开始学习ios时,做这个小项目就卡了很久,到现在这个小项目算是我做的比较熟练的一个了,大概模型做出来了,做的比较粗糙,看起来挺挫的,呵呵。oc和swift两个版本都顺利完成了。因此总结一下曾经在这个小项目中遇到的种种问题!

          效果图:

          微信聊天界面主要内容有五部分构成:

          1.TableView部分,设置好各种必须的代理;

          2.TableViewCell部分,在自定义cell中要设置好三个控件的位置,这也是整个过程中最麻烦的部分;

          3.设置TextField部分发送消息时,界面消息的刷新和TextField代理的设置。

          4.设置ejabberd服务器。

          5.通过xmpp实现通信。

          第一部分:

          主要设置TableView的必备代理;

          cell的高度,section的数量,rownumber的数量,cell这几个简单的设置。需要注意的是:在设置单元格高度的时候需要计算出每次聊天内容的长度,通过聊天内容的高度来动态计算cell的高度。

          第二部分:

          在聊天过程中,由于两个人的头像和对话框在界面的两边,因此需要判断朋友和自己的不同位置。

           

          在cell中主要设置三个控件的位置-->[头像(UIImageView),聊天气泡(UIImageView),聊天文字(UILabel)],通过动态计算各自控件的frame。

          头像的大小固定设置,注意:聊天内容和气泡的大小,主要通过计算输入文字的长度,这个size的大小通过这个方法:

    #define talkMax 200
    @implementation UILabel (Resize)
    -(CGSize)Resize:(NSString *)message{
        NSDictionary *attribute = @{NSFontAttributeName: [UIFont systemFontOfSize:17]};
        CGSize size = [message boundingRectWithSize:CGSizeMake(talkMax, 1000) options:NSStringDrawingUsesLineFragmentOrigin attributes:attribute context:nil].size;
        return size;
    }

          其次需要注意的是:气泡图片的如果按照原图设计会失真,因此通过类别为UIImage添加一个新方法:

    -(UIImage *)Resize:(UIImage *)image{
        float top = image.size.width * 0.6;
        float buttom = image.size.width * 0.5;
        float avar = image.size.width * 0.5;
        return [image resizableImageWithCapInsets:UIEdgeInsetsMake(top, avar, buttom, avar) resizingMode:UIImageResizingModeStretch];
    }

          第三部分:

          自己消息的发送通过textfield的代理来推送实现,在nsmutablearray中添加新数据,并更新tableview数据。

          由于每次编辑聊天内容时都会弹出键盘,遮住textfield,我们通过一个kvo广播来得到键盘的高度和弹出动画时间,然后加一个动画效果来实现键盘和textfield一起移动。具体实现在键盘高度设定那篇随笔中有详细描述。

         第四部分:

         ejabberd虚拟服务器的配置,只需要设置好自己的用户域名,添加一些好友进去就可以实现。好友的聊天客户端通过mac自带的Imessage或者Aduim添加一个ejabberd账户就可以了。

         注:在使用ejabberd服务器时,登录页面并输入用户名和密码后并未出现登录页,不知道是否浏览器问题,需要再次start一次ejabberd,便可登录了。

         第五部分:

         使用xmpp来实现消息的收发和好友状态的改变,以及用户登录。

         在xmpp简单介绍中有详细使用方法。

         以上各点就是我在做这个小项目的过程中遇到的一些小问题。

              

  • 相关阅读:
    html5 存储(删除)
    java 单例模式
    android知识点汇总
    java多线程 与 并发
    cuda GPU 编程之共享内存的使用
    vs 2015 + OPENGL 配置
    Ubuntu 14.04 安装 CUDA 问题及解决
    性能分析工具gprof介绍
    vim 换行方式 win 转Ubuntu vim 格式调整
    计算显卡对比
  • 原文地址:https://www.cnblogs.com/moxuexiaotong/p/4823090.html
Copyright © 2020-2023  润新知