feat(creator): 오디오 섹션을 연결한다

This commit is contained in:
Yu Sung
2026-07-03 14:34:27 +09:00
parent 0775b17fd4
commit 32174cd0af
6 changed files with 263 additions and 38 deletions

View File

@@ -37,6 +37,12 @@
CC0101182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift */; };
CC0102182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift */; };
CC0103182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift */; };
CC0101192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift */; };
CC0102192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift */; };
CC0103192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift */; };
CC01011A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC01001A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift */; };
CC01021A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC01001A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift */; };
CC01031A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC01001A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift */; };
CC0101082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; };
CC0102082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; };
CC0103082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; };
@@ -1766,6 +1772,8 @@
CC0100162FF0100000A5BBA3 /* CreatorChannelDonationSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelDonationSection.swift; sourceTree = "<group>"; };
CC0100172FF0100000A5BBA3 /* CreatorChannelNoticeSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelNoticeSection.swift; sourceTree = "<group>"; };
CC0100182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelScheduleSection.swift; sourceTree = "<group>"; };
CC0100192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelAudioContentListItem.swift; sourceTree = "<group>"; };
CC01001A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelAudioSection.swift; sourceTree = "<group>"; };
0BBDC3ECBBE049EAA4057D3A /* PostChannelDonationRequest.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = PostChannelDonationRequest.swift; sourceTree = "<group>"; };
0EC05859619BDC03056911E7 /* MainTab.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = MainTab.swift; sourceTree = "<group>"; };
189350EA101CF12EEBA6EC1D /* MainTabBarView.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = MainTabBarView.swift; sourceTree = "<group>"; };
@@ -2690,6 +2698,8 @@
CC0100162FF0100000A5BBA3 /* CreatorChannelDonationSection.swift */,
CC0100172FF0100000A5BBA3 /* CreatorChannelNoticeSection.swift */,
CC0100182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift */,
CC0100192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift */,
CC01001A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift */,
);
path = Components;
sourceTree = "<group>";
@@ -5629,6 +5639,8 @@
CC0101162FF0100000A5BBA3 /* CreatorChannelDonationSection.swift in Sources */,
CC0101172FF0100000A5BBA3 /* CreatorChannelNoticeSection.swift in Sources */,
CC0101182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */,
CC0101192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */,
CC01011A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */,
CC0101082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */,
CC0101112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */,
CC0101122FF0100000A5BBA3 /* CreatorChannelHeaderSection.swift in Sources */,
@@ -6431,6 +6443,8 @@
CC0102162FF0100000A5BBA3 /* CreatorChannelDonationSection.swift in Sources */,
CC0102172FF0100000A5BBA3 /* CreatorChannelNoticeSection.swift in Sources */,
CC0102182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */,
CC0102192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */,
CC01021A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */,
CC0102082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */,
CC0102112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */,
CC0102122FF0100000A5BBA3 /* CreatorChannelHeaderSection.swift in Sources */,
@@ -7249,6 +7263,8 @@
CC0103162FF0100000A5BBA3 /* CreatorChannelDonationSection.swift in Sources */,
CC0103172FF0100000A5BBA3 /* CreatorChannelNoticeSection.swift in Sources */,
CC0103182FF0100000A5BBA3 /* CreatorChannelScheduleSection.swift in Sources */,
CC0103192FF0100000A5BBA3 /* CreatorChannelAudioContentListItem.swift in Sources */,
CC01031A2FF0100000A5BBA3 /* CreatorChannelAudioSection.swift in Sources */,
CC0103082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */,
CC0103112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */,
CC0103122FF0100000A5BBA3 /* CreatorChannelHeaderSection.swift in Sources */,

View File

