feat(home): AI 캐릭터 섹션을 연결한다

This commit is contained in:
Yu Sung
2026-06-29 18:56:35 +09:00
parent 638aa26789
commit 561e991050
7 changed files with 256 additions and 39 deletions

View File

@@ -3090,7 +3090,58 @@ If you block this user, the following features will be restricted.
}
static var aiCharacterSectionTitle: String {
pick(ko: "AI 캐릭터", en: "AI characters", ja: "AIキャラクター")
pick(ko: "크리에이터와 이야기를 나눠요!", en: "AI characters", ja: "AIキャラクター")
}
static func compactChatCount(_ count: Int) -> String {
pick(
ko: compactEastAsianCount(count, tenMillionUnit: "", tenThousandUnit: "", thousandUnit: ""),
en: compactEnglishCount(count),
ja: compactEastAsianCount(count, tenMillionUnit: "", tenThousandUnit: "", thousandUnit: "")
)
}
private static func compactEastAsianCount(
_ count: Int,
tenMillionUnit: String,
tenThousandUnit: String,
thousandUnit: String
) -> String {
if count >= 100_000_000 {
return compactCountValue(count, divisor: 100_000_000, unit: tenMillionUnit)
}
if count >= 10_000 {
return compactCountValue(count, divisor: 10_000, unit: tenThousandUnit)
}
if count >= 1_000 {
return compactCountValue(count, divisor: 1_000, unit: thousandUnit)
}
return count.comma()
}
private static func compactEnglishCount(_ count: Int) -> String {
if count >= 1_000_000_000 {
return compactCountValue(count, divisor: 1_000_000_000, unit: "B")
}
if count >= 1_000_000 {
return compactCountValue(count, divisor: 1_000_000, unit: "M")
}
if count >= 1_000 {
return compactCountValue(count, divisor: 1_000, unit: "K")
}
return count.comma()
}
private static func compactCountValue(_ count: Int, divisor: Int, unit: String) -> String {
let value = floor((Double(count) / Double(divisor)) * 10) / 10
let format = value.truncatingRemainder(dividingBy: 1) == 0 ? "%.0f" : "%.1f"
return String(format: format, locale: Locale(identifier: "en_US_POSIX"), value) + unit
}
static var genreCreatorSectionTitle: String {

View File

@@ -1,6 +1,10 @@
import SwiftUI
struct AiCharacterCard: View {
static let baseDeviceWidth: CGFloat = 402
static let maxCardWidth: CGFloat = 185
static let maxCardHeight: CGFloat = 278
let name: String
let description: String
let profileImageUrl: String?
@@ -8,57 +12,100 @@ struct AiCharacterCard: View {
let originalTitle: String?
var body: some View {
HStack(alignment: .top, spacing: SodaSpacing.s12) {
DownsampledKFImage(url: URL(string: profileImageUrl ?? ""), size: CGSize(width: 72, height: 72))
.background(Color.gray800)
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
let cardSize = Self.responsiveSize()
ZStack(alignment: .top) {
Color.gray900
DownsampledKFImage(
url: URL(string: profileImageUrl ?? ""),
size: CGSize(width: cardSize.width, height: cardSize.width)
)
.frame(width: cardSize.width, height: cardSize.width)
.background(Color.gray800)
LinearGradient(
colors: [Color.gray900.opacity(0), Color.gray900],
startPoint: .top,
endPoint: .bottom
)
.frame(width: cardSize.width, height: cardSize.width)
VStack(alignment: .leading, spacing: SodaSpacing.s6) {
Spacer()
VStack(alignment: .leading, spacing: SodaSpacing.s4) {
Text(name)
.appFont(.heading4)
.appFont(.heading3)
.foregroundColor(.white)
.lineLimit(1)
.truncationMode(.tail)
Text(description)
.appFont(.body5)
.foregroundColor(Color.gray500)
.foregroundColor(.white)
.lineLimit(2)
.truncationMode(.tail)
HStack(spacing: SodaSpacing.s8) {
if let chatCount {
Text("Chat \(chatCount)")
.appFont(.caption2)
.foregroundColor(Color.gray500)
}
if let originalTitle, !originalTitle.isEmpty {
Text(originalTitle)
.appFont(.caption2)
.foregroundColor(Color.gray500)
.lineLimit(1)
}
if let originalTitle, !originalTitle.isEmpty {
Text(originalTitle)
.appFont(.caption2)
.foregroundColor(Color.soda300)
.lineLimit(1)
.truncationMode(.tail)
}
}
.frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .bottomLeading)
.padding(.horizontal, SodaSpacing.s12)
.padding(.bottom, SodaSpacing.s20)
Spacer(minLength: 0)
if let chatCount {
HStack(spacing: 2) {
Image(systemName: "bubble.fill")
.font(.system(size: 14, weight: .medium))
.foregroundColor(.white)
Text(I18n.HomeRecommendation.compactChatCount(chatCount))
.appFont(.body5)
.foregroundColor(Color.gray100)
}
.padding(.horizontal, SodaSpacing.s4)
.padding(.vertical, 2)
.background(Color.black.opacity(0.6))
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s4, style: .continuous))
.frame(maxWidth: .infinity, alignment: .trailing)
.padding(.top, SodaSpacing.s6)
.padding(.trailing, SodaSpacing.s6)
}
}
.padding(SodaSpacing.s12)
.background(Color.gray900)
.frame(width: cardSize.width, height: cardSize.height)
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
}
static func responsiveSize(deviceWidth: CGFloat = UIScreen.main.bounds.width) -> CGSize {
let scale = min(deviceWidth / baseDeviceWidth, 1)
return CGSize(width: maxCardWidth * scale, height: maxCardHeight * scale)
}
}
struct AiCharacterCard_Previews: PreviewProvider {
static var previews: some View {
AiCharacterCard(
name: "AI 캐릭터",
description: "캐릭터 설명이 표시됩니다.",
profileImageUrl: nil,
chatCount: 128,
originalTitle: "원작"
)
VStack(spacing: SodaSpacing.s20) {
AiCharacterCard(
name: "캐릭터 이름",
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
profileImageUrl: "https://picsum.photos/500/500",
chatCount: 14_000,
originalTitle: nil
)
AiCharacterCard(
name: "캐릭터 이름",
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
profileImageUrl: nil,
chatCount: 128,
originalTitle: "작품 이름"
)
}
.padding(SodaSpacing.s20)
.background(Color.black)
.previewLayout(.sizeThatFits)

View File

@@ -0,0 +1,74 @@
import SwiftUI
struct MainHomeAiCharacterSection: View {
let items: [HomeAiCharacterItem]
let onTapCharacter: (Int) -> Void
init(
items: [HomeAiCharacterItem],
onTapCharacter: @escaping (Int) -> Void = { _ in }
) {
self.items = items
self.onTapCharacter = onTapCharacter
}
var body: some View {
if !items.isEmpty {
VStack(alignment: .leading, spacing: SodaSpacing.s14) {
SectionTitle(title: I18n.HomeRecommendation.aiCharacterSectionTitle)
ScrollView(.horizontal, showsIndicators: false) {
LazyHStack(alignment: .center, spacing: SodaSpacing.s4) {
ForEach(items, id: \.self) { item in
Button {
onTapCharacter(item.characterId)
} label: {
AiCharacterCard(
name: item.name,
description: item.description,
profileImageUrl: item.profileImage,
chatCount: item.totalChatCount,
originalTitle: item.originalWorkTitle
)
}
.buttonStyle(.plain)
}
}
.padding(.horizontal, SodaSpacing.s14)
}
}
}
}
}
struct MainHomeAiCharacterSection_Previews: PreviewProvider {
private static let previewImageUrl = "https://picsum.photos/500/500"
static var previews: some View {
MainHomeAiCharacterSection(
items: [
HomeAiCharacterItem(
characterId: 1,
creatorId: 10,
name: "캐릭터 이름",
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
profileImage: previewImageUrl,
totalChatCount: 14_000,
originalWorkTitle: nil
),
HomeAiCharacterItem(
characterId: 2,
creatorId: 11,
name: "캐릭터 이름",
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
profileImage: previewImageUrl,
totalChatCount: 128,
originalWorkTitle: "작품 이름"
)
]
)
.padding(.vertical, SodaSpacing.s20)
.background(Color.black)
.previewLayout(.sizeThatFits)
}
}

View File

@@ -33,20 +33,19 @@ struct MainHomeRecentDebutCreatorSection: View {
}
private struct MainHomeRecentDebutCreatorItemView: View {
private static let itemWidth: CGFloat = 185
private static let itemHeight: CGFloat = 234
let item: HomeCreatorItem
let action: () -> Void
var body: some View {
let itemSize = AiCharacterCard.responsiveSize()
Button(action: action) {
ZStack(alignment: .bottom) {
DownsampledKFImage(
url: URL(string: item.creatorProfileImage),
size: CGSize(width: Self.itemWidth, height: Self.itemHeight)
size: itemSize
)
.frame(width: Self.itemWidth, height: Self.itemHeight)
.frame(width: itemSize.width, height: itemSize.height)
.background(Color.gray800)
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
@@ -55,7 +54,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
startPoint: .top,
endPoint: .bottom
)
.frame(height: 80)
.frame(height: min(80, itemSize.height))
Text(item.creatorNickname)
.appFont(.heading4)
@@ -65,7 +64,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
.padding(.horizontal, SodaSpacing.s12)
.padding(.bottom, SodaSpacing.s20)
}
.frame(width: Self.itemWidth, height: Self.itemHeight)
.frame(width: itemSize.width, height: itemSize.height)
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
}
.buttonStyle(.plain)

View File

@@ -42,6 +42,11 @@ struct MainHomeRecommendationView: View {
items: viewModel.recommendations?.recentDebutCreators ?? [],
onTapCreator: onTapCreator
)
MainHomeAiCharacterSection(
items: viewModel.recommendations?.aiCharacters ?? [],
onTapCharacter: onTapCharacter
)
}
.padding(.vertical, SodaSpacing.s20)
}