iOS

iOS13で発生するUICollectionviewのカクつきを解消する

投稿日:2020年3月16日 更新日:

はじめに

こんにちはsuzukiです。3月末でXcode11対応が必須になり、慌てて対応しました。昨年も慌てて対応した気がします。
Xcode11対応前から発生したのですが、iOS13でUICollectionViewのCellの入れ替え中を行うとカクつきが起きたため、対処療法ですが対応したのでご紹介いたします。おまけでその他のiOS13対応で一度対応が漏れた内容を記述しております。

発生内容

iOS13端末でのみGifの通りなのですがドラッグしている“7”が一瞬カクついています。条件としてはドラッグを開始した場所をドラッグ中に通過することです。

UICollectionViewの実装

Gifと同様の事象が起きるCollectionViewのコードです。
StoryBoardはよしなに設定してください。下記を忘れなければだいたい動きます。
・CollectionViewの配置とデータソース類の関連付け
・CustomCellのIDの設定

カクつきを抑える

この問題への対応を調査したところ、Xcodeのバージョンに関係なく、iOS 13で発生することが分かりました。
そこで、以下の対応方針でコードを修正していきます。
①ドラッグ中に問題が発生する入れ替え処理とアニメーションを行わせない。
②ドラッグ終了時に元の位置に戻すため止めていた入れ替え処理とアニメーションを行う。

Cellの入れ替えが発生する際の起点

処理をメインで追加するのが下記のデリゲートです。

簡単に説明ですが、updateInteractiveMovementTargetPositionを読んだ際に呼ばれるメソッドです。
実際にセルが入れ替わる際には下記のように取得できます。
・originalIndexPathで元のIndexPath
・proposedIndexPathで次のIndexPath
・originalIndexPathとproposedIndexPathが異なる際にproposedIndexPathを返却するとCellの入れ替えとアニメーションが発生します。

修正内容

ドラッグ中に問題が発生する入れ替え処理とアニメーションを行わせないという処理のため
・ドラッグし始めた際のIndexPathを取得
・ドラッグが完了した際のフラグを設定
上記を管理するためインスタンス変数を追加します。

実際に値を入れるのは下記の関数の中で行いました。ドラッグ中にユーザがタブを切り替えた場合も考慮し、viewWillAppearでfalseを代入します。記事後半で、コード全体を掲載するので、そちらも確認してみてください。

セルの入れ替え処理のデリゲートに下記のように記述しました。

動作確認

このような動きになりました。最初のカクつきは抑えれましたが既存のOSとは動きに少し差があります。

修正後のコードを記述します。

おまけ

・UITableViewCellのタップ時の色の変更
iOS 13 Release Notesで記述されているのですが下記をXcode11対応で合わせて行いました。
iOS13以前はCellをタップ際にcontentViewのsubView全体の色を変更していました。
iOS13以降はcontentViewのみ色の変更をします。
subViewにcontentsViewと同じ色を設定している時などは、設定を見直しましょう。

・UITableViewCellのSetHighlightの呼ばれるタイミング
UITableViewCellの func setHighlighted(_ highlighted: Bool, animated: Bool) の呼ばれるタイミングが変更されました。
上記箇所でselfのサイズを取得すると
iOS13以前はオートレイアウトの情報をもとに画面に表示されるサイズが取得。
iOS13以降は配置前のxibファイルに設定されているサイズが取得される。
という違いがありました。私の場合上記箇所でLazyでサイズ取得を行なっていたため、想定と違うサイズで不具合が起きました。

・iOS13のUICollectionViewの新機能
こちらのサイトがUICollectionViewのWWDCをもとにわかりやすくまとめてくれてます。
WWDCそのもののリンクはこちらです。
Advances in Collection View Layout
https://developer.apple.com/videos/play/wwdc2019/215
Advances in UI Data Sources
https://developer.apple.com/videos/play/wwdc2019/220/

さいごに

UICollectionViewはiOS11,13で大きな変更が続いています。想像しないような問題も発生しますが、入れ替えのアニメーションを自分で開発するのは大変なので使うこともよくあるかと思います。しっかりと付き合っていきたいですね。

おすすめ書籍

[改訂新版]Swift実践入門 ── 直感的な文法と安全性を兼ね備えた言語 WEB+DB PRESS plus 詳解 Swift 第4版 [改訂新版]Swiftポケットリファレンス (POCKET REFERENCE)

blog-page_footer_336




blog-page_footer_336




-iOS
-

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連記事

swift

[Swift]ObjectMapperで簡単にJSONを読み込む

1 はじめに2 準備3 実装3.1 基本的な使い方3.2 ネスト配列に対応してみよう4 さいごに はじめに こんにちは、onukiです。 私はSwiftでJSONを取り扱う際に、 ObjectMapp ...

swift

[Swift]いろんなインジケータを提供してくれるNVActivityIndicatorView

1 はじめに2 準備3 実装3.1 ストーリーボードで表示を変更する3.2 コードで表示を変更する4 さいごに はじめに こんにちは、nukkyです。 今回はアプリに欠かせないインジケータをいろんなパ ...

【Swift】WKWebViewでJavaScriptを利用して値の受け渡し

1 はじめに2 WebViewを利用した値の受け渡し2.1 事前準備2.2 WebViewのJavaScriptから、ネイティブの処理を呼出2.3 ネイティブから、WebView内の要素の値を取得2. ...

swift

[Swift]Schemaを使用してURLの接続先を切り替える

1 はじめに2 XCodeのBuildConfigurationとは3 スキーマとは4 スキーマの追加方法5 スキーマの設定変更6 開発と本番で異なる通信の接続先を設定する7 さいごに はじめに はじ ...

swift

Swiftで絵文字を判定する方法

1 はじめに2 実装2.1 絵文字の判定2.2 UITextFieldで絵文字の排除3 さいごに はじめに こんにちは、nukkyです。 今回はアプリでの文字入力の際に 入力された文字が絵文字かどうか ...

フォロー

blog-page_side_responsive

2020年3月
1234567
891011121314
15161718192021
22232425262728
293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。