photo credit: AJ Yakstrangler 18 Aug 2013 Great Yarmouth (49) via photopin (license)

※この記事には補足の記事があります:
Swift – UICollectionView でスクロールすると Cell の配置が変わる問題の対処

 

CollectionView の Cell を複数選択する際、 iOS標準の写真アプリだと
選択された Cell にはチェックマークが表示される。

それと同じようなことを実現したくてコードを書いてみた。

↓完成図

CustomCell を定義する

まず、UICollectionView を継承して CustomCell を作る。

CustomCell ではシンプルに、以下の2つのことだけを意識している。

  • Cell が選択状態になる ⇒ チェックマークの View を追加する
  • Cell が解除状態になる ⇒ チェックマークの View を削除する

CustomCell を利用する

CollectionView の Cell として 上記で定義した CustomCell を使う。

ポイントは、

  • CustomCell を UICollectionView オブジェクト の Cell として登録すること (33行目)
  • Cell 選択時に呼び出される関数(56行目) で CustomCell.isMarked を true にすること
  • Cell 選択解除時に呼び出される関数(64行目) で CustomCell.isMarked を false にすること

おまけ: 複数選択の開始/キャンセル

複数選択を開始する用ボタンをタスクバーにつけたバージョンも作った。

タスクバーを用意して、Select / Cancel ボタンで 複数選択モードと そうでないモードを切り替えるように実装している。

複数選択モードのときだけチェックボックスが出て、 Cancel ボタンが押されるとチェックマークはすべて消える。

カテゴリー: Tips

hahnah

はーな Webエンジニア。モバイルアプリも少々。Elmが好き。

0件のコメント

コメントを残す

メールアドレスが公開されることはありません。