feat(latest-audio-content-all): 테마 UI 변경, 아이템 2단으로 변경

This commit is contained in:
Yu Sung
2025-11-20 15:06:25 +09:00
parent 68fd9ee3ad
commit 4d5ac61dbe
9 changed files with 129 additions and 67 deletions

View File

@@ -12,12 +12,6 @@ struct ContentAllByThemeView: View {
let themeId: Int let themeId: Int
let columns = [
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top)
]
var body: some View { var body: some View {
NavigationView { NavigationView {
BaseView(isLoading: $viewModel.isLoading) { BaseView(isLoading: $viewModel.isLoading) {
@@ -88,10 +82,25 @@ struct ContentAllByThemeView: View {
.padding(.vertical, 13.3) .padding(.vertical, 13.3)
.padding(.horizontal, 20) .padding(.horizontal, 20)
let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.contentList.count, id: \.self) { index in ForEach(0..<viewModel.contentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.contentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.contentList[index])
.onAppear { .onAppear {
if index == viewModel.contentList.count - 1 { if index == viewModel.contentList.count - 1 {
viewModel.getContentList() viewModel.getContentList()

View File

@@ -10,10 +10,9 @@ import Kingfisher
struct ContentNewAllItemView: View { struct ContentNewAllItemView: View {
let width: CGFloat
let item: GetAudioContentMainItem let item: GetAudioContentMainItem
@State var width: CGFloat = 0
var body: some View { var body: some View {
NavigationLink { NavigationLink {
ContentDetailView(contentId: item.contentId) ContentDetailView(contentId: item.contentId)
@@ -104,9 +103,6 @@ struct ContentNewAllItemView: View {
.padding(.bottom, 10) .padding(.bottom, 10)
} }
.frame(width: width) .frame(width: width)
.onAppear {
width = (screenSize().width - 42) / 3
}
} }
} }
} }

View File

@@ -11,12 +11,6 @@ struct ContentNewAllView: View {
@StateObject var viewModel = ContentNewAllViewModel() @StateObject var viewModel = ContentNewAllViewModel()
let columns = [
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top)
]
let isFree: Bool let isFree: Bool
var body: some View { var body: some View {
@@ -33,14 +27,13 @@ struct ContentNewAllView: View {
.frame(width: screenSize().width, alignment: .leading) .frame(width: screenSize().width, alignment: .leading)
.background(Color.gray22) .background(Color.gray22)
ContentMainNewContentThemeView( ContentMainContentThemeView(
themes: viewModel.themeList, themeList: viewModel.themeList,
selectTheme: { selectTheme: {
viewModel.selectedTheme = $0 viewModel.selectedTheme = $0
}, },
selectedTheme: $viewModel.selectedTheme selectedTheme: $viewModel.selectedTheme
) )
.padding(.horizontal, 20)
HStack(spacing: 0) { HStack(spacing: 0) {
Text("전체") Text("전체")
@@ -57,12 +50,27 @@ struct ContentNewAllView: View {
.foregroundColor(Color(hex: "e2e2e2")) .foregroundColor(Color(hex: "e2e2e2"))
.padding(.leading, 2) .padding(.leading, 2)
} }
.padding(.horizontal, 13.3) .padding(.horizontal, 24)
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { let horizontalPadding: CGFloat = 24
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.newContentList.count, id: \.self) { index in ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.newContentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.newContentList[index])
.onAppear { .onAppear {
if index == viewModel.newContentList.count - 1 { if index == viewModel.newContentList.count - 1 {
viewModel.getNewContentList() viewModel.getNewContentList()
@@ -70,7 +78,7 @@ struct ContentNewAllView: View {
} }
} }
} }
.padding(.horizontal, 13.3) .padding(.horizontal, 24)
} }
} }
.onAppear { .onAppear {

View File

@@ -90,10 +90,25 @@ struct ContentCurationView: View {
.padding(.vertical, 13.3) .padding(.vertical, 13.3)
.padding(.horizontal, 20) .padding(.horizontal, 20)
let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.contentList.count, id: \.self) { index in ForEach(0..<viewModel.contentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.contentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.contentList[index])
.onAppear { .onAppear {
if index == viewModel.contentList.count - 1 { if index == viewModel.contentList.count - 1 {
viewModel.getContentList() viewModel.getContentList()

View File

@@ -11,12 +11,6 @@ struct ContentMainAlarmAllView: View {
@StateObject var viewModel = ContentMainAlarmAllViewModel() @StateObject var viewModel = ContentMainAlarmAllViewModel()
let columns = [
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top)
]
var body: some View { var body: some View {
NavigationView { NavigationView {
BaseView(isLoading: $viewModel.isLoading) { BaseView(isLoading: $viewModel.isLoading) {
@@ -58,9 +52,24 @@ struct ContentMainAlarmAllView: View {
.padding(.horizontal, 13.3) .padding(.horizontal, 13.3)
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.newContentList.count, id: \.self) { index in ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.newContentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.newContentList[index])
.onAppear { .onAppear {
if index == viewModel.newContentList.count - 1 { if index == viewModel.newContentList.count - 1 {
viewModel.getContentMainAlarmAll() viewModel.getContentMainAlarmAll()

View File

@@ -11,12 +11,6 @@ struct ContentMainAsmrAllView: View {
@StateObject var viewModel = ContentNewAllViewModel() @StateObject var viewModel = ContentNewAllViewModel()
let columns = [
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top)
]
var body: some View { var body: some View {
NavigationView { NavigationView {
BaseView(isLoading: $viewModel.isLoading) { BaseView(isLoading: $viewModel.isLoading) {
@@ -49,9 +43,24 @@ struct ContentMainAsmrAllView: View {
.padding(.horizontal, 13.3) .padding(.horizontal, 13.3)
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.newContentList.count, id: \.self) { index in ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.newContentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.newContentList[index])
.onAppear { .onAppear {
if index == viewModel.newContentList.count - 1 { if index == viewModel.newContentList.count - 1 {
viewModel.getNewContentList() viewModel.getNewContentList()

View File

@@ -11,12 +11,6 @@ struct ContentMainIntroduceCreatorAllView: View {
@StateObject var viewModel = ContentMainIntroduceCreatorAllViewModel() @StateObject var viewModel = ContentMainIntroduceCreatorAllViewModel()
let columns = [
GridItem(.flexible()),
GridItem(.flexible()),
GridItem(.flexible())
]
var body: some View { var body: some View {
NavigationView { NavigationView {
BaseView(isLoading: $viewModel.isLoading) { BaseView(isLoading: $viewModel.isLoading) {
@@ -24,10 +18,25 @@ struct ContentMainIntroduceCreatorAllView: View {
DetailNavigationBar(title: "크리에이터 소개") DetailNavigationBar(title: "크리에이터 소개")
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 13.3) { let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.introduceCreatorList.count, id: \.self) { index in ForEach(0..<viewModel.introduceCreatorList.count, id: \.self) { index in
let item = viewModel.introduceCreatorList[index] let item = viewModel.introduceCreatorList[index]
ContentNewAllItemView(item: item) ContentNewAllItemView(width: itemSize, item: item)
.onAppear { .onAppear {
if index == viewModel.introduceCreatorList.count - 1 { if index == viewModel.introduceCreatorList.count - 1 {
viewModel.getIntroduceCreatorList() viewModel.getIntroduceCreatorList()

View File

@@ -11,12 +11,6 @@ struct ContentMainReplayAllView: View {
@StateObject var viewModel = ContentNewAllViewModel() @StateObject var viewModel = ContentNewAllViewModel()
let columns = [
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top),
GridItem(.flexible(), alignment: .top)
]
var body: some View { var body: some View {
NavigationView { NavigationView {
BaseView(isLoading: $viewModel.isLoading) { BaseView(isLoading: $viewModel.isLoading) {
@@ -49,9 +43,24 @@ struct ContentMainReplayAllView: View {
.padding(.horizontal, 13.3) .padding(.horizontal, 13.3)
ScrollView(.vertical, showsIndicators: false) { ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(columns: columns, spacing: 32) { let horizontalPadding: CGFloat = 16
let gridSpacing: CGFloat = 16
let itemSize = (screenSize().width - (horizontalPadding * 2) - gridSpacing) / 2
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 2
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(0..<viewModel.newContentList.count, id: \.self) { index in ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
ContentNewAllItemView(item: viewModel.newContentList[index]) ContentNewAllItemView(width: itemSize, item: viewModel.newContentList[index])
.onAppear { .onAppear {
if index == viewModel.newContentList.count - 1 { if index == viewModel.newContentList.count - 1 {
viewModel.getNewContentList() viewModel.getNewContentList()

View File

@@ -38,13 +38,11 @@ struct HomeWeeklyChartView: View {
} }
.padding(.horizontal, 24) .padding(.horizontal, 24)
HStack(spacing: 16) {
ContentMainContentThemeView( ContentMainContentThemeView(
themeList: sortList, themeList: sortList,
selectTheme: onTapSort, selectTheme: onTapSort,
selectedTheme: $selectedSort selectedTheme: $selectedSort
) )
}
ScrollView(.horizontal, showsIndicators: false) { ScrollView(.horizontal, showsIndicators: false) {
LazyHGrid(rows: rows, spacing: 16) { LazyHGrid(rows: rows, spacing: 16) {