0

現在コレクションビューでリストアプリを作っています。
セルをクリックした遷移先(inputViewController)で入力した情報を、コレクションビューのセル上のラベルに表示したいのですが、入力した情報が全てのセルに反映されてしまい困っています。
遷移先のテキストフィールドで取得した日時を遷移元(viewContoroller)に表示したいです。
画面の遷移はstoryboad上のsegueにて、コレクションビューセルからinputviewcontrollerに繋いでいます。
選択されたセル毎に反映させる方法をご存知でしたら教えていただけたら嬉しいです。

はじめての質問なので不慣れな点もあるかと思いますがどうかご教示のほどお願いいたします。


コントローラー

class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate {
    //コレクションビューのレイアウト
    @IBOutlet weak var collectionView: UICollectionView!

    var text1: String?

    let toDos = ["1","2","3","4","5","6"]

    private let itemsPerRow: CGFloat = 3

    override func viewDidLoad() {
        super.viewDidLoad()

        let layout = UICollectionViewFlowLayout()
        layout.itemSize = CGSize(width: 100 , height: 100)
        collectionView.collectionViewLayout = layout
    }

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 6//表示するセルの数
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        //セルの色
        cell.backgroundColor = .white

        let label = cell.contentView.viewWithTag(2) as! UILabel
        label.text = toDos[indexPath.row]
        let dateLabel = cell.contentView.viewWithTag(3) as! UILabel
        //dateLabel.text = text1[indexPath.row]
        dateLabel.text = text1

        return cell
    }

    func collectionview(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let horizontalSpace : CGFloat = 20
        let cellSize : CGFloat = self.view.bounds.width / 3 - horizontalSpace
        return CGSize(width: cellSize, height: cellSize)
    }
}
import UIKit

class inputViewController: UIViewController,UITextFieldDelegate{

    @IBOutlet weak var textField: UITextField!

    var datePicker: UIDatePicker = UIDatePicker()

    override func viewDidLoad() {
        super.viewDidLoad()

        datePicker.datePickerMode = UIDatePicker.Mode.date
        datePicker.timeZone = NSTimeZone.local
        datePicker.locale = Locale(identifier: "ja")
        textField.inputView = datePicker


        let toolBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: view.frame.size.width, height: 35))
        let spaceItem = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: self, action: #selector(done))
        let doneItem = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(done)); toolBar.setItems([spaceItem,doneItem],animated: true)

        textField.inputView = datePicker
        textField.inputAccessoryView = toolBar

    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {

        textField.resignFirstResponder()

        return true
    }

    @ objc func done(){
        textField.endEditing(true)

        let formatter = DateFormatter()

        formatter.dateFormat = "yyyy年MM月dd日"

        textField.text = "\(formatter.string(from: datePicker.date))"
    }

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

    @IBAction func finishButton(_ sender: Any) {

        let viewController: ViewController =
        self.storyboard?.instantiateViewController(withIdentifier: "finish") as! ViewController
        viewController.text1 = textField.text
        self.navigationController?.pushViewController (viewController, animated: true)

    }

}

import UIKit

protocol inputViewControllerDelegate: class {
    func inputViewController(_ inputVC: inputViewController, didFinishWithText text: String?)
}

class inputViewController: UIViewController,UITextFieldDelegate {

    @IBOutlet weak var textField: UITextField!

    weak var delegate: inputViewControllerDelegate?

    var datePicker: UIDatePicker = UIDatePicker()