@@ -0,0 +1,157 @@
import SwiftUI
struct CreatorChannelAudioContentListItem: View {
let audioContent: CreatorChannelAudioContentResponse
let action: () -> Void
init(
audioContent: CreatorChannelAudioContentResponse,
action: @escaping () -> Void = {}
) {
self.audioContent = audioContent
self.action = action
}
var body: some View {
Button(action: action) {
HStack(alignment: .center, spacing: SodaSpacing.s14) {
thumbnail
VStack(alignment: .leading, spacing: 2) {
Text(audioContent.title)
.appFont(size: 16, weight: .bold)
.foregroundColor(.white)
.lineLimit(1)
.truncationMode(.tail)
if !subtitle.isEmpty {
Text(subtitle)
.appFont(size: 14, weight: .medium)
.foregroundColor(Color.gray500)
.lineLimit(1)
.truncationMode(.tail)
}
}
.frame(maxWidth: .infinity, alignment: .leading)
}
.frame(width: 346, alignment: .leading)
}
.buttonStyle(.plain)
}
private var subtitle: String {
[audioContent.duration, audioContent.seriesName]
.compactMap { value in
guard let value, !value.isEmpty else { return nil }
return value
}
.joined(separator: "")
}
private var thumbnail: some View {
ZStack(alignment: .topLeading) {
DownsampledKFImage(
url: audioContent.imageUrl.flatMap(URL.init(string:)),
size: CGSize(width: 88, height: 88)
)
.background(Color.gray800)
VStack(alignment: .leading, spacing: 0) {
topTagList
Spacer(minLength: 0)
bottomTagList
}
}
.frame(width: 88, height: 88)
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
}
@ViewBuilder
private var topTagList: some View {
HStack(spacing: 0) {
if audioContent.isOriginalSeries == true {
CreatorChannelAudioImageTag(imageName: "ic_content_tag_original")
}
if audioContent.isFirstContent {
CreatorChannelAudioFirstTag()
}
}
}
@ViewBuilder
private var bottomTagList: some View {
HStack(spacing: 0) {
if audioContent.isPointAvailable {
CreatorChannelAudioImageTag(imageName: "ic_content_tag_point")
}
if audioContent.price == 0 {
CreatorChannelAudioFreeTag()
}
}
}
}
struct CreatorChannelAudioImageTag: View {
let imageName: String
var body: some View {
Image(imageName)
.resizable()
.scaledToFit()
.frame(width: 24, height: 24)
}
}
struct CreatorChannelAudioFirstTag: View {
var body: some View {
ZStack {
Color(hex: "FF34B8")
Image("ic_content_tag_first_star")
.resizable()
.scaledToFit()
.padding(SodaSpacing.s4)
}
.frame(width: 24, height: 24)
}
}
struct CreatorChannelAudioFreeTag: View {
var body: some View {
Text("무료")
.appFont(size: 14, weight: .semibold)
.foregroundColor(.white)
.lineLimit(1)
.padding(SodaSpacing.s4)
.frame(height: 24)
.background(Color.soda900)
}
}
struct CreatorChannelAudioContentListItem_Previews: PreviewProvider {
static var previews: some View {
CreatorChannelAudioContentListItem(
audioContent: CreatorChannelAudioContentResponse(
audioContentId: 1,
title: "콘텐츠 이름이 한 줄 콘텐츠 이름이 한 줄 콘텐츠 이름이 한 줄",
duration: "3:00",
imageUrl: "https://picsum.photos/300/300",
price: 0,
isAdult: false,
isPointAvailable: true,
isFirstContent: true,
seriesName: "시리즈 이름",
isOriginalSeries: true,
isOwned: false,
isRented: false
)
)
.padding(SodaSpacing.s14)
.background(Color.black)
.previewLayout(.sizeThatFits)
}
}

View File

