QQ的聊天界面搭建

QQ聊天的简单的界面的搭建:

1.设置聊天界面的tableView

#pragma mark 设置tableview

- (void)settingTableView {

self.tableView.backgroundColor = [UIColor colorWithRed:220/255.0 green:220/255.0 blue:220/255.0 alpha:1];

self.tableView.dataSource = self;

self.tableView.delegate = self;

// 取消分割线

self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;

// 取消选中

self.tableView.allowsSelection = NO;

}

2.监听键盘的弹出(通知机制)

// 监听键盘弹出

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(KeyboardWillChangeFrameNotification:) name:UIKeyboardWillChangeFrameNotification object:nil];

#pragma mark 弹出或隐藏键盘调用的方法

- (void)KeyboardWillChangeFrameNotification:(NSNotification *)noti {

// 获取键盘信息

NSDictionary *dict = noti.userInfo;

// 获取当前键盘的frame

CGRect keyBoardFrame = [dict[UIKeyboardFrameEndUserInfoKey] CGRectValue];

// 计算键盘移动的距离

CGFloat moveY = keyBoardFrame.origin.y - self.view.bounds.size.height;

// 移动transform

self.view.transform = CGAffineTransformMakeTranslation(0, moveY);

// 滚动到最后一行

NSIndexPath *indexPath = [NSIndexPath indexPathForRow:self.frameArr.count - 1 inSection:0];

[self.tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionBottom animated:YES];

}

3.点击发送按钮的事件

#pragma mark 点击发送事件的通知

- (BOOL)textFieldShouldReturn:(UITextField *)textField {

// 添加cell

[self addMessageWithText:textField.text andMessageType:WDJMessagesTypeMe];

[self addMessageWithText:@"洗洗睡吧" andMessageType:WDJMessagesTypeOther];

// 清空textField内容

textField.text = nil;

return YES;

}

3.1 封装点击发送按钮后的tableView展示界面中添加cell的方法

// 封装添加cell的方法

- (void)addMessageWithText:(NSString *)text andMessageType:(WDJMessagesType)type {

// 设置模型

WDJMessages *message = [[WDJMessages alloc] init];

// 设置属性

NSDate *date = [NSDate date];

// 时间格式

NSDateFormatter *gs = [[NSDateFormatter alloc] init];

gs.dateFormat = @"yyyy-MM-dd HH-mm";

NSString *dateName = [gs stringFromDate:date];

message.time = dateName;

message.text = text;

message.type = type;

// 取出上一个模型

WDJMessageFrame *lastFrame = [self.frameArr lastObject];

message.hide = [lastFrame.message.time isEqualToString:message.time];

// 设置frame模型

WDJMessageFrame *frame = [[WDJMessageFrame alloc] init];

frame.message = message;

// 添加到数组模型中

[self.frameArr addObject:frame];

// 刷新数据

[self.tableView reloadData];

// 添加到最后一行

NSIndexPath *indexPath = [NSIndexPath indexPathForRow:self.frameArr.count -1 inSection:0];

[self.tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionBottom animated:YES];

}

4.设置文本输入框

#pragma mark 文本输入框

- (void)settingTextField {

// 设置占位

UIView *view = [[UIView alloc] init];

view.frame = CGRectMake(0, 0, 8, 0);

self.textField.leftView = view;

// 设置左占位的显示模式

self.textField.leftViewMode = UITextFieldViewModeAlways;

// 设置代理

self.textField.delegate = self;

}

时间: 2025-01-04 15:17:02

QQ的聊天界面搭建的相关文章

android 仿QQ气泡聊天界面

1.现在的QQ,微信等一些APP的聊天界面都是气泡聊天界面,左边是接收到的消息,右边是发送的消息, 这个效果其实就是一个ListView在加载它的Item的时候,分别用了不同的布局xml文件. 2.效果图(其中的聊天信息框是采用了.9.png的图片): 3.对中间聊天的的listView进行说明: 左边Item的xml文件效果如下: 右边Item的xml文件效果如下: 4.在加载ListView当中重写getView()方法,通过判断消息传入类型,来使item加载哪一个xml文件: 自定义ada

如何实现手机端点击链接跳转到手机QQ打开聊天界面

