Skip to content

Commit

Permalink
πŸ€[FEAT] RecommendCollectionView, RelateCollectionView κ΅¬ν˜„ (#3)
Browse files Browse the repository at this point in the history
  • Loading branch information
@joonBaek12
joonBaek12 committed Nov 23, 2022
1 parent a7c17d9 commit d6a7db8
Show file tree
Hide file tree
Showing 5 changed files with 279 additions and 37 deletions.
16 changes: 10 additions & 6 deletions Oliveyoung-iOS/Oliveyoung-iOS.xcodeproj/project.pbxproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,9 @@
/* Begin PBXBuildFile section */
3709E087292A394300222F3E /* ProductModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 3709E086292A394300222F3E /* ProductModel.swift */; };
37A27091292B7CE8008855D0 /* PretendardVariable.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 37A27090292B7CE8008855D0 /* PretendardVariable.ttf */; };
37CB1C46292E2FAA00C94725 /* relateCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CB1C45292E2FAA00C94725 /* relateCollectionViewCell.swift */; };
37E0023329262A1A00283615 /* TagCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37E0023229262A1A00283615 /* TagCollectionViewCell.swift */; };
37E0023529262A2800283615 /* ProductCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37E0023429262A2800283615 /* ProductCollectionViewCell.swift */; };
37E0023529262A2800283615 /* recommendCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37E0023429262A2800283615 /* recommendCollectionViewCell.swift */; };
DD0FC2962924C38500ACF342 /* DetailViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD0FC2952924C38500ACF342 /* DetailViewController.swift */; };
DD0FC2982924C39800ACF342 /* SearchResultViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD0FC2972924C39800ACF342 /* SearchResultViewController.swift */; };
DD0FC29A2924C39E00ACF342 /* SearchViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD0FC2992924C39E00ACF342 /* SearchViewController.swift */; };
Expand Down Expand Up @@ -46,8 +47,9 @@
/* Begin PBXFileReference section */
3709E086292A394300222F3E /* ProductModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductModel.swift; sourceTree = "<group>"; };
37A27090292B7CE8008855D0 /* PretendardVariable.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = PretendardVariable.ttf; sourceTree = "<group>"; };
37CB1C45292E2FAA00C94725 /* relateCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = relateCollectionViewCell.swift; sourceTree = "<group>"; };
37E0023229262A1A00283615 /* TagCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TagCollectionViewCell.swift; sourceTree = "<group>"; };
37E0023429262A2800283615 /* ProductCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductCollectionViewCell.swift; sourceTree = "<group>"; };
37E0023429262A2800283615 /* recommendCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = recommendCollectionViewCell.swift; sourceTree = "<group>"; };
DD0FC2952924C38500ACF342 /* DetailViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DetailViewController.swift; sourceTree = "<group>"; };
DD0FC2972924C39800ACF342 /* SearchResultViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SearchResultViewController.swift; sourceTree = "<group>"; };
DD0FC2992924C39E00ACF342 /* SearchViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SearchViewController.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -267,10 +269,11 @@
DDC28C8E29232F4C003B87BB /* Detail */ = {
isa = PBXGroup;
children = (
DD0FC2952924C38500ACF342 /* DetailViewController.swift */,
3709E086292A394300222F3E /* ProductModel.swift */,
37E0023229262A1A00283615 /* TagCollectionViewCell.swift */,
37E0023429262A2800283615 /* ProductCollectionViewCell.swift */,
37E0023429262A2800283615 /* recommendCollectionViewCell.swift */,
37CB1C45292E2FAA00C94725 /* relateCollectionViewCell.swift */,
3709E086292A394300222F3E /* ProductModel.swift */,
DD0FC2952924C38500ACF342 /* DetailViewController.swift */,
);
path = Detail;
sourceTree = "<group>";
Expand Down Expand Up @@ -375,6 +378,7 @@
DD0FC2962924C38500ACF342 /* DetailViewController.swift in Sources */,
DDC28C8929232E52003B87BB /* UILabel+.swift in Sources */,
DD0FC29C2924C3A500ACF342 /* HomeViewController.swift in Sources */,
37CB1C46292E2FAA00C94725 /* relateCollectionViewCell.swift in Sources */,
DDC28C7D29232CD6003B87BB /* UIImageView+.swift in Sources */,
DDC28C8329232D75003B87BB /* Identifier.swift in Sources */,
37E0023329262A1A00283615 /* TagCollectionViewCell.swift in Sources */,
Expand All @@ -383,7 +387,7 @@
DDC28C8729232E0E003B87BB /* UIView+.swift in Sources */,
DDC28C54292320E0003B87BB /* SceneDelegate.swift in Sources */,
DD0FC2982924C39800ACF342 /* SearchResultViewController.swift in Sources */,
37E0023529262A2800283615 /* ProductCollectionViewCell.swift in Sources */,
37E0023529262A2800283615 /* recommendCollectionViewCell.swift in Sources */,
DDC28C7F29232D27003B87BB /* Const.swift in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
Expand Down
165 changes: 138 additions & 27 deletions Oliveyoung-iOS/Oliveyoung-iOS/Source/Presentation/Detail/DetailViewController.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,18 @@ final class DetailViewController: UIViewController {
return collectionView
}()

private lazy var relateCollectionView: UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .vertical

let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
collectionView.backgroundColor = .clear
collectionView.translatesAutoresizingMaskIntoConstraints = false
collectionView.isScrollEnabled = true
collectionView.showsVerticalScrollIndicator = false
return collectionView
}()

//MARK: - Components
private let topContainerView = UIView()
private let productImageContainerView = UIView()
Expand Down Expand Up @@ -184,6 +196,16 @@ final class DetailViewController: UIViewController {
$0.textColor = 0x2f2f2f.color
}

private let recommendLabel = UILabel().then {
$0.font = .tittleSubhead1
$0.textColor = 0x2f2f2f.color
}

private let relateLabel = UILabel().then {
$0.font = .tittleSubhead1
$0.textColor = 0x2f2f2f.color
}

private let rateImageView = UIImageView(image: UIImage(named: "starRate"))
private let singleStarImageView = UIImageView(image: UIImage(named: "star14X14"))
private let productImageView = UIImageView(image: UIImage(named: "detailView"))
Expand All @@ -193,13 +215,16 @@ final class DetailViewController: UIViewController {
//MARK: - Variables
var tagList = ["립밀", "ν•Έλ“œν¬λ¦Ό", "ν‹΄νŠΈ", "μΏ μ…˜", "마슀크팩"]

var productList:[productModel] = [
productModel(name: "μ•„μ΄μ†Œμ΄", description:"μ—”μ € μ•„μΏ μ•„ μˆ˜λΆ„ 진정 크림 150mlλͺ¨μ΄μŠ€μΆ°λ‹₯ν„° μž₯/수/진 μˆ˜λΆ„ μ•°ν”Œ 기획" , productImage: "", price: "27,000", discountRate:""),
productModel(name: "μ„ΌμΉ΄", description: "νΌνŽ™νŠΈ 휩 νŽ˜μ΄μ…œ μœ„μ‹œ 120g", productImage: "", price: "8,500", discountRate: ""),
productModel(name: "λΌμš΄λ“œλž©", description: "1025 독도 μ•°ν”Œ 45g", productImage: "", price: "28,000", discountRate: ""),
productModel(name: "ν”Όμ§€μ˜€κ²”", description: "[ν•œμ •κΈ°νš] AI크림 100ml 기획", productImage: "", price: "27,000", discountRate: "23%"),
productModel(name: "μ—μŠ€νŠΈλΌ", description: "아토베리어 365 ν•˜μ΄λ“œλ‘œ μ—μ„ΌμŠ€ 200ml ", productImage: "", price: "21,600", discountRate: "32%"),
productModel(name: "μ•„λ²€λŠ", description: "μ‹œμΉΌνŒŒνŠΈν”ŒλŸ¬μŠ€ 크림 1+1 기획", productImage: "", price: "19,310", discountRate: "5%")
var recommendList:[recommendModel] = [
recommendModel(name: "μ•„μ΄μ†Œμ΄", description:"μ—”μ € μ•„μΏ μ•„ μˆ˜λΆ„ 진정 크림 150mlλͺ¨μ΄μŠ€μΆ°λ‹₯ν„° μž₯/수/진 μˆ˜λΆ„ μ•°ν”Œ 기획" , productImage: "", price: "27,000"),
recommendModel(name: "μ„ΌμΉ΄", description: "νΌνŽ™νŠΈ 휩 νŽ˜μ΄μ…œ μœ„μ‹œ 120g", productImage: "", price: "8,500"),
recommendModel(name: "λΌμš΄λ“œλž©", description: "1025 독도 μ•°ν”Œ 45g", productImage: "", price: "28,000")
]

var relateList:[relateModel] = [
relateModel(name: "ν”Όμ§€μ˜€κ²”", description: "[ν•œμ •κΈ°νš] AI크림 100ml 기획", productImage: "", price: "27,000", discountRate: "23%"),
relateModel(name: "μ—μŠ€νŠΈλΌ", description: "아토베리어 365 ν•˜μ΄λ“œλ‘œ μ—μ„ΌμŠ€ 200ml ", productImage: "", price: "21,600", discountRate: "32%"),
relateModel(name: "μ•„λ²€λŠ", description: "μ‹œμΉΌνŒŒνŠΈν”ŒλŸ¬μŠ€ 크림 1+1 기획", productImage: "", price: "19,310", discountRate: "5%")

]

Expand All @@ -209,10 +234,15 @@ final class DetailViewController: UIViewController {
final let tagInterItemSpacing: CGFloat = 8
final let tagCellHeight: CGFloat = 27

final let productInset: UIEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
final let productLineSpacing: CGFloat = 0
final let productInterItemSpacing: CGFloat = 15
final let productCellHeight: CGFloat = 148
final let recommendInset: UIEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
final let recommendLineSpacing: CGFloat = 0
final let recommendInterItemSpacing: CGFloat = 15
final let recommendCellHeight: CGFloat = 148

final let relateInset: UIEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
final let relateLineSpacing: CGFloat = 0
final let relateInterItemSpacing: CGFloat = 15
final let relateCellHeight: CGFloat = 148

//MARK: - Life Cycles
override func viewDidLoad() {
Expand Down Expand Up @@ -301,6 +331,16 @@ extension DetailViewController {
)
productDetailContainerView.addSubview(productImageView)

recommendContainerView.addSubviews(
recommendLabel,
recommendCollectionView
)

relatedProductContainerView.addSubviews(
relateLabel,
relateCollectionView
)

// ContainerViews
topContainerView.snp.makeConstraints {
$0.top.leading.trailing.equalTo(view.safeAreaLayoutGuide)
Expand Down Expand Up @@ -594,6 +634,29 @@ extension DetailViewController {
$0.edges.equalToSuperview()
}

//recommendContainerView
recommendLabel.snp.makeConstraints {
$0.top.equalToSuperview().offset(16)
$0.leading.equalToSuperview()
}

recommendCollectionView.snp.makeConstraints {
$0.top.equalTo(recommendLabel.snp.bottom).offset(16)
$0.leading.trailing.equalToSuperview()
$0.height.equalTo(204)
}

//relateContainerView
relateLabel.snp.makeConstraints {
$0.top.equalToSuperview().offset(16)
$0.leading.equalToSuperview()
}

relateCollectionView.snp.makeConstraints {
$0.top.equalTo(relateLabel.snp.bottom).offset(16)
$0.leading.trailing.equalToSuperview()
$0.height.equalTo(192)
}
}

//MARK: - General Helpers
Expand All @@ -615,8 +678,8 @@ extension DetailViewController {
// availableStoreContainerView.backgroundColor = .systemYellow
// tabbarButtonContainerView.backgroundColor = .systemGreen
// productDetailContainerView.backgroundColor = .systemBlue
recommendContainerView.backgroundColor = .systemPurple
relatedProductContainerView.backgroundColor = .systemCyan
// recommendContainerView.backgroundColor = .systemPurple
// relatedProductContainerView.backgroundColor = .systemCyan
bottomContainerView.backgroundColor = .systemGray6
}

Expand All @@ -643,6 +706,8 @@ extension DetailViewController {
self.availableStoreLabel.text = "ν™λŒ€κ³΅ν•­μ² λ„μ "
self.storeStatusLabel.text = "μ˜μ—…μ€‘"
self.stockLabel.text = "재고보유 κ°€λŠ₯μ„± λ†’μŒ"
self.relateLabel.text = "이 μƒν’ˆμ€ μ–΄λ– μ„Έμš”?"
self.recommendLabel.text = "방금 λ³Έ 것과 μœ μ‚¬ν•œ μƒν’ˆμ΄μ—μš”"
}

private func viewConfig() {
Expand All @@ -659,13 +724,16 @@ extension DetailViewController {
private func configDelegate() {
tagCollectionView.delegate = self
tagCollectionView.dataSource = self
// productCollectionView.delegate = self
// productCollectionView.dataSource = self
recommendCollectionView.delegate = self
recommendCollectionView.dataSource = self
relateCollectionView.delegate = self
relateCollectionView.dataSource = self
}

private func register() {
tagCollectionView.register(TagCollectionViewCell.self, forCellWithReuseIdentifier: TagCollectionViewCell.identifier)
// productCollectionView.register(ProductCollectionViewCell.self, forCellWithReuseIdentifier: ProductCollectionViewCell.identifier)
recommendCollectionView.register(recommendCollectionViewCell.self, forCellWithReuseIdentifier: recommendCollectionViewCell.identifier)
relateCollectionView.register(relateCollectionViewCell.self, forCellWithReuseIdentifier: relateCollectionViewCell.identifier)
}

//MARK: - Action Helpers
Expand All @@ -675,34 +743,77 @@ extension DetailViewController {
//MARK: - UICollectionViewDelegateFlowLayout
extension DetailViewController: UICollectionViewDelegateFlowLayout {
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

let tempLabel: UILabel = UILabel()
tempLabel.text = tagList[indexPath.item]
return CGSize(width: tempLabel.intrinsicContentSize.width, height: 27)
if collectionView == tagCollectionView {
let tempLabel: UILabel = UILabel()
tempLabel.text = tagList[indexPath.item]
return CGSize(width: tempLabel.intrinsicContentSize.width, height: 27)
} else if collectionView == recommendCollectionView {
return CGSize(width: 105, height: 204)
} else {
return CGSize(width: 105, height: 192)
}
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
return tagLineSpacing
if collectionView == tagCollectionView {
return tagLineSpacing
} else if collectionView == recommendCollectionView {
return recommendLineSpacing
} else {
return relateLineSpacing
}
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
return tagInterItemSpacing
if collectionView == tagCollectionView {
return tagInterItemSpacing
} else if collectionView == recommendCollectionView {
return recommendInterItemSpacing
} else {
return relateInterItemSpacing
}
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
return tagInset
if collectionView == tagCollectionView {
return tagInset
} else if collectionView == recommendCollectionView {
return recommendInset
} else {
return relateInset
}
}
}

//MARK: - UICollectionViewDataSource
extension DetailViewController: UICollectionViewDataSource {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return tagList.count

if collectionView == tagCollectionView {
return tagList.count
} else if collectionView == recommendCollectionView {
return 3
} else {
return 3
}

}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
guard let tagCell = collectionView.dequeueReusableCell(withReuseIdentifier: TagCollectionViewCell.identifier, for: indexPath) as? TagCollectionViewCell else { return UICollectionViewCell() }
tagCell.dataBind(tag: tagList[indexPath.item])
return tagCell
if collectionView == tagCollectionView {
guard let tagCell = collectionView.dequeueReusableCell(withReuseIdentifier: TagCollectionViewCell.identifier, for: indexPath) as? TagCollectionViewCell else { return UICollectionViewCell() }
tagCell.dataBind(tag: tagList[indexPath.item])
return tagCell
} else if collectionView == recommendCollectionView {
guard let recommendCell = collectionView.dequeueReusableCell(withReuseIdentifier: recommendCollectionViewCell.identifier, for: indexPath) as?
recommendCollectionViewCell else { return UICollectionViewCell() }
recommendCell.dataBind(model: recommendList[indexPath.item])
return recommendCell
} else {
guard let relateCell = collectionView.dequeueReusableCell(withReuseIdentifier: relateCollectionViewCell.identifier, for: indexPath) as?
relateCollectionViewCell else { return UICollectionViewCell() }
relateCell.dataBind(model: relateList[indexPath.item])
return relateCell
}
}
}
9 changes: 8 additions & 1 deletion Oliveyoung-iOS/Oliveyoung-iOS/Source/Presentation/Detail/ProductModel.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,14 @@

import Foundation

struct productModel {
struct recommendModel {
var name: String
var description: String
var productImage: String
var price: String
}

struct relateModel {
var name: String
var description: String
var productImage: String
Expand Down
9 changes: 6 additions & 3 deletions ...on/Detail/ProductCollectionViewCell.swift β†’ .../Detail/recommendCollectionViewCell.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,23 +12,26 @@ import SnapKit
import SwiftyColor

//MARK: - ProductCollectionViewCell
final class ProductCollectionViewCell: UICollectionViewCell {
final class recommendCollectionViewCell: UICollectionViewCell {

//MARK: - UI Components

private let productImageView = UIImageView()
private let productLabel = UILabel().then {
$0.font = .bodyBody2
$0.textColor = 0x2f2f2f.color
$0.numberOfLines = 0
}

private let descriptionLabel = UILabel().then {
$0.font = .bodyCaption
$0.textColor = 0x2f2f2f.color
$0.numberOfLines = 0
}
private let priceLabel = UILabel().then {
$0.font = .bodyCaption2
$0.textColor = 0x2f2f2f.color
$0.numberOfLines = 0
}
private let wonLabel = UILabel().then {
$0.font = .bodyCaption2
Expand All @@ -51,7 +54,7 @@ final class ProductCollectionViewCell: UICollectionViewCell {
}

//MARK: - Extensions
extension ProductCollectionViewCell {
extension recommendCollectionViewCell {

//MARK: - Layout Helpers
private func layout() {
Expand Down Expand Up @@ -92,7 +95,7 @@ extension ProductCollectionViewCell {

//MARK: - General Helpers

func dataBind(model: productModel) {
func dataBind(model: recommendModel) {
productImageView.image = UIImage(named: model.productImage)
productLabel.text = model.name
descriptionLabel.text = model.description
Expand Down
Loading

0 comments on commit d6a7db8

Please sign in to comment.