sodalive-ios/SodaLive/Sources/Live/RecommendChannel/SectionRecommendChannelView...

129 lines
5.6 KiB
Swift

//
// SectionRecommendChannelView.swift
// SodaLive
//
// Created by klaus on 2023/08/09.
//
import SwiftUI
import Kingfisher
struct SectionRecommendChannelView: View {
let items: [GetRecommendChannelResponse]
@Binding var isFollowingList: Bool
var body: some View {
VStack(spacing: 21.3) {
HStack(spacing: 0) {
if isFollowingList {
Text("팔로잉 ")
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(Color(hex: "eeeeee"))
} else {
Text("추천 ")
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(Color(hex: "eeeeee"))
}
Text("채널")
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(Color(hex: "9970ff"))
Spacer()
Text("팔로잉 채널")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color(hex: "777777"))
Image(isFollowingList ? "btn_toggle_on_big" : "btn_toggle_off_big")
.resizable()
.frame(width: 33.3, height: 20)
.padding(.leading, 6.7)
.onTapGesture {
isFollowingList.toggle()
}
}
.frame(width: screenSize().width - 26.7, alignment: .leading)
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 21.3) {
ForEach(0..<items.count, id: \.self) { index in
let item = items[index]
VStack(spacing: 13.3) {
ZStack(alignment: .bottom) {
KFImage(URL(string: item.profileImageUrl))
.resizable()
.scaledToFill()
.frame(width: screenSize().width * 0.18, height: screenSize().width * 0.18, alignment: .center)
.cornerRadius(screenSize().width * 0.09)
.overlay(
Circle()
.strokeBorder(lineWidth: 3)
.foregroundColor(
Color(hex: "9970ff")
.opacity(item.isOnAir ? 1 : 0)
)
)
if item.isOnAir {
Text("Live")
.font(.custom(Font.bold.rawValue, size: 8.7))
.foregroundColor(.white)
.padding(.vertical, 2.7)
.padding(.horizontal, 5.7)
.background(Color(hex: "9970ff"))
.cornerRadius(6.7)
}
}
Text(item.nickname)
.font(.custom(Font.medium.rawValue, size: 11.3))
.foregroundColor(Color(hex: "bbbbbb"))
.frame(width: screenSize().width * 0.18)
.lineLimit(1)
}
.onTapGesture {
AppState.shared.setAppStep(
step: .creatorDetail(userId: item.creatorId)
)
}
}
if isFollowingList {
VStack(spacing: 10.7) {
Image("btn_item_more")
.resizable()
.frame(width: screenSize().width * 0.18, height: screenSize().width * 0.18, alignment: .center)
Text("더보기")
.font(.custom(Font.medium.rawValue, size: 11.3))
.foregroundColor(Color(hex: "bbbbbb"))
.frame(width: screenSize().width * 0.18)
.lineLimit(1)
}
.onTapGesture {
AppState.shared.setAppStep(step: .followingList)
}
}
}
}
}
}
}
struct SectionRecommendChannelView_Previews: PreviewProvider {
static var previews: some View {
SectionRecommendChannelView(
items: [
GetRecommendChannelResponse(creatorId: 1, nickname: "크리에이터1", profileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png", isOnAir: true),
GetRecommendChannelResponse(creatorId: 2, nickname: "크리에이터2", profileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png", isOnAir: false),
GetRecommendChannelResponse(creatorId: 3, nickname: "크리에이터3", profileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png", isOnAir: false)
],
isFollowingList: .constant(true)
)
}
}