テレビのリモコンのことも忘れないで!

2017年12月24日
tvos / ui /

AppleTVで使えるリモコンって?

Siriリモート

tvOS/AppleTVのリモコンといえばSiriリモートですよね。 皆様におかれましても日々のAppleTV生活ではSiriリモートを使われているかと思います。

テレビのリモコン

そしてもちろん普通のテレビのリモコンもAppleTVの操作に使えます!

AppleTVを利用しているということは当然テレビを利用しているわけで、AppleTVを使っている人のほとんどがテレビのリモコンを所持している、かつ普段使いしていることでしょう(AppleTVの操作をするかどうかは置いておいて)。 そのため、AppleTVの操作という意味ではSiriリモートに次いで利用するチャンスが多くなるリモコンかと思います。

ゲームコントローラ/ゲームパッド

Nimbusなどのゲームコントローラも利用できますが、今回の主役は普通のテレビのリモコンのため、省略させていただきます。

テレビのリモコンでどこまで操作できる?

Apple純正のアプリ

全て確認したわけではないですが、ホーム画面はもちろん、純正アプリならテレビのリモコンだけでも一通りの操作ができるようになっているようです。

サードパーティのアプリ

ゲームアプリ以外なら操作できることが多いようです。 ただしTouchサーフェス前提で組まれているアプリは操作不能です。

自分が開発するアプリはどうすべき?

タイトルには「忘れないで!」と書いたものの、実際のところそんなに気にしなくても良いのでは。 また、UIKitをシンプルに使って作ったアプリなら何も処置しなくてもテレビのリモコンで操作できるようになっています(後述します)。

テレビのリモコンのボタンに対応するUIPressType

うちのテレビ(REGZA)のリモコンではこんな感じになっていました。他のテレビのリモコンも概ね同じじゃないかと思います。

REGZAのリモコン UIPressType
決定 .select
戻る .menu
再生 .playPause
停止 -
.upArrow
.downArrow
.leftArrow
.rightArrow

UIKitの各コントロールの挙動

フォーカス移動

テレビのリモコンの上下左右キーが有効ですので、上下左右を押すことで普通にフォーカスが移動可能です。そのためシンプルにフォーカスが当たるコントロール(UIButtonなど)が配置されただけの画面なら何もしなくても操作可能になっています。

UITableView/UICollectionView

UITableViewやUICollectionViewを使った画面もテレビのリモコンで操作可能です。 デフォルトで各Cellにフォーカスが当たるので、Cellのフォーカスを移動していくと自動的にスクロールしていく挙動になります。

UIPageViewController

これは意外だったのですが、UIPageViewControllerもデフォルトでテレビのリモコンでの操作が可能でした。

ただし条件があり、transitionStyleプロパティにUIPageViewControllerTransitionStyle.scrollを設定している場合のみ操作可能です。.pageCurlだと(デフォルトでは)操作不能でした。

.scrollの場合には、navigationOrientationプロパティが.horizontalなら左右ボタンで、.verticalなら上下ボタンでそれぞれページ移動が可能です。

UIScrollView

UIScrollViewも特に意識しないでも操作可能になっています。

上下左右で直接スクロール可能というわけではなく、UIScrollView上に配置された要素を上下左右ボタンでフォーカス移動することで、結果としてスクロールされるという挙動になります(フォーカスが当たった要素が画面内に収まるように)。

UITextView

UITextViewはデフォルトでは上下左右ボタンでの操作ができませんでした。

テレビのリモコンで操作できない画面をなんとかする

一例ですが、UIPanGestureRecognizerを使って独自のページ移動をさせるような実装をした画面でもテレビのリモコンで操作させたい場合には、UITapGestureRecognizerを使って対処するのが簡単そうです。

let leftTap = UITapGestureRecognizer(target: self, action: #selector(self.leftArrowDidPress(sender:)))
leftTap.allowedPressTypes = [NSNumber(value: UIPressType.leftArrow.rawValue)]
view.addGestureRecognizer(leftTap)

let rightTap = UITapGestureRecognizer(target: self, action: #selector(self.rightArrowDidPress(sender:)))
rightTap.allowedPressTypes = [NSNumber(value: UIPressType.rightArrow.rawValue)]
view.addGestureRecognizer(rightTap)

// func leftArrowDidPress(sender:) と func rightArrowDidPress(sender:) にそれぞれ左右への移動のための実装をする

単にUIGestureRecognizerのallowedPressTypesプロパティでハンドリングしたいUIPressTypeを指定してそれに応じたコードを書くだけです!

※ブログ用にコードで例示しましたが、普段UITapGestureRegognizerの追加はInterface Builderでやってます

まとめ

Related Entries
Latest Entries