    override func viewDidLoad() {
        super.viewDidLoad()


        datePicker.datePickerMode = UIDatePicker.Mode.date
        datePicker.timeZone = NSTimeZone.local
        datePicker.locale = Locale(identifier: "ja")
        textField.inputView = datePicker


        let toolBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: view.frame.size.width, height: 35))
        let spaceItem = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: self, action: #selector(done))
        let doneItem = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(done)); toolBar.setItems([spaceItem,doneItem],animated: true)

        textField.inputView = datePicker
        textField.inputAccessoryView = toolBar


    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {

        textField.resignFirstResponder()

        return true
    }

    @ objc func done(){
        textField.endEditing(true)

        let formatter = DateFormatter()

        formatter.dateFormat = "yyyy年MM月dd日"

        textField.text = "\(formatter.string(from: datePicker.date))"


    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning() 

    }




    @IBAction func finishBtn(_ sender: Any){


    delegate?.inputViewController(self, didFinishWithText: textField.text)
        self.dismiss(animated: true, completion: nil)


}



}
5
  • 1
    「セルをクリックした遷移先で入力」とあるのに、どのように遷移させているのかも、何かの入力をするコードも提示していただいてないようです。そこら辺のやり方がおかしいから期待した動作になっていないと思われるので、必要な情報を追記して下さい。ご自身の質問は「編集」で修正することができます。
    – OOPer
    Commented 2019年6月16日 21:28
  • ご指摘どうもありがとうございます!修正いたしました。説明が下手で申し訳ないですが何卒よろしくお願いいたします・・・
    – ricos
    Commented 2019年6月17日 11:58
  • ご質問内容の修正ありがとうございました。根本的な問題は、セルはいくつも表示されるのに、表示用のデータを保持しているtext1が1つしかない点です。ただ、あなたのコードはそれ以外にも大きな問題点(Finishで元の画面に戻らず、新しい画面に遷移してしまっている)があって、ちょっと回答の形で書くには時間がかかりそうです。
    – OOPer
    Commented 2019年6月17日 20:47
  • ありがとうございます。finishのところの遷移もおかしかったのですね…調べてみたところこちらは自力で直せそうです。 text1のほうの問題は、text1を配列にするという方向性で間違っていないでしょうか? 簡単にでいいのでヒントをいただけるととてもうれしいです。
    – ricos
    Commented 2019年6月18日 6:15
  • 「方向性」としては間違っていません>「text1を配列にする」。ただし、toDosと合わせて、2つ(cellに表示するものが増えていけばもっと?)の配列を別々に持とうと思っているのであれば、それはお勧めしませんが。「配列」を更新した後、その更新した中身が確実にcollection viewのcellに反映されるようにするのにも一工夫要ります。回答が出来上がるまでにご自身でも試されることと思いますが、finishButtonの解決を含めて注意深く進めていって下さい。
    – OOPer
    Commented 2019年6月18日 11:51

1 件の回答 1

1

※ご自身でも色々試されているかもしれませんが、以下の説明・コードはご質問本文中のコードを前提に書かれています。長文ですが、その点にもご留意して最後まで見ていって下さい。

コメントに示したようにtext1(日付を表示する部分でしょうからもっと適切な名前をつけましょう)はセルの数だけ用意されていませんから、「セル毎に反映させる」ためにはセルごとに異なる情報はセルの数だけ用意すべきでしょう。

但し、コメントに書いたようにバラバラの配列をたくさん持つことはお勧めできません。セル表示用(もっと他の用途にも使って構いませんが)にデータ型を定義しておくべきでしょう。

ViewController.swiftの最初の方にでも、以下のデータ型宣言を追加して下さい。
(class ViewController ...より前。)

//1つのセルに表示される項目は1つのデータ型にまとめる
struct MyTodoItem {
    var title: String
    var dateString: String? //「日付」を保持する項目にはそのことがわかるような名前をつける
    //画像、背景色...
}

本当は日付を表すのにString型を使うといろいろ難しいことが出てくるので、Date型などに変えておきたいところですが、問題の解決に本質的でない部分の修正は避けておきます。「選択されたセル毎に反映させる」だけでも、まだまだ修正が必要なので…。

そうして、現在のtext1toDosの代わりに以下のような配列を保持しておきます。

    var todos: [MyTodoItem] = [
        MyTodoItem(title: "1", dateString: nil),
        MyTodoItem(title: "2", dateString: nil),
        MyTodoItem(title: "3", dateString: nil),
        MyTodoItem(title: "4", dateString: nil),
        MyTodoItem(title: "5", dateString: nil),
        MyTodoItem(title: "6", dateString: nil),
    ]

