■ 전조

쓰여 있는 일

xcode에서 TableView를 사용하여 단일 페이지 응용 프로그램 제작

모티프

TableView 사용법에 관해서는 구버전을 전제로 한 기사가 많아 크게 실패했다.
특히 스위프트 3.0의 업데이트에 따라 코드의 기술 규칙 변경의 영향이 매우 크다.
참조: Swift3.0 변경 사항 요약
https://dev.classmethod.jp/smartphone/iphone/implemented_proposals_for_swift3/

■ 설명

물줄기

시작 프로젝트

Main.storyboard 설정

ViewController 코드에 추가

시동 걸어봐

1단계: 프로젝트 시작

단일 뷰 선택

항목 이름 등 입력

이번에'tableview'

로 바꿨어요.

더 자세히 말씀드리면 이쪽 기사는 이해하기 쉬워요.
https://type.jp/et/feature/3008

2단계: 메인 스토리보드 설정

화면 크기 설정

제작된 응용프로그램의 화면 사이즈를 설정하세요

이번에 SE를 선택했어요

StoryBoard ViewController에 TableView 추가

UI 부품에서 드래그 앤 드롭

선택

TableView 레이아웃 설정

이러다가는 예쁘게 안 나오니까 화면을 꽉 채워주세요

배터리와 시간 등이 표시된 영역(안전 영역)은 비워두십시오

TableView의 Outlets 설정

TableView

선택

오른쪽 메뉴에서 Connection Inspector

를 선택합니다.

Outlets의 데이터 원본과 delegate에서 알 수 있습니다!

TableView에 TableViewCell 추가

UI 부품에서 장치 부품 드래그 앤 드롭

TableViewCell의 Identifier 설정

설치된 셀에 이름 지정

3단계:전선 만지기

추가 ① "UItable View DataSource" 및 "UItable View Delegate" 추가

class 부분에 보충

표 보기 데이터 원본의 데이터 교환도 여기서 처리한다는 선언

ViewController.swift

import UIKit

//追加①
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { 

    //最初からあるコード
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    //最初からあるコード
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

② 정의 목록 내용 추가

테이블에 표시할 내용을 설명

이번 TODO 리스트 설정

ViewController.swift

import UIKit

//追加①
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { 

    //追加②
    let TODO = ["牛乳を買う", "掃除をする", "アプリ開発の勉強をする"] 

    //最初からあるコード
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    //最初からあるコード
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

③ 지정한 칸의 개수를 추가하는 코드 추가

ViewController.swift

import UIKit

//追加①
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource{

    //追加②
    let TODO = ["牛乳を買う", "掃除をする", "アプリ開発の勉強をする"]

    //最初からあるコード
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    //最初からあるコード
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    //追加③ セルの個数を指定するデリゲートメソッド（必須）
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return TODO.count
    }
}

④ 셀 컨텐트를 표시하는 코드 추가

ViewController.swift

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource{ //追加①

    let TODO = ["牛乳を買う", "掃除をする", "アプリ開発の勉強をする"] //追加②

    //最初からあるコード
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    //最初からあるコード
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    //追加③ セルの個数を指定するデリゲートメソッド（必須）
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return TODO.count
    }

    //追加④ セルに値を設定するデータソースメソッド（必須）
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // セルを取得する
        let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
        // セルに表示する値を設定する
        cell.textLabel!.text = TODO[indexPath.row]
        return cell
    }
}

4단계: 시작

볼록 빌딩 버튼

수고하셨습니다!

NextStage!

🎉TODO 애플리케이션 제품군 만들기
📱Swift로 간단한 TODO 어플을 만들어 보도록 하겠습니다.
https://qiita.com/TD3P/items/8f474358d1dd789557f3
📱스위프트에서 TableView를 사용해 보도록 하겠습니다.
https://qiita.com/TD3P/items/cafa8e20029047993025
📱Swift로 사용자 정의 단원을 다시 이용해서 TODO 앱을 만들어 보세요.
https://qiita.com/TD3P/items/116a2199b1f872ac6471
📱Swift로 CoreData를 사용하는 TODO 어플을 만들어 보도록 하겠습니다.
https://qiita.com/TD3P/items/adbbeee827995cffd509
📱스위프트로 Realm을 사용한 TODO 어플을 만들어 보도록 하겠습니다.
https://qiita.com/TD3P/items/616e0dbd364179ca284b
📱Flutter로 기본 TODO 어플을 만들어 보도록 하겠습니다.
https://qiita.com/pe-ta/items/b3b7458059c1fd7efcf0
📱Flutter 페이지에서 마이그레이션할 TODO 애플리케이션을 만들어 보세요.
https://qiita.com/pe-ta/items/e547c4cf460319f5093c
📱Flutter x Firestore로 가볍고 유쾌하게 지속한 다음 그것을 끌어내는 방법
https://qiita.com/pe-ta/items/ccd49fc396b063a821af