UIkit Basic 4 (UITableView, UIAlertController, UserDefaults)

Updated:

UITableView

데이터들 목록 형태로 보여 줄수 있는 가장 기본적인 UI component 이며, UIScrollView 를 상속 받고 있으므로 scroll 이 가능해 list 형태의 형태로 많은 정보를 보여 줄 수 있습니다

  • 여러 개의 Cell 을 가지고 있고 하나의 열과 여러 줄의 행을 지니고 있으며, 수직으로만 크크롤 가능합니다.

  • 섹션을 이용해 행을 그룹화하여 컨텐츠를 좀 더 쉽게 탐색할 수 있습니다.

  • 섹션의 header 와 footer View 를 구성하여 추가적인 정보를 표시할 수 있습니다

UITableViewDataSource

데이터를 받아 View 를 그려주는 역활입니다. 총 section 은 몇개인지 행,열의 어떠한 정보를 표시 할 건지를 정의합니다

  • UITableViewDataSource 에는 다음과 같은 method 를 가지고 있습니다

numberOfRowsInsection

각 section 에 표시할 수 있는 method 로 int type 으로 행의 갯수를 반환 하면 tableView 의 반환한 갯수 만큼 행이 표시가 됩니다. required 항목입니다

// 각 센션에 표시할 행의 개수를 묻는 메서드
func tableView(_ tableView: UItableView, numberOfRowsInSection section: Int) -> Int

cellForRowAt

특정 index row 에 cell 에 대한 정보를 넣어 반환하는 method 임. cell 을 구성하고 보여주는 데이터를 해당 method 에 반환 하게 되면 구성한 cell 이 table 에 표시되게 됩니다. required 항목입니다

// 특정 index Row 의 Cell 에 대한 정보를 넣어 Cell 을 반환하는 매서드
func tableView(_ tableView: UItableView, cellForRowAt indexPath: indexPath) -> UITableViewCell

numberOfSections

총 section 갯수를 물어보는 method int type 으로 section 의 갯수를 반환하는데, table view 에 반환하는 갯수 만큼 section 이 표시되는것

// 총 색션 갯수를 묻는 메서드
optional func numberOfSections(in tableView: UITableView, titleForHeaderInSection section: Int) -> String?

titleForHeaderInSection, titleForFooterInSection

Header, Footer title 을 묻는 method 특정 section 에 표시 하고 싶은 문자열 을 반환 하는 method

canEditRowAt

특정 위치의 행이 편집 가능한지 묻는 메서드

canMoveRowAt

특정 위치의 행을 재정렬 할 수 있는지 묻는 메서드

sectionIndexTitles

데이블 뷰 섹션 인덱스 타이틀을 묻는 메서드

sectionForSectionIndexTitle

인덱스에 해당하는 섹션을 알려주는 메서드

comit forRowAt

스와이프모드, 편집 모드에서 버튼을 선택하면 호출되는 메서드, 해당 메서드에서는 행에 변경사항을 Commit 해야 함

moveRowAt

행이 다른 위치로 이동되면 어디에서 어디로 이동 했는지 알려주는 메서드

Delegate

TableView의 외관과 동작을 담당합니다. View 가 변경되는 상황을 Delegate 가 담당을 합니다. View 는 Delegate 에 의존하여 View 를 업데이트 합니다. 행의 높이, 선택하면 어떠한 action 을 할건지 정의합니다

  • 테이블 뷰의 시작적인 부분을 설정하고, 행의 액션 관리, 액세러리 뷰 지원, 테이블 뷰의 개별 행 편집을 도와 줌

didSelectRowAt

행이 선택되었을때 호출되는 메서드

didDeselectRowAt

행이 선택 해제되었을 때 호출되는 메서드

heightForRowAt

특정 위치 행의 높이를 묻는 메서드

viewForHeaderInSection, viewForFooterInSection

지정된 색션의 헤더 뷰 또는 푸터뷰에 표시할 View 가 어떤 건지 묻는 메서드

heightForHeaderInSection, heightForHeaderInSection

지정된 색션의 헤더 뷰 또는 푸터뷰의 높이를 묻는 메서드

willBeginEditingRowAt

테이블 뷰가 편집 모드에 들어갔을 때 호출되는 메서드