collectionView(_:cellForItemAt:)の実装は、それに合わせて少し書き換えてやります。

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        let item = todos[indexPath.row]  //`item`は`MyTodoItem`型
        //セルの色
        //cell.backgroundColor = .white

        let label = cell.contentView.viewWithTag(2) as! UILabel
        label.text = item.title //<-
        let dateLabel = cell.contentView.viewWithTag(3) as! UILabel
        dateLabel.text = item.dateString //<-

        return cell
    }

で、ここまではまだ大したことはないんですが、「セル毎に反映させる」だけでも、まだまだ考えないといけないことがあります。

  • InputViewController(現在はinputViewControllerになっているかもしれませんが、Swiftでは「型名は大文字で始める」と言う大変よく守られているルールがあるので、以下InputViewControllerで統一しておきます。)でテキストの編集が終わった後、(適切なインスタンスの)todosの適切なインデックスのdateStringを書き換えないといけない。

  • todosの中身を書き換えたら、UICollectionViewのreload系メソッドを呼んでやらないと、変更を確実に表示に反映させることができない

と言うわけで、せっかく配列をちゃんと作ってもInputViewControllerは配列のインデックスもわかっていません…。

この辺のことを、元のViewController側に丸投げするためには、デリゲートパターンなんてものがよく使われます。(delegateを動詞で使うと、「委任する」「委譲する」あたりの意味になりますが、場面によっては「丸投げする」の方が近いでしょう…。)

InputViewController.swiftの中にでも、次のようなプロトコルを追加してやります。

protocol InputViewControllerDelegate: class {
    func inputViewController(_ inputVC: InputViewController, didFinishWithText text: String?)
}

(textは日付を表していることが命名に反映されていませんが、長くなりすぎるので…。)

InputViewControllerの中には上記のプロトコル型のdelegateプロパティを追加します。

class InputViewController: UIViewController, UITextFieldDelegate {

    @IBOutlet weak var textField: UITextField!

    weak var delegate: InputViewControllerDelegate? //<-

    var datePicker: UIDatePicker = UIDatePicker()

    //...
}

後は、編集が完了した後の処理をこのdelegateに丸投げするようにfinishButton(_:)の処理を書き換えてやります。
修正 この部分は、セグエの種類(Kind)としてShowを選んで、InputViewControllerUINavigationController内に表示されている 場合のコードです。

    @IBAction func finishButton(_ sender: Any) {
        delegate?.inputViewController(self, didFinishWithText: textField.text)
        self.navigationController?.popViewController(animated: true)
    }

(元コードからUINavigationControllerを使っているものと推測してます。もし違うなら、「元の画面に戻る」処理は変更しないといけませんが、決して「新しい画面を表示する」ようなコードにしてはいけません。UINavigationControllerを使っているなら「戻る」ボタンが表示されるかと思いますが、話を単純にするため、そっちはキャンセル扱いで何もしないことにしておきます。)

セグエの種類にPresent Modallyを選んだりして、InputViewControllerUINavigationControllerを隠している ような場合はこちら:

    @IBAction func finishButton(_ sender: Any) {
        delegate?.inputViewController(self, didFinishWithText: textField.text)
        //print(self.navigationController,self.presentingViewController)
        self.dismiss(animated: true, completion: nil)
    }

ここまででも解説を挟みながらだとそこそこの長さになってしまいましたが、ここまでの修正を入れてもInputViewControllerでの編集結果は全く元の画面に反映されません、delegateに丸投げしているのに、「俺が丸投げされてやる」と、誰かがdelegateを引き受けてやる部分がないからです。

  • InputViewControllerへの画面遷移の際にdelegateを設定してやる

  • そのdelegateに必要なメソッドを実装してやる

と言う部分が必要になります。

上記1点目、セルから直接セグエを引いてしまっているので、prepare(for:sender:)メソッドの中でやらせることになるでしょう。

