CodeZine(コードジン)

特集ページ一覧

DelphiアプリケーションをWindows 10対応したついでにiOSとAndroidにも対応してみた

最新のマルチデバイス開発環境で、Windows 10とモバイルデバイスの双方に対応したアプリケーションを構築

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2015/09/17 14:00

目次

各デバイス向けのカスタマイズ

FireUIマルチデバイスプレビュー

 画面右側のタブ「マルチデバイスプレビュー」をクリックすると、複数デバイス向けのプレビューが表示されます。この画面では、さまざまなデバイスで、現在設計しているUIが、どのように表示されるかを確認することができます。

図17 マルチデバイスプレビュー

 なるほど、適当に配置したUIは、それぞれのデバイスでは、幅が足りなかったり、画面サイズに全然合致してなかったり、全然ダメですね。マルチデバイス向けのUI設計の配慮が足りませんでした。

レイアウトの仕組みを使う

 マルチデバイスでは、画面の向きが縦と横があり、両方をサポートするのか、どちらかのみにするのかを決めなければなりません。例えば縦だけにしたとしても、幅は固定ではないので、柔軟にレイアウトされるように、レイアウト管理のしくみを使います。

 FireMonkeyでは、各コンポーネントに、Align、Anchorsといったプロパティがあり、画面のどこに位置するのか、どこを伸ばすのかといったことを指定できます。それぞれのコンポーネントは、パネルなどの上に配置できますから、伸縮する部分をグループ化して、パネルなどの上に置くとよいでしょう。

図18 グループ化したレイアウト

 これらの機能を駆使してみたところ、先ほどよりだいぶマルチデバイス対応のレイアウトになりました。

図19 改善したレイアウト

FireUIマルチデバイスデザイナを使う

 とはいえ、どうしても特別なレイアウト調整を加えなければならないデバイスもあります。そういったデバイスについては、FireUIマルチデバイスデザイナで、カスタマイズします。

図20 iPad向けのレイアウト

 全部のデバイスについてカスタマイズする必要はなく、マルチデバイスプレビューでチェックしてみて、問題があるな、と気がついたデバイスについてのみ、修正すればよいことに注意してください。

マルチデバイス対応の努力は続く

 さて、UIについては問題なく作成できましたが、せっかくなので、デバイスのカメラ機能なども使ってみたいところです。FireMonkeyでは、カメラやGPSなどの機能もコンポーネントによって利用できるので、どんどん拡張できそうです。

 本稿では、そこまで触れるスペースはありませんが、以下のような資料が参考になりそうです。

 また、Delphi(RAD StudioおよびC++Builder)のトライアル版は、こちらからダウンロードできます。



  • LINEで送る
  • このエントリーをはてなブックマークに追加

修正履歴

  • 2015/09/18 13:07 「はじめに」中の誤字を修正しました。

あなたにオススメ

著者プロフィール

  • EDN編集部(イーディーエヌ編集部)

    エンバカデロ・デベロッパーネットワーク(EDN)は、ソフトウェア開発者とデータベース技術者のための技術情報サイトです。Delphi、C++Builderをはじめとする開発ツールやER/Studioなどのデータベースツールに関連する技術記事、ビデオなどを提供しています。EDN編集部は、EDN記事と連携...

バックナンバー

連載:EDN CodeZine出張所

もっと読む

All contents copyright © 2005-2021 Shoeisha Co., Ltd. All rights reserved. ver.1.5