各デバイス向けのカスタマイズ
FireUIマルチデバイスプレビュー
画面右側のタブ「マルチデバイスプレビュー」をクリックすると、複数デバイス向けのプレビューが表示されます。この画面では、さまざまなデバイスで、現在設計しているUIが、どのように表示されるかを確認することができます。
なるほど、適当に配置したUIは、それぞれのデバイスでは、幅が足りなかったり、画面サイズに全然合致してなかったり、全然ダメですね。マルチデバイス向けのUI設計の配慮が足りませんでした。
レイアウトの仕組みを使う
マルチデバイスでは、画面の向きが縦と横があり、両方をサポートするのか、どちらかのみにするのかを決めなければなりません。例えば縦だけにしたとしても、幅は固定ではないので、柔軟にレイアウトされるように、レイアウト管理のしくみを使います。
FireMonkeyでは、各コンポーネントに、Align、Anchorsといったプロパティがあり、画面のどこに位置するのか、どこを伸ばすのかといったことを指定できます。それぞれのコンポーネントは、パネルなどの上に配置できますから、伸縮する部分をグループ化して、パネルなどの上に置くとよいでしょう。
これらの機能を駆使してみたところ、先ほどよりだいぶマルチデバイス対応のレイアウトになりました。
FireUIマルチデバイスデザイナを使う
とはいえ、どうしても特別なレイアウト調整を加えなければならないデバイスもあります。そういったデバイスについては、FireUIマルチデバイスデザイナで、カスタマイズします。
全部のデバイスについてカスタマイズする必要はなく、マルチデバイスプレビューでチェックしてみて、問題があるな、と気がついたデバイスについてのみ、修正すればよいことに注意してください。
マルチデバイス対応の努力は続く
さて、UIについては問題なく作成できましたが、せっかくなので、デバイスのカメラ機能なども使ってみたいところです。FireMonkeyでは、カメラやGPSなどの機能もコンポーネントによって利用できるので、どんどん拡張できそうです。
本稿では、そこまで触れるスペースはありませんが、以下のような資料が参考になりそうです。
- RAD Studio 10 Seattle機能評価ガイド
- Appmethodでカメラアプリ作成体験(Appmethodは、RAD Studioのマルチデバイス開発機能を無料から利用できるツールです)
また、Delphi(RAD StudioおよびC++Builder)のトライアル版は、こちらからダウンロードできます。