該当のセグエには、Identifierを以下のコードと整合するように(ToInput)付けておいて下さい。

delegate役はViewControllerにやらせるので、以下はViewControllerクラスに追加することになります。

    var editingItem: Int? //<- 編集中要素のインデックスを覚えておくためのプロパティを追加

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "ToInput" {
            //セルからセグエを引いたら`sender`がセルになってこのメソッドが呼ばれる
            let cell = sender as! UICollectionViewCell
            //そのセルの`todos`配列内のインデックスをどこか(インスタンスプロパティに)覚えておく
            if let indexPath = collectionView.indexPath(for: cell) {
                editingItem = indexPath.item
            } else {
                editingItem = nil
            }
            //このセグエでは遷移先は`InputViewController`
            let destVC = segue.destination as! InputViewController
            //その`delegate`を引き受けるのは俺(`self`)だと設定する
            destVC.delegate = self
        }
    }

このままだと最後のdestVC.delegate = selfにエラーが表示されるはずですが、ViewControllerInputViewControllerDelegateに適合していないせいなので、クラス宣言の後ろにこんな宣言を付け加えてやります。

extension ViewController: InputViewControllerDelegate {
    func inputViewController(_ inputVC: InputViewController, didFinishWithText text: String?) {
        //`self.editingItem`がnilのままだと何かの間違いなんで一応チェック
        if let editingItem = self.editingItem {
            //`todos`配列の適切な要素を更新
            todos[editingItem].dateString = text
            //更新を確実に画面に反映させる
            collectionView.reloadItems(at: [IndexPath(item: editingItem, section: 0)])
        }
    }
}

さてずいぶん長くなってしまいましたが、これでも「選択されたセル毎に反映」するのに必要な事柄以外はほとんど無視したつもりです。お試しの上、うまくいかない点、わかりにくい点があればお知らせください。

9
  • 丁寧に解説してくださりありがとうございます。さっそく試してみたところ、エラーは一切出なかったのですがなぜかfinishButton(_:)で前の画面に戻る事が出来ませんでした。ボタンを押下した感じはあるのですが遷移だけしないです。画面はviewControllerにnavigationbarを追加して使っています。何かおかしなところがあれば教えていただけたら嬉しいです。よろしくお願いいたします。
    – ricos
    Commented 2019年6月20日 7:03
  • @ricos さん、ご報告ありがとうございます。私が「推測」したのとはプロジェクトの設定が異なるようです。「画面はviewControllerにnavigationbarを追加して」と言うだけですとやり方は色々あるので、情報としてはやや不十分です。storyboardの設定内容がわかるようなスクリーンショットをご質問中に含めていただくと、もう少し確実なことが言えるかもしれません。また、確認のために、print(self.navigationController,self.presentingViewController)なんて文をfinishButton(_:)メソッドの最初にでも付け加えて、Finishを押した時に何が出力されるか見てみて下さい。その出力を見ればもう少し詳しいことがわかる場合があります。
    – OOPer
    Commented 2019年6月20日 10:52
  • いろいろ説明不足でお手間を取らせてしまい申し訳ないです・・・。質問にコントローラーのスクショを追加いたしました。finishを押した時に出力されたのは nil Optional(<UINavigationController: 0x7fe8c0820000>) でした。
    – ricos
    Commented 2019年6月20日 13:38
  • @ricos さん、情報の追加ありがとうございます。セグエにPresent Modallyを使っていて、UINavigationController内での遷移にはなっていなかったようですね。回答にfinishButton(_:)の修正版を追加しましたので、お試しください。
    – OOPer
    Commented 2019年6月20日 16:33
  • OOPerさん、修正版どうもありがとうございます。試してみたところ無事に前の画面に遷移する事が出来ました!が、しかし値渡しができませんでした。。質問の最後に現在のコードを追加したので何か足りない点があれば教えて頂けたら嬉しいです。よろしくお願いいたします。
    – ricos
    Commented 2019年6月21日 13:26

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。