GithubHelp home page GithubHelp logo

tml007 / cdchatlist Goto Github PK

View Code? Open in Web Editor NEW

This project forked from 1275053499/cdchatlist

0.0 2.0 0.0 86.4 MB

A smooth,emoji / picture supported chatlist

License: MIT License

Ruby 0.47% C 0.19% Objective-C 99.00% Shell 0.34%

cdchatlist's Introduction

CDChatList

CI Status Version License Platform

                       

高性能的聊天页面解决方案 对聊天列表的高度封装,可灵活配置页面样式

聊天界面其实大同小异,所以这里封装了一个聊天的组件,使用CoreText和手动代码布局,尽量实现简单,通用,高效,易于维护。

项目结构

CDChatListView: UITableView 视图,聊天页面主体

CDBaseMsgCell: 实现消息气泡基本视图

CDTextTableViewCell、CDImageTableViewCell、CDAudioTableViewCell: 继承自CDBaseMsgCell,实现响应功能。

CDSystemTableViewCell: 特殊消息气泡,实现系统通知

CellCaculator: tableview布局计算,并提前渲染cell

ChatConfiguration: chatlist配置类组,UI定制,及资源等

子组件

CDLabel: 富文本标签

CDChatInputBox: 输入框封装组件

安装

支持至iOS 11

有时候需要清一下cocoapods的缓存,pod cache clean --all

pod 'CDChatList'
#import <CDChatList/CDChatList.h>

使用

配置 CDChatList

ChatHelpr负责ChatHelpr的UI配置,及组件的资源文件设置

UI配置及资源文件都有默认,所以无需自定义的话,就可以跳过组件的配置

具体详情可以看demo

添加 CDChatList 视图

CDChatListView *list = [[CDChatListView alloc] initWithFrame:self.view.bounds];
list.msgDelegate = self;
self.listView = list;
[self.view addSubview:self.listView];

CDChatList会将视图控制器automaticallyAdjustsScrollViewInsets及contentInsetAdjustmentBehavior设为NO及Never,并适应导航栏高度

消息模型 MessageModalProtocal

聊天组件提供了一个写好的消息Model:CDMessageModel

也可以使用自己的消息模型,实现相关的解析方法,

不管什么消息模型,都需遵守MessageModalProtocal,实现相关属性

组件事件 ChatListProtocol

从聊天组件触发的消息

消息列表请求加载更多消息

-(void)chatlistLoadMoreMsg: (CDChatMessage)topMessage callback: (void(^)(CDChatMessageArray))finnished;

消息气泡上的的点击事件

-(void)chatlistClickMsgEvent: (ChatListInfo *)listInfo;

调用聊天组件功能

添加新的数据到底部

-(void)addMessagesToBottom: (CDChatMessageArray)newBottomMsgArr;

更新数据源中的某条消息模型(主要是为了更新UI上的消息状态)

-(void)updateMessage:(CDChatMessage)message;

使用场景

收/发消息

//
{
	MessageModal *modal;
}
-(void)send{
	modal = [[MessageModal alloc] init];
	modal.msgState = CDMessageStateSending;
	modal.createTime = ...;
	modal.msg = ...;
	modal.msgType = ...;
	[chatList addMessagesToBottom: modal];
}

-(void)sendCallBack:(BOOL)isSuccess{
	modal.msgState = isSuccess;  // 此处应处理成枚举
	[chatList updateMessage: modal];
}

//
-(void)receivedNewMessage:(MessageModal *)modal{
	[chatList addMessagesToBottom: modal];
}

下拉加载更多消息

消息列表被下拉时,触发此回调

-(void)chatlistLoadMoreMsg: (CDChatMessage)topMessa callback: (void(^)(CDChatMessageArray))finnished
{
	// 根据topMessage 获取更多消息
	NSArray *msgArr = [self getMoreMessageFrom: topMessage amount: 10];
	callback(msgArr);
}

消息点击事件

目前消息体重处理了 文本点击 及 图片点击 事件

-(void)chatlistClickMsgEvent: (ChatListInfo *)listInfo{
	if (listInfo.eventType == ChatClickEventTypeTEXT){
		// 点击的文本
		listInfo.clickedText
		// 点击的文字位置  防止有相同的可点击文字
		listInfo.range
		// 被点击文本的隐藏信息   e.g.  <a title="转人工" href="doTransfer">
		listInfo.clickedTextContent
	} else if (listInfo.eventType == ChatClickEventTypeIMAGE){
		// 图片
		listInfo.image
		// 图片在tableview中的位置
		listInfo.msgImageRectInTableView
	}
}

TODO

  • 自定义消息气泡扩展

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.