【集成教程】环信Android UI库导入并实现一些基础功能
EaseIMKit 是什么?
EaseIMKit 是基于环信 IM SDK 的一款 UI 组件库,它提供了一些通用的 UI 组件,例如‘会话列表’、‘聊天界面’和‘联系人列表’等,开发者可根据实际业务需求通过该组件库快速地搭建自定义 IM 应用。EaseIMKit 中的组件在实现 UI 功能的同时,调用 IM SDK 相应的接口实现 IM 相关逻辑和数据的处理,因而开发者在使用EaseIMKit 时只需关注自身业务或个性化扩展即可。
下面详细教大家如何导入环信UI库并实现以下基础功能。
一、 如何修改会话列表(ConversationListFragment)的整体样式
二、如何修改会话条目大标题颜色和小标题颜色
三、如何去掉发送语音时未读的红色圆点
四、如何修改emoji图片
五、如何修改名片消息ui布局
六、发送视频更改ui布局
七、如何修改会话条目分割线宽高
八、如何修改气泡颜色
导入
如果是刚开始集成的小伙伴,建议把sdk的版本号和ui库的版本号保持一致
1.首先我们打开环信Android端文档,点击Easeimkit使用指南
![](https://www.imgeek.org/uploads/article/20220711/35b2e4f702c40684bfe78d6e7b83a45a.png)
2.在简介下方有EaseIMKit源码地址
![](https://www.imgeek.org/uploads/article/20220711/5ea73be6506dab6e7d0bba901739c35a.png)
3.Github地址上点击tags,我们来找自己对应的版本号
![](https://www.imgeek.org/uploads/article/20220711/dddf562100f3159e5597d42898fd7ab4.png)
4.点击我们sdk对应的版本号进行下载
![](https://www.imgeek.org/uploads/article/20220711/85ad08bd4e83cfba2ee1fc6dc4edba7c.png)
5.以moudel的形式将easeimkit ui库导入
![](https://www.imgeek.org/uploads/article/20220711/8a2a340b555ced4468f3e8b0c53064b9.png)
6.修改build.gradle中的远程库,红色圈中正常我们不引入ui库的话就是需要将注释的依赖正常打开,如果我们导入ui库格式应
api (project(path: ':ease-im-kit'))
黄色方圈中为Easemob的SDK的依赖
![](https://www.imgeek.org/uploads/article/20220711/da59e723a32a99797c6ea8d0d49ffff6.png)
7.将settings.gradle 的
include ':ease-im-kit'
设置上去
![](https://www.imgeek.org/uploads/article/20220711/c33484aa81006c7de9418fad51048a84.png)
8.导入成功我们就可以看到这个就大功告成了
![](https://www.imgeek.org/uploads/article/20220711/902816473eba90888bf0c64fe40031a8.png)
实现基础功能
一、 如何修改会话列表(ConversationListFragment)的整体样式
按照个人需求自定义添加背景即可
(ease_conversation_list)
![](https://www.imgeek.org/uploads/article/20220711/5c84a3c5f533bf87dfe237d1f383ea0a.png)
二、如何修改会话条目大标题颜色和小标题颜色(EaseConversationListLayout)
此标题控制的是会话条目上面的大标题和小的文本内容,上方包含用户的昵称下方包含用户聊天内容,具体参考注释处自定义更改
![](https://www.imgeek.org/uploads/article/20220711/0bb9e03911806724079bdc8b690eacff.png)
三、如何去掉发送语音时未读的红色圆点里面也同时包含了发送语音的背景颜色以及样式可以个性化的进行修改
接收方为(ease_row_received_voice) 发送方(ease_rwo_sent_voice)
![](https://www.imgeek.org/uploads/article/20220711/ed10ea98789d6b51afe05c6ac3e3212b.png)
四、如何修改emoji图片
EaseDefaultEmojiconDatas
五、如何修改名片消息ui布局
demo_activity_send_user_card为发送方
![](https://www.imgeek.org/uploads/article/20220711/b539a7d96fc40e02c799ab3a8c531f49.png)
六、发送视频更改ui布局
发送方:ease_row_sent_video 接收方:ease_row_received_video
![](https://www.imgeek.org/uploads/article/20220711/f6b2dd3bdccba3a38272725e4e55eb45.png)
七、如何修改会话条目分割线宽高
ease_item_row_chat_history
![](https://www.imgeek.org/uploads/article/20220711/4e94dcb421a13be850a83baee40f0f7c.png)
八、如何修改气泡颜色
接收方ease_row_received_message ,发送方ease_row_sent_message
![](https://www.imgeek.org/uploads/article/20220711/9ee487ae86b3832ccf5edffef8c057c7.png)