iPadをHDMI経由でモニタ表示した際の非表示領域がもったいないのでなんとかしたい!

仕事でiPadを使った子供向けのプログラミングの授業を行っていて、そのときに発生した悩みをようやく解決できそうなので情報をまとめました。悩みとは以下の画面の赤く枠を付けた部分になります。

f:id:ueponx:20210406001102p:plain

悩み(その1)

プロジェクタにiPadを縦向きに表示させるのですが、プロジェクタは横向きの画面なのでiPadを縦向きに接続すると、余白が黒くなりかなり表示領域が小さくなってしまいます。100インチぐらいのプロジェクタでも実際には1/3程度の表示領域になってしまうということもあります。さすがにちょっともったいないなあとおもっていました。

最近はサイネージの需要もあり、縦向きに配置することができるモニタも増えているので、このあたりは解決するかなと思っていたのですが…まだまだ、モニタ縦向きに配置しても、設定上は横向きの解像度に設定しているため、モニタの向きが変えられないということはよくあります。(モニタ側で解像度設定ができるといいのですが、できないものがほとんどのようです)プロジェクタに関して言えば、縦向き表示できるようなものはそもそもなく、たまにあっても恐ろしく値が張るようなものしかないといった状況でした。

ピボット(画面回転)対応ディスプレイ(縦向きに回転できるPC用のモニタ)もありますが27インチほどにとどまっているようです。そのうちもう少し大きめのものがでてくるとは思いますが、それを使うとかなり大きい縦向きモニタも使えると思うのですが…

悩み(その2)

iPad(Lightning)とHDMIの変換を行うには以下を使っています。

USB Type-Cポートの場合には以下のようなものを使うことになると思います。

授業を行っているので、このようなアダプタを少なくとも週に4回ぐらいはこの抜き差しをしていることもあり、アダプタのケーブル部分にも、コネクタ部分にも負荷がかかり壊れる可能性もあるなあとよく思います。個人的にはHDMIケーブルは長さも割とありケーブルにも重さがあるため、痛みやすくコネクタも強度が低いと感じています。

そういう悩みもあり、有線での接続をなんとか無線接続にできればという希望もあります。接続による遅延に関してはAirPlayにて試しましたがほぼ気にならない程度だったので、先程の悩みであった以下を解決できないか考えて見ようと思います。

  • 縦向きモニタの対応(表示有効範囲の拡大化)
  • 無線化(コネクタ部の故障不安の軽減)

今回はそれに対する試行錯誤をまとめています。

無線化を考えてみた

無線化を行うデバイスとアプリFire TV StickとAirReceiverを導入

AmazonバイスであるFire TV StickにAirPlay接続をするアプリであるAirReceiver(有料)をインストールしてみます。

これを導入することで無線化を簡単にすることができます。遅延に関してはほぼない感じですし、PCになどを使用することもないので割と安価に仕上げることはできるかなと思います。

上記2つ購入しても5千円オーバーぐらいでしょうか。セールでFire TV Stickを購入できればもっと安く揃えることは可能です。

Fire TV Stickの画面がHDCPのためにキャプチャできない…と思ったのですが、Fire TV StickのADBを使用することでキャプチャができました。

以下のようにAirReceiverアプリをインストールしていきます。

f:id:ueponx:20210404001340p:plain

そして、起動後にAirPlayで接続を行うと以下のように表示することができます。

f:id:ueponx:20210404001345p:plain

黒く残った非表示領域がもったいない…横に向けると一応非表示領域は小さくできるのですが…

f:id:ueponx:20210404001349p:plain

MakeCode以外でも普通に使用できます。

f:id:ueponx:20210404001353p:plain

これで無線化に関しては簡単実現できていますが、縦向きのモニタには対応していないので表示領域の有効化はできません。大きな表示のできるモニタがあっても、非表示領域のために、その数分の1しか表示領域がないのは残念です。

WindowsPCで使用可能なAirPlayアプリを使用する

続いてはWindowsでも使用可能なAirPlayアプリを仕様するという方法です。これを使用するとWindows側でPCのモニタの方向を回転させる機能があるのでそれをしようすることで、縦向きモニタのように使用する事ができます。モニタを縦向きにしてiPadの有効表示領域を増やすことには成功しています。

自分は以下の2つのアプリをつかってみました。

AirServer(有料)

かなり古参のAirPlayアプリです。

www.airserver.com

f:id:ueponx:20210330021248p:plain

これを使うと操作遅延が発生するので、操作しながらのレクチャーを中心にする用途としては使いにくいかな?

本格的に使用するには有料にする必要があります。自分はビジネス用途だったので4290円で購入しました(これも少し高いなあ)。AirPlayアプリは基本有料のものがほとんどですね。

ApowerMirror(有料)

