sodalive-ios/SodaLive/Sources/UI/Component/SeriesListItemView.swift

98 lines
3.4 KiB
Swift

//
// SeriesListItemView.swift
// SodaLive
//
// Created by klaus on 4/29/24.
//
import SwiftUI
import Kingfisher
struct SeriesListItemView: View {
let itemWidth: CGFloat
let item: SeriesListItem
var body: some View {
HStack(alignment: .top) {
VStack(alignment: .leading, spacing: 8) {
ZStack {
KFImage(URL(string: item.coverImage))
.resizable()
.scaledToFill()
.cornerRadius(5)
.clipped()
LinearGradient(
colors: [Color.black.opacity(0.1), Color.black.opacity(0.8)],
startPoint: .top,
endPoint: .bottom
)
VStack(alignment: .leading, spacing: 0) {
HStack(spacing: 3.3) {
if !item.isComplete && item.isNew {
SeriesItemBadgeView(title: "신작", backgroundColor: .button)
}
if item.isComplete {
SeriesItemBadgeView(title: "완결", backgroundColor: Color(hex: "002abd"))
}
if item.isPopular {
SeriesItemBadgeView(title: "인기", backgroundColor: Color(hex: "ec6033"))
}
Spacer()
}
Spacer()
HStack {
Spacer()
SeriesItemBadgeView(title: "\(item.numberOfContent)", backgroundColor: Color.gray33.opacity(0.7))
}
}
.padding(3.3)
}
.frame(width: itemWidth, height: itemWidth * 432 / 306)
Text(item.title)
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color.grayee)
.lineLimit(2)
.frame(width: itemWidth, alignment: .leading)
Text(item.publishedDaysOfWeek)
.font(.custom(Font.medium.rawValue, size: 11))
.foregroundColor(Color.gray77)
.frame(width: itemWidth, alignment: .leading)
}
.frame(width: itemWidth)
}
}
}
#Preview {
SeriesListItemView(
itemWidth: CGFloat(294 / 3),
item: 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
)
)
}