콘텐츠 메인

- 시리즈 탭 UI 페이지 생성
2025-02-21 21:10:16 +09:00
parent cf5d0dc19e
commit 6bd27c5301
19 changed files with 1439 additions and 22 deletions
--- a/SodaLive/Sources/Content/Main/V2/Series/ContentMainSeriesRankingView.swift
+++ b/SodaLive/Sources/Content/Main/V2/Series/ContentMainSeriesRankingView.swift
@@ -0,0 +1,141 @@
+//
+//  ContentMainSeriesRankingView.swift
+//  SodaLive
+//
+//  Created by klaus on 2/21/25.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct ContentMainSeriesRankingView: View {
+    
+    let seriesList: [SeriesListItem]
+    
+    let rows = [
+        GridItem(.flexible(), alignment: .leading),
+        GridItem(.flexible(), alignment: .leading),
+        GridItem(.flexible(), alignment: .leading)
+    ]
+    
+    var body: some View {
+        VStack(alignment: .leading, spacing: 13.3) {
+            Text("일간 랭킹")
+                .font(.custom(Font.bold.rawValue, size: 18.3))
+                .foregroundColor(.grayee)
+                .padding(.horizontal, 13.3)
+            
+            ScrollView(.horizontal, showsIndicators: false) {
+                LazyHGrid(rows: rows, spacing: 13.3) {
+                    ForEach(0..<seriesList.count, id: \.self) { index in
+                        let series = seriesList[index]
+                        HStack(spacing: 0) {
+                            KFImage(URL(string: series.coverImage))
+                                .cancelOnDisappear(true)
+                                .downsampling(
+                                    size: CGSize(
+                                        width: 60,
+                                        height: 85
+                                    )
+                                )
+                                .resizable()
+                                .frame(width: 60, height: 85)
+                                .cornerRadius(2.7)
+                            
+                            Text("\(index + 1)")
+                                .font(.custom(Font.bold.rawValue, size: 16.7))
+                                .foregroundColor(.button)
+                                .padding(.horizontal, 12)
+                            
+                            VStack(alignment: .leading, spacing: 8) {
+                                Text(series.title)
+                                    .lineLimit(2)
+                                    .font(.custom(Font.medium.rawValue, size: 13.3))
+                                    .foregroundColor(.grayd2)
+                                
+                                Text(series.creator.nickname)
+                                    .font(.custom(Font.medium.rawValue, size: 11))
+                                    .foregroundColor(.gray77)
+                            }
+                        }
+                        .frame(maxWidth: screenSize().width * 0.66, alignment: .leading)
+                        .contentShape(Rectangle())
+                        .onTapGesture {
+                            AppState
+                                .shared
+                                .setAppStep(step: .seriesDetail(seriesId: series.seriesId))
+                        }
+                    }
+                }
+                .padding(.horizontal, 13.3)
+            }
+        }
+    }
+}
+
+#Preview {
+    ContentMainSeriesRankingView(
+        seriesList: [
+            SeriesListItem(
+                seriesId: 1,
+                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
+                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
+                publishedDaysOfWeek: "매주 수, 토요일",
+                isComplete: true,
+                creator: SeriesListItemCreator(
+                    creatorId: 1,
+                    nickname: "creator",
+                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
+                ),
+                numberOfContent: 10,
+                isNew: true,
+                isPopular: true
+            ),
+            SeriesListItem(
+                seriesId: 1,
+                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
+                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
+                publishedDaysOfWeek: "매주 수, 토요일",
+                isComplete: true,
+                creator: SeriesListItemCreator(
+                    creatorId: 1,
+                    nickname: "creator",
+                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
+                ),
+                numberOfContent: 10,
+                isNew: true,
+                isPopular: true
+            ),
+            SeriesListItem(
+                seriesId: 3,
+                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
+                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
+                publishedDaysOfWeek: "매주 수, 토요일",
+                isComplete: true,
+                creator: SeriesListItemCreator(
+                    creatorId: 1,
+                    nickname: "creator",
+                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
+                ),
+                numberOfContent: 10,
+                isNew: true,
+                isPopular: true
+            ),
+            SeriesListItem(
+                seriesId: 4,
+                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
+                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
+                publishedDaysOfWeek: "매주 수, 토요일",
+                isComplete: true,
+                creator: SeriesListItemCreator(
+                    creatorId: 1,
+                    nickname: "creator",
+                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
+                ),
+                numberOfContent: 10,
+                isNew: true,
+                isPopular: true
+            )
+        ]
+    )
+}