WiFi経由でも、USBケーブル経由でもiPadなどのモニタをミラーリングすることのできるアプリになります。

www.apowersoft.jp

こちらは割と遅延が少ないのでかなりお勧めですし、価格も前者よりも安価なのもいいですね。

f:id:ueponx:20210330022211p:plain

ApowerMirrorは有線接続にするとほとんど遅延もないので、iPadの画面を表示しながらスライド表示をするような授業を行うときにはこれを使用しています。 非表示の部分が黒くなるぐらいであれば、スライドなどを余白に表示できれば効果を考えればよいかもしれません。ただ、子どもたちが見たときに何を見ればいいのかわからなくなるほどの情報量があるので、使い所を考えたほうがいいのかも?

以下の表示では、画面の左側にApowerMirrorでのiPadの映像、右側にはPDFの表示をしています。

f:id:ueponx:20210405234701j:plain

個人的にはこの組み合わせはかなり気に入っていますけどね。

よしRaspberryPiでも参戦だ!

こういう用途でもRaspberryPiは使用できるのか調べてみました。検索すると以下のようなエントリが見つかりました。

qiita.com

RPiPlayを使用することでAirPlay対応になるとのことです。これは早速ためしてみないと!

参考にしたエントリの情報でほぼ大丈夫かなと思ったのですがトラブルの引きの強い私はすんなりとは行かなかったです。

以下が公式のリポジトリになります。

github.com

ここからgitコマンドを使用して導入を行っていきます。

リポジトリのクローン

$ git clone https://github.com/FD-/RPiPlay.git
$ cd RPiPlay

クローンができたら、ビルドを行っていきます。

ビルド

$ sudo apt install cmake
$ sudo apt install libavahi-compat-libdnssd-dev
$ sudo apt install libplist-dev
$ sudo apt install libssl-dev
$ mkdir build
$ cd build
$ cmake ..
$ make

ビルド時にはエラーのような表示も行われますが実際にはうまく行っているようです。ビルドの完了をしたら以下のように起動します。

$ ./rpiplay -n MyAirPlay -b auto -r 270

この実行により縦向き画面モード(270°の回転)となり、オプションで設定を行ったMyAirPlayという名前でAirPlayバイスを検出することができます。

f:id:ueponx:20210403225638p:plain

以下の様に認識されます。

f:id:ueponx:20210403230053p:plain

そして、問題なくAirPlayの使用してのキャストができるようになりました。 270度の回転(縦向きモニタへの対応)もアプリ側でできているので悩みが一気に解決して素晴らしい!厳密に言うと解像度の縦横比の問題で非表示領域が小さくなっているだけなのですが…

f:id:ueponx:20210403230102p:plain

それでも有効な領域が増えているのでかなりマシです。

rpiplayの起動オプション

現時点では、以下のオプションが実装されています。

  • -n name … ネットワーク名に現れるAirPlayデバイス名を指定します。
  • -b ( on | auto | off) … 常に黒い背景を表示するか、アクティブな接続中のみ表示するか、表示しないかを指定します。
  • -r ( 90 | 180 | 270) … 画像の回転を90度の倍数で指定します。
  • -f ( horiz | vert | both ) … 画像の反転を指定します。画像の反転を指定します。
  • -l … ローレイテンシーモードを有効化。オーディオやビデオのフレームを受信すると同時に関連するタイムスタンプを無視してレンダリングすることで遅延を減らします。再生が途切れたり、オーディオとビデオの同期がずれるという副作用が発生することもあるので注意が必要です。
  • -a ( hdmi | analog | off ) … オーディオ出力デバイスの設定
  • -vr renderer … 使用するビデオレンダラを選択します。rpi、gstreamer、またはダミーのビデオレンダラが設定可能。(デフォルトはgstreamerのようです)
  • -ar renderer … 使用するオーディオレンダラを選択します。rpi、gstreamer、またはダミーのオーディオレンダラが設定可能。(デフォルトはgstreamerのようです)
  • -d … デバッグログを有効にします。コンソール出力が多いため、再生が途切れることがあります。
  • -v または -h … ショートヘルプとバージョン情報を表示します。

おわりに

今回に関してはMacがあれば問題ないのかも?ただ、WindowsPCしかない場合にはAirPlayの有料アプリを使うことになってしまうのかなというところに、RaspberryPiでの救世主的なアプリの発見。しかも、画面回転にも対応しているとは!

HDMIモニタを縦向き表示しているサイネージだけでなく、30インチ程度のピボット(画面回転)対応ディスプレイを持っている場合でもかなり有効な気がします。縦向きのゲームなどでも対応できるならかなり有効なのではないですかね?

個人的には入力ソースに関わらず、モニタ側で強制的に入力方向の設定できるようになるといいのですが…。