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

UITableView의 backgroundView 프로퍼티 보통 리스트 형태나 그리드 형태로 데이터를 보여줄 때, 데이터를 불러오기 전에 스켈레톤 뷰 같은것을 보여주어야 하는데 이 때 UITalbeView나 UICollectionView 내부에 있는 backgroundView 프로퍼티를 사용하면 매우 쉽게 적용이 가능 (별도의 뷰 필요 없이 tableView.backgroundView 사용) 이 backgroundView는 tableView의 cell 앞쪽에 위치 ex) tableView에 사용할 cell 정의 final class MyTableViewCell: UITableViewCell { static let id = "MyTableViewCell" private let label = { let la..

UITableView의 separatorInset cell 안의 내용에 left, right inset을 줄 수 있는 property separatorInset은 UIEdgeInsets 타입이라서 top, bottom도 값을 입력할 수 있지만, top, bottom은 적용되지 않음 separatorInset을 설정하면 해당 padding을 탭했을때도 이벤트를 받아 셀이 선택되므로 padding을 탭해도 선택되게끔 할 때 유용하게 사용이 가능 사용방법 tableView에서 separatorInset 값을 대입 private let tableView: UITableView = { let view = UITableView() view.backgroundColor = .clear view.separatorSty..

dataSource 관리 방법 dataSource를 관리하다보면 보통 UI에서 사용되는 데이터와 비즈니스로직이 들어갈 ViewModel에서 사용되는 dataSource 두 벌을 관리하는 경우가 있는데, 상태 관리를 한곳에서 사용하지 않으면 데이터 정합성 문제가 발생 protocol을 사용하여 dataSource를 관리하면 해결 viewController에서 dataSource에 접근할 때는 protocol에 의존하게끔하면 해결 MVVM 구조 먼저 준비 MVVM구조를 쉽게 구현하기 위해 예제에 사용할 라이브러리 pod 'RxSwift' pod 'RxCocoa' View ViewModel 구현체에 의존하지 않도록, ViewModelable 프로토콜을 생성하고 이것에 의존하도록 구현 UI에 관한 input을 ..

UITableView 편집 모드 UITableView의 편집모드 중 Delete와 move관련 개념은 이전 포스팅 글 참고 [iOS - swift] UITableView의 편집모드 사용 방법 (셀 삭제, 셀 이동, canEditRowAt, editingStyleForRowAt, commit, can 셀 삭제 기능 활성화 방법 UITableView의 편집모드 중 셀 삭제 - UITableView에서 아무것도 설정 안하고 수정모드에 들어가면 UI는 모두 활성화 버튼에서 tap()이 눌렸을 때 tableView.setEditing(animated:)로 편 ios-development.tistory.com 예제에 사용될 starter project 링크 UITableView의 편집모드 버그 편집모드 진입 > -..

셀 삭제 기능 활성화 방법 UITableView의 편집모드 중 셀 삭제 - UITableView에서 아무것도 설정 안하고 수정모드에 들어가면 UI는 모두 활성화 버튼에서 tap()이 눌렸을 때 tableView.setEditing(animated:)로 편집모드 설정 @objc private func tap() { let shouldBeEdited = !tableView.isEditing tableView.setEditing(shouldBeEdited, animated: true) editButton.isSelected = shouldBeEdited } 왼쪽에 삭제 UI 버튼이 노출되고, 삭제 버튼을 눌러도 아무런 반응이 없는 상태 셀 삭제 기능 활성화 - delegate 할당 tableView.deleg..

UITableView의 대표적인 2가지 style header, footer가 없으면 둘 차이 x plain 스타일 - 스크롤 시 header가 상단에 고정 (sticky header 처럼 보여지는 효과) grouped 스타일 - 스크롤 시 header가 상단에 고정되지 않고, header가 있으면 자동으로 footer 영역이 생성 grouped 스타일 주의사항 보통 section이 고정되지 않게끔 구현해야하기 때문에 grouped 스타일을 많이 사용 grouped 스타일을 사용하고 header를 주면 개발자 의도에 상관없이 footer 영역이 자동으로 생성되므로 footer를 없애주는 코드가 따로 필요 (코드) import UIKit class ViewController: UIViewController..

구현 아이디어 Cell의 UI가 복잡하거나 여러가지의 타입이 있는 경우 보통 UITableView나 UICollectionView를 사용하지만, 위처럼 단순한 수평 스크롤 뷰는 UIScrollView와 UIStackView로 쉽게 구현 가능 주의할점은 UITableView, UICollectionView는 Cell을 재사용하여 UI성능에 이점이 있으므로, 데이터가 많을때는 UITableView나 UICollectionView를 사용 구현 핵심 부분은 데이터를 선택했을때 해당 데이터의 index를 알아내는 것인데, 이것또한 UIView의 tag를 활용하면 쉽게 구현이 가능 구현 * UI를 코드로 구현할 때 편의를 위해 아래 라이브러리 사용 pod 'SnapKit' pod 'Then' 수평 스크롤 뷰인 My..

* Storyboard를 이용한 구현은 이 포스팅 글 참고 UIScrollView UIScrollView의 특징은 layout의 종류가 두 가지 frameLayoutGuide: 변형되지 않은 레이아웃 (autolayout과 같은 제약조건으로 한번 정하면 고정) contentLayoutGuide: 변형되는 레이아웃 (내부 컨텐츠의 intrinsic content size에 의해서 변형) UIScrollView와 UIStackView 사용 방법 * 예제에 코드로 UI작성을 위해 SnapKit 사용 scrollView, stackView 준비 (수직 스크롤 구현할 경우) stackView의 axis를 vertical로 설정 class ViewController: UIViewController { private..