김종권의 iOS 앱 개발 알아가기

1. UICollectionViewCompositionalLayout - 개념 (section, group, item) 2. UICollectionViewCompositionalLayout - 개념 SupplementaryView, Header, Footer) 3. UICollectionViewCompositionalLayout - 개념 (DecorationView, Badge) 4. UICollectionViewCompositionalLayout - 개념 (orthogonalScrollingBehavior, 수평 스크롤, visibleItemsInvalidationHandler) 5. UICollectionViewCompositionalLayout - 응용 (유튜브 뮤직 앱 레이아웃 구현) 가장 중요한..

1. UICollectionViewCompositionalLayout - 개념 (section, group, item) 2. UICollectionViewCompositionalLayout - 둘러보기1 (SupplementaryView, Header, Footer) 3. UICollectionViewCompositionalLayout - 개념 (DecorationView, Badge) 4. UICollectionViewCompositionalLayout - 개념 (orthogonalScrollingBehavior, 수평 스크롤, visibleItemsInvalidationHandler, NSCollectionLayoutAnchor) 5. UICollectionViewCompositionalLayout ..

UITableView에서 셀 간 간격 설정 방법 * CustomCell에서 layoutSubviews를 이용하여 설정 방법은 해당 포스팅 글 참고 가장 단순한 방법은 UICollectionView를 사용하여 UITableView처럼 사용 아래에서 볼 것이지만, UITableView는 contentInset 설정도 버그가 있으므로 UICollectionView 사용을 지향 UICollectionView와 UICollectionViewFlowLayout를 사용 let layout = UICollectionViewFlowLayout() layout.minimumLineSpacing = 8.0 // CGSize { .init(width: collectionView.bounds.width - 60, height:..

구현 아이디어 tableView의 커스텀 Cell에 collectionView를 넣어서 구현 tableView의 커스텀 Cell은 collectionView를 가지고 있으므로, 커스텀 Cell에서 컬렉션 뷰에 뿌려줄 dataSource를 가지고 있는 상태 예제코드에서 사용한 프레임워크 코드로 UI 구현 시 편리함을 위해 사용 pod 'SnapKit' pod 'Then' 샘플 Model 정의 tableView와 collectionView에 표출될 샘플 모델 정의 collectionViewCell에 사용될 데이터: Subcategory의 colors tableViewCell에 사용될 데이터: SubCategory의 name tableViewHeader에 사용될 데이터: CategoryModel의 name s..

1. UICollectionView의 SupplementaryView(HeaderView, FooterView, UICollectionReusableView) 2. UICollectionView의 DecorationView, SupplementaryView 커스텀 CollectionViewFlowLayout DecorationView 이란? collectionView에 Cell에 의존하지 않고 별도로 추가할 수 있는 뷰 DecorationView 전용 뷰를 따로 만든 후, register()해서 사용 UICollectionViewLayout에서 register()가 가능하므로, UICollectionViewFlowLayout이나 UICollectionViewLayout을 상속받아서 구현 prepare()..

* 주의: Section이 한개밖에 없는 경우 해당 방법 사용하고, 만약 Section이 여러개면 RxDataSource 사용 방법 포스팅 글 참고 Cell 준비 // MyCell.swift import UIKit final class MyCell: UITableViewCell { private let label: UILabel = { let label = UILabel() label.font = .systemFont(ofSize: 24) label.textColor = .black return label }() override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) { super.init(style: style, reuseId..

AlignedCollectionViewFlowLayout 프레임워크 3개의 섹션에 각 item들이 있는 형태 예시 화면 AlignedCollectionViewFlowLayout 프레임워크 github 내부적으로 UICollectionViewFlowLayout을 서브 클래싱하여 align을 쉽게 다룰 수 있도록 하는 프레임워크 UI 레이아웃 설정 편의를 위해 사용한 다른 프레임워크 참고 Reusable Then SnapKit AlignedCollectionViewFlowLayout 사용 방법 cocoapods 종속성 pod 'AlignedCollectionViewFlowLayout'​ Cell 정의 import UIKit import Reusable import SnapKit import Then fina..

사용한 기초 프레임워크 참고 ReactorKit RxCocoa Moya/RxSwift Kingfisher 사용 API Unsplash API page별로, 랜덤 이미지를 로드하는 API PrefetchItems tableView, collectionVIew와 같이 ScrollView의 스크롤할때 아직 화면에서 보이지 않지만 그 다음 보여야하는 cell에 관한 정보를 미리 얻어오는 것 정보를 미리 얻어와서, 불러와야할 이미지 url을 알고 스크롤 하기전에 prefetchItems 이벤트가 발생할때 미리 로딩하는 것 Pagination API 호출 시 page정보를 가지고 있어서, 정보를 한꺼번에 가져오지 않고 page=1, page=2, page=3와 같이 page별로 쪼개서 API호출하고 이미지를 업데이..