iPhoneアプリのiPad対応５ - Page Sheetの位置

iPad対応 第5回、Page Sheetの位置 について。

Page Sheetの位置

iPadのように大きな画面の場合、Page Sheetには下にマージンが付く。

上図の赤枠が、Page SheetのModal画面。
iPhoneや、iPadのSplit Viewで別アプリを同時表示などの場合、下のマージンはなく、上のマージンのみある。
そのため、iPhone Onlyアプリでは下マージンの考慮ができていなかった。

それが、Keyboard表示時に、Keyboardのサイズに合わせて画面を変える場合。

上図は、Keyboardの高さ分、ボタン類を上に移動させたいパターン。
Keyboardの高さから、画面下マージンの高さを引いた分だけ移動したい。
他にも、Keyboardの高さに合わせて、画面を上にスクロールさせる等 も同じ考慮が必要と思う。

だが、Modalの view.frame.origin は 0, 0 になっていて、view.frameでは上下マージンのサイズがわからない。

マージンの取得方法

結論から言うと、UIPresentationController から取得できる。
この例だと、self.presentationController?.presentedView?.frame の値は、(156.0, 40.0, 712.0, 688.0) になっていた。

UIPresentationControllerとは、画面の表示を管理するクラス。
今回取り上げたような、画面サイズによって表示方法を変えたり、画面表示時のアニメーションを制御したりする。
カスタムしたことがある人には、おなじみ。

iPad対応 おわり

これにて iPad対応おわり！
Recipe Note ver 1.3.0 として、先程アップデート完了。

iPad対応の他に、iOS 13 で追加された、検索のUISearchTokenや、LinkのリッチViewのLPLinkView も入れて楽しんでみたので、よければお試しください ー。

iPhoneアプリのiPad対応４ - TableCell制御

iPad対応 第四弾。テーブルのセルの表示制御について。

まず、目標を設定アプリで確認。

1. Accessory Type
縦向き (Small Size) のときは DisclosureIndicator
横向き (Regular Size) のときは None

2. 選択セル
横向き (Regular Size) のときは、セルの選択状態を保持

3. Table Style
縦向き (Small Size) のときは Detailテーブルは Grouped
横向き (Regular Size) のときは Detailテーブルは Inset Grouped

3については方法はわからなかった。Styleは作成時にのみ設定可能なので、途中で変えることはできなさそうだし...方法はあるのかな？
ということで、1 と 2 を実装していく。

Accessory Type

Size Classが変わったときに、Accessory Type を切り替えるようにする。
以下のようなクラスをMasterのTableCellに設定すると、実現できる。

Size Classは traitCollection.horizontalSizeClassで取得、変更タイミングは traitCollectionDidChange でトリガーできる。

選択セル

選択の解除

まずは、Detail が非表示になったときMasterの選択を外す処理を考える。
外す処理は、Masterの viewWillAppear に入れていくが、方法は UITableViewController のときと、UIViewController のときとで変える必要がありそう。

UITableViewControllerのときは、clearsSelectionOnViewWillAppear を設定すればOKのようだ。
UITableViewControllerのviewWillAppearの中には、選択を解除する処理が入っているみたいなので、その前に設定が必要。
UIViewControllerのときは、UITableView.deselectRow を組み込む。

DetailViewを「何も選択していないView」を使わず、「常になにか選択されている」ようにする場合は、１カラムから２カラムに変更されたときにも選択する処理が必要。

選択しないCell

Recipeアプリの設定画面では、上図の構成になっている。

これら選択状態にしないCellについての実装方法について。

タップ不可のCell

Switchがあるタップ不可のCellの実装は、Selection を Noneにするとともに、tableView(_:shouldHighlightRowAt:) で false を返す。

見た目では、SelectionをNoneにするだけでタップ不可に見えるけど、内部では選択する処理が入っているから、shouldHighlightRowAt の処理も必要。

タップ可で選択不可のCell

ヘルプなどのCellは、TapできるけどSafariで表示するだけなので選択状態にはしないCell。

この場合は、tableView(_:shouldHighlightRowAt:) は true で返し、tableView(_:willSelectRowAt:) の中で処理を入れ、戻り値のIndexPathをnil にする。

今回のTableCellの制御は、見かけの調整なので、実装しなくても実害はないけど、ちゃんと整えると気持ちが良い。
iPadだからという話題ではなかったけど、いままでiPhoneの縦のみのアプリが多かったのもあり、あまり気にしていなかったので、良いお勉強になった。


次回につづく。