적당한 고통은 희열이다

- 댄 브라운 '다빈치 코드' 중에서

Swift iOS 앱 개발/실전 Swift

[Swift 실전] Adding Multiple text lines in CollectionViewCell using UIView 컬렉션 뷰 셀 안에 UIView로 속성 추가

hongssup_ 2021. 1. 10. 20:24
반응형

UICollectionViewCell 속성이 내장되어있는 새로운 Swift File을 생성한다.

MaterialComponents에 내장되어있는 기능들을 추가로 확장하여 사용하기 위해 MDCCardCollectionCell 속성을 이용하는 클라스를 생성한다. 

import Foundation
import UIKit
import MaterialComponents.MDCCardCollectionCell

class AssetCell: MDCCardCollectionCell {
	
    // 변수들 자료형 선언
    
    override init(frame: CGRect) {
    	super.init(frame: frame)
        
        // 변수들의 속성 선언
        
        setupSubViews()
        addConstraints()
	}
    
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        fatalError()
    }    
    
    func setupSubviews() {
    	변수.translatesAutoresizingMaskIntoConstraints = false
        addSubview(변수)
    }
    
    func addConstraints() {
    	NSLayoutConstraint.activate([
        	// 변수 constraints 추가           
    	])
    }
}

CollectionViewController의 viewDidLoad()에서 collectionView에 새로 만든 AssetCell을 불러올 수 있도록 register해준다. 

(MDCCollectionViewTextCell에서 AssetCell로 변경해주면 됨)

override func viewDidLoad() {
	super.viewDidLoad()
    // Register cell class
    self.collectionView?.register(AssetCell.self, forCellWithReuseIdentifier: reusableIdentifierItem)
    // Customize collection view settings.
    self.styler.cellStyle = .card

 

CollectionViewController의 cellForItemAt indexPath 에서 

cell 속성을 MDCCollectionViewTextCell에서 AssetCell로 변경해준다. 

override func collectionView(_ collectionView: UICollectionView,
                                 cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reusableIdentifierItem,
                                                      for: indexPath)
        
    // cell 속성을 MDCCollectionViewTextCell에서 AssetCell로 변경
    if let cell = cell as? AssetCell {
    
    	// AssetCell 변수들에 추가해줄 속성들
        
    }    
    return cell
}

 

 

+ UIView()로 원 모양 만들기

class MakeCircle: UICollectionViewCell {

    let circle = UIView()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        self.circle.layer.cornerRadius = 5
        self.circle.sizeToFit()
        
        setupSubviews()
        addConstraints()
        
    func setupSubviews() {
        circle.translatesAutoresizingMaskIntoConstraints = false
        addSubview(circle)
    }
    
    func addConstraints() {
        NSLayoutConstraint.activate([
            // circle 위치 설정
            circle.widthAnchor.constraint(equalToConstant: 10),
            circle.heightAnchor.constraint(equalToConstant: 10)
    }
}

 

+ fontAwesome 사용하여 아이콘 넣기

728x90
반응형