element-ios/RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift

96 lines
3.3 KiB
Swift

//
// Copyright 2021-2024 New Vector Ltd.
//
// SPDX-License-Identifier: AGPL-3.0-only
// Please see LICENSE in the repository root for full details.
//
import DesignKit
import SwiftUI
struct AvatarImage: View {
@Environment(\.theme) var theme: ThemeSwiftUI
@EnvironmentObject var viewModel: AvatarViewModel
var mxContentUri: String?
var matrixItemId: String
var displayName: String?
var size: AvatarSize
@State private var avatar: AvatarViewState = .empty
var body: some View {
Group {
switch avatar {
case .empty:
ProgressView()
case .placeholder(let firstCharacter, let colorIndex):
PlaceholderAvatarImage(firstCharacter: firstCharacter,
colorIndex: colorIndex)
case .avatar(let image):
Image(uiImage: image)
.resizable()
}
}
.frame(maxWidth: CGFloat(size.rawValue), maxHeight: CGFloat(size.rawValue))
.clipShape(Circle())
.onAppear {
avatar = viewModel.placeholderAvatar(matrixItemId: matrixItemId,
displayName: displayName,
colorCount: theme.colors.namesAndAvatars.count)
viewModel.loadAvatar(mxContentUri: mxContentUri,
matrixItemId: matrixItemId,
displayName: displayName,
colorCount: theme.colors.namesAndAvatars.count,
avatarSize: size ) { newState in
avatar = newState
}
}
}
}
extension AvatarImage {
init(avatarData: AvatarInputProtocol, size: AvatarSize) {
self.init(
mxContentUri: avatarData.mxContentUri,
matrixItemId: avatarData.matrixItemId,
displayName: avatarData.displayName,
size: size
)
}
}
extension AvatarImage {
func border(color: Color) -> some View {
modifier(BorderModifier(color: color, borderWidth: 3, shape: Circle()))
}
/// Use display name color as border color by default
func border() -> some View {
let borderColor = theme.userColor(for: matrixItemId)
return border(color: borderColor)
}
}
struct AvatarImage_Previews: PreviewProvider {
static let mxContentUri = "fakeUri"
static let name = "Alice"
static var previews: some View {
Group {
HStack {
VStack(alignment: .center, spacing: 20) {
AvatarImage(avatarData: MockAvatarInput.example, size: .xSmall)
AvatarImage(avatarData: MockAvatarInput.example, size: .medium)
AvatarImage(avatarData: MockAvatarInput.example, size: .xLarge)
}
VStack(alignment: .center, spacing: 20) {
AvatarImage(mxContentUri: nil, matrixItemId: name, displayName: name, size: .xSmall)
AvatarImage(mxContentUri: nil, matrixItemId: name, displayName: name, size: .medium)
AvatarImage(mxContentUri: nil, matrixItemId: name, displayName: name, size: .xLarge)
}
}
.environmentObject(AvatarViewModel.withMockedServices())
}
}
}