IM群聊头像九宫格实现方式

最新推荐文章于 2023-06-07 14:37:38 发布

原创

最新推荐文章于 2023-06-07 14:37:38 发布 · 5k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#IM #九宫格 #群聊

本文介绍了在IM项目中实现群聊头像九宫格的方法，包括创建ContentView显示头像布局，循环加载头像并添加，以及在所有头像加载完毕后通过画布生成并上传九宫格图片。当群成员变化时需根据需求判断更新九宫格。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近一直在做与IM相关的项目，所以就遇到了群聊头像九宫格的问题。

具体思路：
1：创建ContentView：vi用来显示九宫格头像布局。
2：循环加载头像并添加到vi布局中。
3：在所有头像全部加载完成后开启画布获取九宫格头像排布Image，返回显示上传到服务器一劳永逸。（注：群成员发生改变时需要注意根据自己的需求判断是否更新九宫格图片）

class func creatGroupAvatar(avatars: [String], finished: @escaping (_ data: UIImage?) -> ()) {
        let viewWidth: CGFloat = 60

        let avatarCount = avatars.count > 4 ? 4:avatars.count
        let avatarWidth = viewWidth * 0.5 * 0.85
        let space_twoAvatar = (viewWidth - avatarWidth * 2) / 3 //一行两个头像的间距
        let space_avatar = (viewWidth - avatarWidth) * 0.5 //一行只有一个头像的间距

        var x = avatarCount % 2 ==