Initials Placeholder for ChatAvatarView

[martindaum]

What are you trying to achieve?

If there is no image set for an Avatar, I would like to show a placeholder with the initials of the user instead of an avatar placeholder.

If possible, how can you achieve this currently?

I guess I could create a custom view for it and use a custom MessageContentView to inject it

What would be the better way?

The Android SDK falls back to the initials view, so it would be great if the iOS SDK also has the same behaviour.

GetStream Environment

GetStream Chat version: 4.16.0
GetStream Chat frameworks: StreamChat, StreamChatUI
iOS version:
Swift version:
Xcode version:
Device:

Additional context

[b-onc]

Hello @martindaum ,

The "initials as channel avatar" behavior is outdated, our current Design Kit has "merged avatars" as default. You can see it in Swift SDK and React SDK (https://getstream.io/chat/demos/messaging/)

If you want to implement this behavior yourself, you can do so as:

class InitialsChannelAvatarView: ChatChannelAvatarView {
    override func loadMergedAvatars(channel: ChatChannel) {
        // .. get initials from the member
        // assign the avatar
        loadIntoAvatarImageView(from: nil, placeholder: yourNewInitialsImage)
    }
}

and inject your new class via Components

Do you need more help regarding this?

[martindaum]

I would want it in the MessageView, not for the Channel Avatar!

[b-onc]

Ah, thanks for clarifying, I misunderstood.

Indeed it's a missing feature from Swift SDK. We're internally tracking this as CIS-1978.

Meanwhile, you can apply the same logic from my message above, customize MessageContentView.updateContent func to create your initials avatar if the user's avatar is nil and assign it to authorAvatarView

[martindaum]

Okay thanks! I will implement it that way!

[martindaum]

public private(set) var authorAvatarView: ChatAvatarView?

I am not able to set the authorAvatarView because the setter is private. In the samples I have seen you can assign a custom ChatAvatarView to components, but then I am not able to retrieve the name. I am missing something?

[b-onc]

You wouldn't assign authorAvatarView, you'd assign an image to authorAvatarView.imageView.image

[bielikb]

Hi @martindaum,

Im just following up in here. Did your issue got resolved? Or are you still encountering some issues?

Best,
Boris

[martindaum]

Not an ideal solution, because I have to render an image instead of designing a custom view. But as a workaround it would work. It would help if we could inject a custom view for the avatar view (which also has access to content) instead of having to use an image.

[bielikb]

Hey @martindaum,

thanks for the feedback! Ill create an issue internally for us to review this part of our SDK.

Best,
Boris