@@ -0,0 +1,83 @@
import SwiftUI
struct CreatorChannelAudioSection: View {
let audioContents: [CreatorChannelAudioContentResponse]
let onSelectTab: (CreatorChannelTab) -> Void
let onTapContent: (Int) -> Void
private let homeVisibleCount = 9
private let itemsPerColumn = 3
init(
audioContents: [CreatorChannelAudioContentResponse],
onSelectTab: @escaping (CreatorChannelTab) -> Void,
onTapContent: @escaping (Int) -> Void = { _ in }
) {
self.audioContents = audioContents
self.onSelectTab = onSelectTab
self.onTapContent = onTapContent
}
var body: some View {
if audioContents.isEmpty == false {
VStack(alignment: .leading, spacing: SodaSpacing.s14) {
SectionTitle(title: I18n.CreatorChannelHome.audio) {
onSelectTab(.audio)
}
ScrollView(.horizontal, showsIndicators: false) {
HStack(alignment: .top, spacing: SodaSpacing.s8) {
ForEach(audioContentColumns.indices, id: \.self) { index in
VStack(alignment: .leading, spacing: SodaSpacing.s8) {
ForEach(audioContentColumns[index]) { audioContent in
CreatorChannelAudioContentListItem(audioContent: audioContent) {
onTapContent(audioContent.audioContentId)
}
}
}
}
}
.padding(.leading, SodaSpacing.s14)
.padding(.trailing, SodaSpacing.s20)
}
}
.padding(.top, SodaSpacing.s20)
}
}
private var visibleAudioContents: [CreatorChannelAudioContentResponse] {
Array(audioContents.prefix(homeVisibleCount))
}
private var audioContentColumns: [[CreatorChannelAudioContentResponse]] {
stride(from: 0, to: visibleAudioContents.count, by: itemsPerColumn).map { index in
Array(visibleAudioContents[index..<min(index + itemsPerColumn, visibleAudioContents.count)])
}
}
}
struct CreatorChannelAudioSection_Previews: PreviewProvider {
static var previews: some View {
CreatorChannelAudioSection(
audioContents: (1...9).map { index in
CreatorChannelAudioContentResponse(
audioContentId: index,
title: "콘텐츠 이름이 한 줄 콘텐츠 이름이 한 줄 콘텐츠 이름이 한 줄",
duration: "3:00",
imageUrl: "https://picsum.photos/300/300?\(index)",
price: index.isMultiple(of: 2) ? 0 : 10,
isAdult: false,
isPointAvailable: index.isMultiple(of: 3),
isFirstContent: index.isMultiple(of: 2),
seriesName: index == 3 ? "시리즈 이름" : nil,
isOriginalSeries: index == 3,
isOwned: false,
isRented: false
)
},
onSelectTab: { _ in }
)
.background(Color.black)
.previewLayout(.sizeThatFits)
}
}

View File

@@ -114,43 +114,6 @@ private struct CreatorChannelLatestAudioCard: View {
}
}
private struct CreatorChannelAudioImageTag: View {
let imageName: String
var body: some View {
Image(imageName)
.resizable()
.scaledToFit()
.frame(width: 24, height: 24)
}
}
private struct CreatorChannelAudioFirstTag: View {
var body: some View {
ZStack {
Color(hex: "FF34B8")
Image("ic_content_tag_first_star")
.resizable()
.scaledToFit()
.padding(SodaSpacing.s4)
}
.frame(width: 24, height: 24)
}
}
private struct CreatorChannelAudioFreeTag: View {
var body: some View {
Text("무료")
.appFont(size: 14, weight: .semibold)
.foregroundColor(.white)
.lineLimit(1)
.padding(SodaSpacing.s4)
.frame(height: 24)
.background(Color.soda900)
}
}
struct CreatorChannelLatestAudioSection_Previews: PreviewProvider {
static var previews: some View {
CreatorChannelLatestAudioSection(

View File

@@ -48,6 +48,12 @@ struct CreatorChannelHomeView: View {
schedules: response.schedules,
onTapSchedule: onTapSchedule
)
CreatorChannelAudioSection(
audioContents: response.audioContents,
onSelectTab: onSelectTab,
onTapContent: onTapContent
)
}
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.black)

View File

@@ -433,7 +433,7 @@
### Phase 10: 오디오 섹션
- [ ] **Task 10.1: 오디오 목록 섹션 구현**
- [x] **Task 10.1: 오디오 목록 섹션 구현**
- 대상 파일:
- 생성: `SodaLive/Sources/V2/CreatorChannel/Home/Components/CreatorChannelAudioSection.swift`
- 수정: `SodaLive/Sources/V2/CreatorChannel/Home/CreatorChannelHomeView.swift`