didEndEditingRowAt

테이블 뷰가 편집모드에서 빠져 나왔을 때 호출되는 메서드

willDisplay

테이블 뷰가 셀을 사용하여 행을 그리기 직전에 호출되는 메서드

didEndDisPlaying

테이블 뷰로부터 셀이 화면에 사라지면 호출되는 메서드

UIAlertController

Alert 창을 구성하고, Alert 을 present 해서 app 의 창에서 표시되게 됩니다.

// alert 창 구현 예시

	@IBAction func tabAddButton(_ sender: UIBarButtonItem) {
		// add 버튼을 누르면 alert 이 생성되는 btn 생성
		let alert = UIAlertController(title: "Create Todo", message: nil, preferredStyle: .alert)

		// Add 버튼 생성 - 등록 버튼을 누를때 textField 의 버튼을 가져오기
		let registerBtn = UIAlertAction(title: "ADD", style: .default, handler: { [weak self] _ in
			guard let title = alert.textFields?[0].text else { return }
			let task = Task(title: title, done: false)
			self?.tasks.append(task)
			// task 가 추가 될때 마다 tableView 를 reload 하기
			self?.tableView.reloadData()
		})

		// cancel 되는 btn 생성
		let cancelBtn = UIAlertAction(title: "CANCEL", style: .cancel, handler: nil)
		// add, cancel btn 을 alert 에 추가하기
		alert.addAction(cancelBtn)
		alert.addAction(registerBtn)
		// textField 생성하기
		alert.addTextField(configurationHandler: { textField in
			textField.placeholder = "Write your task."
		})
		// 화면에 present 하기
		self.present(alert, animated: true, completion: nil)
	}

스크린샷 2021-11-29 오후 5 31 19

UserDefaults

  • 앱을 종료하여도 localStorage 에 데이터를 저장하는것을 가리킵니다

  • runtime 동작 환경에서 app 이 실행되는 동안 기본 저장소에서 데이터를 기록하고, 가져오는 역활을 하는 interface 입니다.

  • key, value 쌍으로 저장되며, singleton pattern 으로 생성되어 app 전체 하나의 instance 만이 존재하게 됩니다.

  • 여러가지 type 을 저장할 수 있는데, swift 안에 있는 float, int, double, boolean 등 기본적으로 제공하는 type 과 NSInt, NSString 등 NS 관련 type 도 저장이 가능합니다.

  • todolist 에서 UserDefaults 가 사용되는 예시

struct Task {
	var title: String
	var done: Bool
}

	// useDefault method 생성
	func saveTasks(){
		// 배열에 있는 tasks 를 dic 형태로 mapping 하기
		let data = self.tasks.map {
			[
				"title": $0.title,
				"done": $0.done
			]
		}
		let userDefaults = UserDefaults.standard
		// userDefaults 의 data 를 넣고, Key 값으로는 tasks 로 설정함
		userDefaults.set(data, forKey: "tasks")
	}

	// 저장된 data load 하는 method
	func loadTasks() {
		let userDefaults = UserDefaults.standard
		guard let data = userDefaults.object(forKey: "tasks") as? [[String: Any]] else { return }
		// 불러온 data 를 tasks 에 다시 저장
		self.tasks = data.compactMap {
			guard let title = $0["title"] as? String else { return nil }
			guard let done = $0["done"] as? Bool else { return nil }
			return Task(title: title, done: done)
		}
	}
}

	// task 의 list 생성: property observer 생성
	var tasks = [Task]() {
		// tasks 의 value 가 추가 될때 마다 UserDefaults 에 할일이 저장되게 됨
		didSet {
			self.saveTasks()
		}
	}

	override func viewDidLoad() {
		super.viewDidLoad()
		// UserDefaults 에 저장되어 있는 할일들을 불러오기
		self.loadTasks()
	}



🔶 🔷 📌 🔑

Reference

상어의 개발 블로그 - https://shark-sea.kr/entry/iOS-TableView-Storyboard%EB%A1%9C-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0

평생 공부만해야할듯 - https://gigas-blog.tistory.com/49

fastcampus - https://fastcampus.co.kr/dev_online_iosappfinal

Categories:

Updated:

Leave a comment