[UIKit] 画面遷移後にUITableViewのセルが選択状態のままになってしまうのを防ぐ

公開日: : 最終更新日:2020/07/13 iOSアプリ開発

記事内に広告を含む場合があります。記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。

UntitledImage

こんにちは、あきお(@akio0911)です。

今回はタップして選択状態になってしまったセルを元に戻す方法を紹介します。

deselectRow(at:animated:) を使う

UITableViewを使ったアプリで、以下のようにタップした項目がずっと選択状態のままになってしまうことがあります。これは見た目的にちょっとかっこ悪いですね。

RPReplay Final1594435341

そんな時に使えるのが、こちらの deselectRow(at:animated:) というメソッドです。

deselectRow(at:animated:) | Apple Developer Documentation

試しに使ってみましょう。遷移元のリスト画面に以下のようなコードを追加してみます。

早速動かしてみます。

RPReplay Final1594435957

タップしたセルが選択状態のままにならなくなりましたね!これで解決!・・・といきたいところですが、実はまだ問題があります。

どの項目から戻ってきたのかを分かりやすくする

iOSの設定アプリでセル選択からの画面遷移の挙動を見てみましょう。

RPReplay Final1594436153

タップしたセルの選択状態解除は前の画面に戻るタイミングで行っています。なぜこのような挙動にしているのかというと、こうすることで「どの項目から戻ってきたのかが視覚的に分かりやすくなる」んですね。今回の例でいうと、「一般」という項目から戻ってきたことが分かりやすくなるわけです。

ではこの挙動を先ほどのサンプルアプリに組み込んでみましょう。以下のようなコードを1つ目の遷移元の画面に追記します。

では動作を確認してみましょう。

RPReplay Final1594436613

無事、前の画面に戻る時にどの項目から戻ってきたのかが分かりやすくなりました。

UITableViewController の場合は clearsSelectionOnViewWillAppear を使う

ちなみに今回はUIViewControllerを継承したクラスでの実装例を紹介しましたが、UITableViewControllerには今回の挙動をサポートする仕組みが最初から備わっています。clearsSelectionOnViewWillAppearというプロパティがあり、こちらがtrueになっていると遷移先から戻ってきた時に選択解除されるようになります。デフォルト値はtrueなので、UITableViewControllerから継承して画面を作っている場合は特に何もしなくても今回の挙動を実現できることになります。

関連動画

この記事を書いた人
あきお(@akio0911
派手髪iOSエンジニア。Twitterアカウントは@akio0911。YouTubeチャンネル「あきおチャンネル」にてiOSアプリ開発講座を公開中。著書に「iPhoneアプリ開発レシピ」「cocos2d for iPhoneレッスンノート」など。iOSアプリ開発をテーマとしたオンラインサロン「アプリ道場サロン」を運営。東京・大阪にてアプリ開発講座「アプリクリエイター道場」を主催。

関連記事

この記事が気に入ったら「いいね!」しよう

Twitterで更新情報をゲット!

PAGE TOP ↑