feat(home): AI 캐릭터 섹션을 연결한다
This commit is contained in:
@@ -225,6 +225,9 @@
|
|||||||
401A3FCE2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
401A3FCE2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
||||||
401A3FCF2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
401A3FCF2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
||||||
401A3FD02FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
401A3FD02FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */; };
|
||||||
|
401A3FD12FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FD42FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift */; };
|
||||||
|
401A3FD22FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FD42FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift */; };
|
||||||
|
401A3FD32FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = 401A3FD42FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift */; };
|
||||||
40235DED2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */; };
|
40235DED2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */; };
|
||||||
40235DEE2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */; };
|
40235DEE2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */; };
|
||||||
40235DF02E37983D00B09A87 /* PersistenceController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEF2E37983D00B09A87 /* PersistenceController.swift */; };
|
40235DF02E37983D00B09A87 /* PersistenceController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 40235DEF2E37983D00B09A87 /* PersistenceController.swift */; };
|
||||||
@@ -1742,6 +1745,7 @@
|
|||||||
401A3FC52FEEB00200A5BBA3 /* MainHomeBannerSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeBannerSection.swift; sourceTree = "<group>"; };
|
401A3FC52FEEB00200A5BBA3 /* MainHomeBannerSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeBannerSection.swift; sourceTree = "<group>"; };
|
||||||
401A3FCC2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeActiveCreatorSection.swift; sourceTree = "<group>"; };
|
401A3FCC2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeActiveCreatorSection.swift; sourceTree = "<group>"; };
|
||||||
401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeRecentDebutCreatorSection.swift; sourceTree = "<group>"; };
|
401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeRecentDebutCreatorSection.swift; sourceTree = "<group>"; };
|
||||||
|
401A3FD42FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainHomeAiCharacterSection.swift; sourceTree = "<group>"; };
|
||||||
40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "RecentContent+CoreDataClass.swift"; sourceTree = "<group>"; };
|
40235DEC2E3797EB00B09A87 /* RecentContent+CoreDataClass.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "RecentContent+CoreDataClass.swift"; sourceTree = "<group>"; };
|
||||||
40235DEF2E37983D00B09A87 /* PersistenceController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PersistenceController.swift; sourceTree = "<group>"; };
|
40235DEF2E37983D00B09A87 /* PersistenceController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PersistenceController.swift; sourceTree = "<group>"; };
|
||||||
40235DF22E37987300B09A87 /* RecentContentService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RecentContentService.swift; sourceTree = "<group>"; };
|
40235DF22E37987300B09A87 /* RecentContentService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RecentContentService.swift; sourceTree = "<group>"; };
|
||||||
@@ -2745,6 +2749,7 @@
|
|||||||
401A3FC52FEEB00200A5BBA3 /* MainHomeBannerSection.swift */,
|
401A3FC52FEEB00200A5BBA3 /* MainHomeBannerSection.swift */,
|
||||||
401A3FCC2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift */,
|
401A3FCC2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift */,
|
||||||
401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */,
|
401A3FCD2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift */,
|
||||||
|
401A3FD42FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift */,
|
||||||
);
|
);
|
||||||
path = Components;
|
path = Components;
|
||||||
sourceTree = "<group>";
|
sourceTree = "<group>";
|
||||||
@@ -5346,6 +5351,7 @@
|
|||||||
401A3FC62FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
401A3FC62FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
||||||
401A3FC92FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
401A3FC92FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
||||||
401A3FCE2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
401A3FCE2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
||||||
|
401A3FD12FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */,
|
||||||
401A3FAA2FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
401A3FAA2FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
||||||
401A3FAB2FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
401A3FAB2FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
||||||
409143302A85652F00EEBFB1 /* CanChargeView.swift in Sources */,
|
409143302A85652F00EEBFB1 /* CanChargeView.swift in Sources */,
|
||||||
@@ -6096,6 +6102,7 @@
|
|||||||
401A3FC72FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
401A3FC72FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
||||||
401A3FCA2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
401A3FCA2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
||||||
401A3FCF2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
401A3FCF2FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
||||||
|
401A3FD22FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */,
|
||||||
401A3FAE2FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
401A3FAE2FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
||||||
401A3FAF2FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
401A3FAF2FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
||||||
B3AF650899B8FC84E0C0CDA0 /* MainPlaceholderTabView.swift in Sources */,
|
B3AF650899B8FC84E0C0CDA0 /* MainPlaceholderTabView.swift in Sources */,
|
||||||
@@ -6873,6 +6880,7 @@
|
|||||||
401A3FC82FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
401A3FC82FEEB00200A5BBA3 /* MainHomeBannerSection.swift in Sources */,
|
||||||
401A3FCB2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
401A3FCB2FEEB00300A5BBA3 /* MainHomeActiveCreatorSection.swift in Sources */,
|
||||||
401A3FD02FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
401A3FD02FEEB00400A5BBA3 /* MainHomeRecentDebutCreatorSection.swift in Sources */,
|
||||||
|
401A3FD32FEEB00500A5BBA3 /* MainHomeAiCharacterSection.swift in Sources */,
|
||||||
401A3FB22FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
401A3FB22FEEAFA000A5BBA3 /* MainHomeRankingView.swift in Sources */,
|
||||||
401A3FB32FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
401A3FB32FEEAFA000A5BBA3 /* MainHomeFollowingView.swift in Sources */,
|
||||||
ACD71056E97E13E48941ABBB /* MainPlaceholderTabView.swift in Sources */,
|
ACD71056E97E13E48941ABBB /* MainPlaceholderTabView.swift in Sources */,
|
||||||
|
|||||||
@@ -3090,7 +3090,58 @@ If you block this user, the following features will be restricted.
|
|||||||
}
|
}
|
||||||
|
|
||||||
static var aiCharacterSectionTitle: String {
|
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 {
|
static var genreCreatorSectionTitle: String {
|
||||||
|
|||||||
@@ -1,6 +1,10 @@
|
|||||||
import SwiftUI
|
import SwiftUI
|
||||||
|
|
||||||
struct AiCharacterCard: View {
|
struct AiCharacterCard: View {
|
||||||
|
static let baseDeviceWidth: CGFloat = 402
|
||||||
|
static let maxCardWidth: CGFloat = 185
|
||||||
|
static let maxCardHeight: CGFloat = 278
|
||||||
|
|
||||||
let name: String
|
let name: String
|
||||||
let description: String
|
let description: String
|
||||||
let profileImageUrl: String?
|
let profileImageUrl: String?
|
||||||
@@ -8,57 +12,100 @@ struct AiCharacterCard: View {
|
|||||||
let originalTitle: String?
|
let originalTitle: String?
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
HStack(alignment: .top, spacing: SodaSpacing.s12) {
|
let cardSize = Self.responsiveSize()
|
||||||
DownsampledKFImage(url: URL(string: profileImageUrl ?? ""), size: CGSize(width: 72, height: 72))
|
|
||||||
.background(Color.gray800)
|
ZStack(alignment: .top) {
|
||||||
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
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)
|
Text(name)
|
||||||
.appFont(.heading4)
|
.appFont(.heading3)
|
||||||
.foregroundColor(.white)
|
.foregroundColor(.white)
|
||||||
.lineLimit(1)
|
.lineLimit(1)
|
||||||
.truncationMode(.tail)
|
.truncationMode(.tail)
|
||||||
|
|
||||||
Text(description)
|
Text(description)
|
||||||
.appFont(.body5)
|
.appFont(.body5)
|
||||||
.foregroundColor(Color.gray500)
|
.foregroundColor(.white)
|
||||||
.lineLimit(2)
|
.lineLimit(2)
|
||||||
.truncationMode(.tail)
|
.truncationMode(.tail)
|
||||||
|
|
||||||
HStack(spacing: SodaSpacing.s8) {
|
if let originalTitle, !originalTitle.isEmpty {
|
||||||
if let chatCount {
|
Text(originalTitle)
|
||||||
Text("Chat \(chatCount)")
|
.appFont(.caption2)
|
||||||
.appFont(.caption2)
|
.foregroundColor(Color.soda300)
|
||||||
.foregroundColor(Color.gray500)
|
.lineLimit(1)
|
||||||
}
|
.truncationMode(.tail)
|
||||||
|
|
||||||
if let originalTitle, !originalTitle.isEmpty {
|
|
||||||
Text(originalTitle)
|
|
||||||
.appFont(.caption2)
|
|
||||||
.foregroundColor(Color.gray500)
|
|
||||||
.lineLimit(1)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.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)
|
.frame(width: cardSize.width, height: cardSize.height)
|
||||||
.background(Color.gray900)
|
|
||||||
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
.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 {
|
struct AiCharacterCard_Previews: PreviewProvider {
|
||||||
static var previews: some View {
|
static var previews: some View {
|
||||||
AiCharacterCard(
|
VStack(spacing: SodaSpacing.s20) {
|
||||||
name: "AI 캐릭터",
|
AiCharacterCard(
|
||||||
description: "캐릭터 설명이 표시됩니다.",
|
name: "캐릭터 이름",
|
||||||
profileImageUrl: nil,
|
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
|
||||||
chatCount: 128,
|
profileImageUrl: "https://picsum.photos/500/500",
|
||||||
originalTitle: "원작"
|
chatCount: 14_000,
|
||||||
)
|
originalTitle: nil
|
||||||
|
)
|
||||||
|
|
||||||
|
AiCharacterCard(
|
||||||
|
name: "캐릭터 이름",
|
||||||
|
description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
|
||||||
|
profileImageUrl: nil,
|
||||||
|
chatCount: 128,
|
||||||
|
originalTitle: "작품 이름"
|
||||||
|
)
|
||||||
|
}
|
||||||
.padding(SodaSpacing.s20)
|
.padding(SodaSpacing.s20)
|
||||||
.background(Color.black)
|
.background(Color.black)
|
||||||
.previewLayout(.sizeThatFits)
|
.previewLayout(.sizeThatFits)
|
||||||
|
|||||||
@@ -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)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -33,20 +33,19 @@ struct MainHomeRecentDebutCreatorSection: View {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private struct MainHomeRecentDebutCreatorItemView: View {
|
private struct MainHomeRecentDebutCreatorItemView: View {
|
||||||
private static let itemWidth: CGFloat = 185
|
|
||||||
private static let itemHeight: CGFloat = 234
|
|
||||||
|
|
||||||
let item: HomeCreatorItem
|
let item: HomeCreatorItem
|
||||||
let action: () -> Void
|
let action: () -> Void
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
|
let itemSize = AiCharacterCard.responsiveSize()
|
||||||
|
|
||||||
Button(action: action) {
|
Button(action: action) {
|
||||||
ZStack(alignment: .bottom) {
|
ZStack(alignment: .bottom) {
|
||||||
DownsampledKFImage(
|
DownsampledKFImage(
|
||||||
url: URL(string: item.creatorProfileImage),
|
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)
|
.background(Color.gray800)
|
||||||
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
||||||
|
|
||||||
@@ -55,7 +54,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
|
|||||||
startPoint: .top,
|
startPoint: .top,
|
||||||
endPoint: .bottom
|
endPoint: .bottom
|
||||||
)
|
)
|
||||||
.frame(height: 80)
|
.frame(height: min(80, itemSize.height))
|
||||||
|
|
||||||
Text(item.creatorNickname)
|
Text(item.creatorNickname)
|
||||||
.appFont(.heading4)
|
.appFont(.heading4)
|
||||||
@@ -65,7 +64,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
|
|||||||
.padding(.horizontal, SodaSpacing.s12)
|
.padding(.horizontal, SodaSpacing.s12)
|
||||||
.padding(.bottom, SodaSpacing.s20)
|
.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))
|
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
||||||
}
|
}
|
||||||
.buttonStyle(.plain)
|
.buttonStyle(.plain)
|
||||||
|
|||||||
@@ -42,6 +42,11 @@ struct MainHomeRecommendationView: View {
|
|||||||
items: viewModel.recommendations?.recentDebutCreators ?? [],
|
items: viewModel.recommendations?.recentDebutCreators ?? [],
|
||||||
onTapCreator: onTapCreator
|
onTapCreator: onTapCreator
|
||||||
)
|
)
|
||||||
|
|
||||||
|
MainHomeAiCharacterSection(
|
||||||
|
items: viewModel.recommendations?.aiCharacters ?? [],
|
||||||
|
onTapCharacter: onTapCharacter
|
||||||
|
)
|
||||||
}
|
}
|
||||||
.padding(.vertical, SodaSpacing.s20)
|
.padding(.vertical, SodaSpacing.s20)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -335,7 +335,7 @@
|
|||||||
|
|
||||||
### Phase 12: AI 캐릭터 섹션 UI
|
### Phase 12: AI 캐릭터 섹션 UI
|
||||||
|
|
||||||
- [ ] **Task 12.1: AI 캐릭터 섹션 작성/보완**
|
- [x] **Task 12.1: AI 캐릭터 섹션 작성/보완**
|
||||||
- 대상 파일:
|
- 대상 파일:
|
||||||
- 생성/보완: `SodaLive/Sources/V2/Main/Home/Recommendation/Components/MainHomeAiCharacterSection.swift`
|
- 생성/보완: `SodaLive/Sources/V2/Main/Home/Recommendation/Components/MainHomeAiCharacterSection.swift`
|
||||||
- 확인/보완: `SodaLive/Sources/V2/Component/Card/AiCharacterCard.swift`
|
- 확인/보완: `SodaLive/Sources/V2/Component/Card/AiCharacterCard.swift`
|
||||||
@@ -477,6 +477,39 @@
|
|||||||
|
|
||||||
## 검증 기록
|
## 검증 기록
|
||||||
|
|
||||||
|
### 2026-06-29 Phase 12 카드 반응형 크기와 채팅 수 표기 보완
|
||||||
|
|
||||||
|
- 목적: AI 캐릭터와 최근 데뷔 크리에이터 썸네일 카드 크기를 `402` 기준으로 보정하고, AI 캐릭터 채팅 수 배지를 다국어 축약 표기로 표시
|
||||||
|
- 수행 내용:
|
||||||
|
- `AiCharacterCard.responsiveSize(deviceWidth:)`를 추가해 최대 `185x278`, 디바이스 폭이 `402`보다 작으면 `deviceWidth / 402` 비율로 축소되도록 구성
|
||||||
|
- `MainHomeRecentDebutCreatorSection`의 아이템도 동일한 responsive size를 사용해 AI 캐릭터 카드와 최대 크기/축소 비율을 맞춤
|
||||||
|
- `I18n.HomeRecommendation.compactChatCount(_:)`를 추가해 한국어/일본어는 `천`, `만`, `억` 계열, 영어는 `K`, `M`, `B` 계열로 표시
|
||||||
|
- 축약 소수는 한 자리까지 표시하고 경계값 반올림으로 단위가 앞당겨지지 않도록 내림 처리
|
||||||
|
- 검증:
|
||||||
|
- `rg -n "responsiveSize|baseDeviceWidth|maxCardWidth|maxCardHeight|compactChatCount|compactEastAsianCount|compactEnglishCount|100_000_000|1_000" SodaLive/Sources/V2 SodaLive/Sources/I18n/I18n.swift` 실행, 반응형 크기와 다국어 축약 로직 확인
|
||||||
|
- `plutil -lint SodaLive.xcodeproj/project.pbxproj` 실행, `OK` 확인
|
||||||
|
- `git diff --check` 실행, 출력 없이 성공 확인
|
||||||
|
- `xcodebuild -workspace "SodaLive.xcworkspace" -scheme "SodaLive-dev" -configuration Debug build` 실행, `BUILD SUCCEEDED` 확인
|
||||||
|
|
||||||
|
|
||||||
|
### 2026-06-29 Phase 12 AI 캐릭터 섹션 구현 완료
|
||||||
|
|
||||||
|
- 목적: V2 Main Home 추천 탭에 Figma `24:5551`, `24:5554` 기준 AI 캐릭터 섹션을 연결
|
||||||
|
- 수행 내용:
|
||||||
|
- `AiCharacterCard`를 Figma 기준 `185x278` 썸네일 카드로 보완하고, `profileImage`, `totalChatCount`, `name`, `description`, `originalWorkTitle` 표시를 반영
|
||||||
|
- `MainHomeAiCharacterSection`을 추가해 `HomeAiCharacterItem.characterId`, `creatorId`, `name`, `description`, `profileImage`, `totalChatCount`, `originalWorkTitle` 기반 가로 카드 목록을 표시
|
||||||
|
- 데이터가 비어 있으면 섹션 제목과 목록을 렌더링하지 않도록 구성
|
||||||
|
- `MainHomeRecommendationView`에서 최근 데뷔 크리에이터 섹션 다음 순서로 AI 캐릭터 섹션을 배치
|
||||||
|
- 신규 `MainHomeAiCharacterSection.swift`를 `SodaLive.xcodeproj/project.pbxproj` 빌드 대상에 포함
|
||||||
|
- `I18n.HomeRecommendation.aiCharacterSectionTitle`의 한국어 문구를 Figma 섹션 제목인 `크리에이터와 이야기를 나눠요!`로 반영
|
||||||
|
- 검증:
|
||||||
|
- Figma `24:5551`, `24:5554` 디자인 컨텍스트와 스크린샷 확인, 섹션 제목/간격 14/리스트 좌측 inset 14/아이템 간격 4/아이템 `185x278` 구조 확인
|
||||||
|
- 구현 전 `xcodebuild -workspace "SodaLive.xcworkspace" -scheme "SodaLive-dev" test` 실행, `Scheme SodaLive-dev is not currently configured for the test action`으로 테스트 액션 미구성 확인
|
||||||
|
- `rg -n "MainHomeAiCharacterSection|AiCharacterCard|aiCharacters|totalChatCount|originalWorkTitle|profileImage|localhost:3845|figma.com" SodaLive/Sources/V2 SodaLive/Sources/I18n/I18n.swift` 실행, 추천 응답 필드 연결 및 forbidden URL 미포함 확인
|
||||||
|
- `plutil -lint SodaLive.xcodeproj/project.pbxproj` 실행, `OK` 확인
|
||||||
|
- `xcodebuild -workspace "SodaLive.xcworkspace" -scheme "SodaLive-dev" -configuration Debug build` 실행, `BUILD SUCCEEDED` 확인
|
||||||
|
|
||||||
|
|
||||||
### 2026-06-29 Phase 12 제외 섹션 반영
|
### 2026-06-29 Phase 12 제외 섹션 반영
|
||||||
|
|
||||||
- 목적: 요구사항 변경에 따라 제외된 추천 섹션 UI 구현 범위를 PRD와 계획 문서에서 제거
|
- 목적: 요구사항 변경에 따라 제외된 추천 섹션 UI 구현 범위를 PRD와 계획 문서에서 제거
|
||||||
|
|||||||
Reference in New Issue
Block a user