我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是比较关键的,我们需要新建一个POP.JS脚本文件,我们也可以把下面的代码加入到网站已有的JS文件中. 1 var qq_chat = true; 2 function PlayJsAdPopWin() { 3 if (qq_chat) { 4 popwin = window.location.hre

QQ音乐界面搭建以及部分功能的实现(纯代码)

这两天自己在试着做一个QQ音乐的界面搭建,以及部分功能的实现,因为还没学系线程等高级的内容,现在只是简单的搭建一些构架,也算是为以后做准备. 界面完成后能够实现收藏事件的发生,图片的切换,但是还不能够播放多首歌曲,正在完善中,现在只能播放一首歌曲,能够点击中间图片时,让上下两个VIEW实现动画状态的隐藏和显现,点击下一首歌曲时,能够实现图片以及歌名,歌手的切换,还有滚动条也能够实现.左边的时间能够准确计数,而右边的还没有实现,,点击播放暂停按钮时能够实现按钮形态的改变,暂时功能就这么多. 接下来

【iOS基础控件 - 11】【Demo】模仿qq ,微信 UI 聊天界面

A.需求 做出一个类似于QQ.微信的聊天界面 1.每个cell包含发送时间.发送人(头像).发送信息 2.使用对方头像放在左边,我方头像在右边 3.对方信息使用白色背景对话框,我方信息使用蓝色背景对话框 4.隐藏相同的发送时间 5.底部功能按钮:语音按钮.消息输入框.表情按钮.附加按钮 6.响应键盘事件,呼出键盘.隐藏键盘时对上述的视图作出上移操作 7.键盘的发送事件处理 Code Source: B.实现点 1.底层视图搭建 上部分聊天信息框:UITableView 下部分功能区:UIButt

Android,iOS打开手机QQ与指定用户聊天界面

在浏览器中可以通过JS代码打开QQ并弹出聊天界面,一般作为客服QQ使用.而在移动端腾讯貌似没有公布提供类似API,但是却可以使用schema模式来启动手机QQ. 以下为具体代码: Android: String url="mqqwpa://im/chat?chat_type=wpa&uin=123456"; startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url))); iOS: UIWebView *webView

Objective-c——UI基础开发第八天(QQ聊天界面)

一.知识点: QQ聊天界面 双模型的使用(dataModel和frameModel) UITextField的使用 通知的使用 拉伸图片的两种方法(slicing/image对象的resizeableImageWithCapInsets属性) 枚举 方法的抽取(相同的拿出,不同的部分作为参数) 二.设置tableview的基本格式 1)定义tableview基本 numberOfSectionsInTableView:设置块 numberOfRowsInSection:设置每块对应的行数 cel

亲身体验用Java写的仿qq聊天界面

Java开发工具有许多种,新手用记事本写Java程序,有些人用NetBean,jbuilder,高手用eclipse,下面介绍用eclipse开发qq聊天界面. 代码如下: package Myjava_QQ; import java.awt.*; import javax.swing.*; import Myjava_QQ.truess; import java.awt.event.*; import java.applet.*; import java.io.BufferedReader;

【3】QQ 聊天界面

1.说明 稍微修改了下QQ示例里面的聊天界面界面,然后把代码扣过来完成了QQ聊天界面部分,效果还可以. 2.代码部分 // QQTalk.h文件 #ifndef __QQ_TALK_H__ #define __QQ_TALK_H__ #include <DuiLib/DuiLibEnv.h> #include <DuiLib/UIlib.h> using namespace DuiLib; #define QQ_TALK_XML _T("chatbox.xml"

基于Qt的类QQ气泡聊天的界面开发

最近在写IM 聊天界面,想设计出一个类似QQ气泡聊天的样式 使用了几种办法 1:使用Qt下面的QListview来实现QQ类似效果,差强人意 2:使用QWebview加载html css样式来完成,发现效果不错,但是毕竟webview占用巨大的内存 3:使用QTextBrower加载css,但是好像只支持css2.1版本,css3完全不支持,这样的话,花哨的样式应该是无法实现 基于以上三种思路 最后发现还是QML实现比较好,但是qml基于文本与动画图片混合显示没找到好的办法,有好的办法的希望可以