yoshiislandblog.net
元営業の駆け出しアラサーSEが、休日にMACと戯れた際の殴り書きメモ。日々勉強。日々進歩。

この記事は3年以上前に書かれた記事で内容が古い可能性があります

iOS(Swift)入門の入門

2017-05-07

GWなのでiOSアプリ作りに入門してみた。

■完成品
選択したアイテムの詳細画面が表示されるというもの



■躓きポイント
□TableViewControllerってどう使う?
(1)コードを書くファイルを作成

(2)StoryBoardでNavigationControllerを配置
※クラス名の結びつけを忘れずに

(3)作成したファイル編集
1.最初に読む関数、必要な処理があれば記載する(任意)

    override func viewDidLoad() {
        super.viewDidLoad()
    }

2.セクションの数を指定
※今回は一つ

    override func numberOfSections(in tableView: UITableView) -> Int {
    return 1
    }

3.データの数を指定
※今回は指定したリストの数だけ

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.TableList.count
    }

4.セルの編集
※indexPath.rowに何行目かの数字が入る

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "TableViewCell", for: indexPath)

    let img = UIImage(named:"\(ImageList[indexPath.row])")

        let imageView = tableView.viewWithTag(1) as! UIImageView
        imageView.image = img

        let label1 = tableView.viewWithTag(2) as! UILabel
        label1.text = "\(TableList[indexPath.row])"

        let label2 = tableView.viewWithTag(3) as! UILabel
        label2.text = "\(TableListDetail[indexPath.row])"

     return cell

     }

これでTableが表示されるようになる

□遷移した後の画面に変数を引き継ぎたい
(1)storyboardの編集
segueの線引きとidentifierの指定(identifierの値は任意)


(2)遷移元のファイル編集
先ほど指定したidentifierの値を使ってprepare関数を追加する(画面遷移の際に呼ばれる関数)

   override func prepare(for segue : UIStoryboardSegue, sender: Any?){
        super.prepare(for: segue, sender: sender)
        if segue.identifier == "toTableSubView" {

            // インスタンス作成
            let TableSV = segue.destination as! TableSubView
            // 変数の受け渡し
            TableSV.indexno = self.indexno
            TableSV.quoteLabel = self.result
            TableSV.quoteImage = self.resultimg
        }

(3)遷移先のファイル編集
こんな感じで普通に使える(varで変数の宣言は必要)

        LabelSubView.text = quoteLabel
        ImageSubView.image = UIImage(named: quoteImage!)
        LabelSubViewDetail.text = SubViewDetail[indexno]

■StoryBoard

■遷移前画面

import UIKit

class TableViewController: UITableViewController {

    // set variables
    let TableList = ["Nobunaga", "Hideyoshi", "Ieyasu"]
    let TableListDetail = ["Koroshiteshimae", "Nakasetemiseyou", "Nakumadematou"]
    let ImageList = [ "img1", "img2", "img3"]

    var indexno = 0
    var result : String?
    var resultimg : String?
    let quoteLabel = "test"

    override func viewDidLoad() {
        super.viewDidLoad()

        print("func viewDidLoad loaded")

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    override func numberOfSections(in tableView: UITableView) -> Int {

        print("func numberOfSections loaded")

        return 1
    }

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

        print("func tableView numberOfRowsInSection loaded")

        return self.TableList.count
    }

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "TableViewCell", for: indexPath)

    let img = UIImage(named:"\(ImageList[indexPath.row])")

     // Configure the cell...

        let imageView = tableView.viewWithTag(1) as! UIImageView
        imageView.image = img

        let label1 = tableView.viewWithTag(2) as! UILabel
        label1.text = "\(TableList[indexPath.row])"

        let label2 = tableView.viewWithTag(3) as! UILabel
        label2.text = "\(TableListDetail[indexPath.row])"

        let c = "\(indexPath.row)"
        print(c)

     return cell

     }

    // get cell label value
    override func tableView(_ tableView: UITableView, didHighlightRowAt indexPath: IndexPath) {

        print("func tableView didHighlightRowAt loaded")

        print(TableList[indexPath.row])
        result = TableList[indexPath.row]
        resultimg = ImageList[indexPath.row]
        indexno = indexPath.row
    }

    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath){
        tableView.deselectRow(at: indexPath, animated: false)

        print("func tableView didSelectRowAt loaded")
    }

    override func prepare(for segue : UIStoryboardSegue, sender: Any?){
        super.prepare(for: segue, sender: sender)
        if segue.identifier == "toTableSubView" {

            print("func prepare loaded")
            print("result is " + result!)
            print("result image is " + resultimg!)

            let TableSV = segue.destination as! TableSubView
            TableSV.indexno = self.indexno
            TableSV.quoteLabel = self.result
            TableSV.quoteImage = self.resultimg

        }
    }

}

■遷移後画面

import Foundation
import UIKit

class TableSubView: UIViewController {

    // varialble to get valut from previous
    var indexno = 0
    var quoteLabel : String?
    var quoteImage : String?

    let SubViewDetail = [ "殺してしまえホトトギス", "鳴かせてみせようホトトギス", "鳴くまで待とうホトトギス"]

    @IBOutlet weak var LabelSubView: UILabel!
    @IBOutlet weak var ImageSubView: UIImageView!
    @IBOutlet weak var LabelSubViewDetail: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()

        print("func viewDidLoad loaded")

        LabelSubView.text = quoteLabel
        ImageSubView.image = UIImage(named: quoteImage!)
        LabelSubViewDetail.text = SubViewDetail[indexno]

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

多分めちゃくちゃな書き方だがひとまず動いた。感動。

■画像入手元
いらすとや

■参考
一通り実施すると流れについてわかる
Start Developing iOS Apps (Swift)
■続き
この続きはこちら