カスタマイズしたビューのビュー セレクタへの追加

提供: RAD Studio
移動先: 案内、 検索

FireMonkey ビューの使用 への移動


ターゲットとするデバイスの仕様が［使用可能］ビューのリストに含まれていない場合、新しいビューを作成してフォーム デザイナのビュー セレクタに追加することができます。

［使用可能］ビューのディスプレイ仕様

ビュー ファイル 最小物理サイズ   最大物理サイズ   最小論理サイズ   最大論理サイズ   PPI

［Windows デスクトップ］

System.Win.Devices

［Surface Pro］

System.Win.Devices

［Android 3.5 インチ スマートフォン］

System.Android.Devices

(800,500)

(1000,600)

(400,250)

(500,300)

320

［Android 4 インチ スマートフォン］

System.Android.Devices

(1280,800)

(1360,850)

(640,400)

(680,425)

320

［Android 5 インチ スマートフォン］

System.Android.Devices

(1708,960)

(1920,1200)

(854,480)

(960,600)

320

［Android 7 インチ タブレット］

System.Android.Devices

(1708,960)

(1920,1200)

(854,480)

(960,600)

320

［Android 10 インチ タブレット］

System.Android.Devices

(2400,1500)

(2560,1600)

(1200,750)

(1280,800)

320

［Google Glass］

System.Android.Devices

(640,360)

(640,360)

(427,240)

(427,240)

30

Sony SmartWatch 3

System.Android.Devices

(320,320)

(240,240)

283

Motorola Moto 360

System.Android.Devices

(320,290)

(240,218)

205

［iPhone 3.5 インチ］

System.iOS.Devices

(480,320)

(480,320)

163

［iPhone 4 インチ］

System.iOS.Devices

(1136,640)

(568,320)

326

［iPhone 4.7 インチ］

System.iOS.Devices

(1334, 750)

(667, 375)

326

［iPhone 5.5 インチ］

System.iOS.Devices

(2208, 1242)

(736, 414)

489

［iPad］

System.iOS.Devices

(2048,1536)

(1024,768)

264

［macOS デスクトップ］

System.Mac.Devices

メモ： 最大物理サイズと最大論理サイズだけのデバイスは、実際の正確なサイズで定義されています。

特定デバイス向けの Android ビューの追加

必要なビューを新規作成するには：

以下の例では、次のディスプレイ仕様を持つ Android デバイス向けのビューを作成する方法を説明します。

  • モデル：MyPhone
  • 対角線（インチ）：4.5
  • 解像度：720 x 1280 ピクセル
  • ピクセル密度：326 ppi
  • CSS ピクセル比：xhdpi（2 倍）

具体的なデバイスの仕様は、メーカーの Web サイトのカタログで確認することができます。

新規ビュー用に設定済みデバイスを追加する

ビュー セレクタでビューを選択してフォームをカスタマイズできるようにするには、［デバイス マネージャ］または DevicePresets.xml ファイルから設定済みデバイスを追加する必要があります。

メモ： ［デバイス マネージャ］から設定済みデバイスを追加する場合、C:\Users\<ユーザー名>\AppData\Roaming\Embarcadero\BDS\22.0 に移動して DevicePresets.xml を開き、<Name></Name> タグの間に書かれた自動生成された名前をコピーする必要があります。この名前とビュー パッケージで使用するビューの名前とが一致する必要があります。
警告： DevicePresets.xml ファイルの編集時には慎重に確認されることをお勧めします。xml タグを修正する場合には、大文字/小文字が間違っていないかを必ず確認してください。間違っていると、デザイナがそのタグを理解できず、予想できない動作をします。
  1. C:\Users\<ユーザー名>\AppData\Roaming\Embarcadero\BDS\22.0 に移動します。
    メモ： これは隠しフォルダです。表示されていない場合には、Windows の［コントロール パネル］の［フォルダー オプション］ダイアログ ボックスで、［隠しファイル、隠しフォルダー、および隠しドライブを表示する］を選択してください。
  2. ファイルをテキスト エディタで開きます。
  3. <MobileDevices RepositoryVersion="3"> タグの中に、次のような MobileDevice 要素を新しく追加します。 
      <MobileDevice>
    <Name>TestView</Name> <!-- Same unique ID used in the creation package if you are registering a new View -->
    <Displayname>My Android Phone</Displayname> <!-- Name to show in the Device Manager, View Selector and Multi-Device Preview -->
    <DevicePlatform>3</DevicePlatform>
    <FormFactor>2</FormFactor>
    <UserData>True</UserData>
    <Portrait Enabled="True" Width="360" Height="640" Top="61" Left="44" StatusbarHeight="25" StatusBarPos="0" Artwork="ARTWORK_PATH"/>
    <UpsideDown Enabled="True" Width="360" Height="640" Top="68" Left="47" StatusbarHeight="25" StatusBarPos="0" Artwork="ARTWORK_PATH"/>
    <LandscapeLeft Enabled="True" Width="640" Height="360" Top="44" Left="68" StatusbarHeight="25" StatusBarPos="0" Artwork="ARTWORK_PATH"/>
    <LandscapeRight Enabled="True" Width="640" Height="360" Top="47" Left="61" StatusbarHeight="25" StatusBarPos="0" Artwork="ARTWORK_PATH"/>
  </MobileDevice>
    メモ：
    • ARTWORK_PATH を、アートワークの正しいパスに置き換える必要があります。
    • デバイス プリセットを非四角形で定義したい場合、Mask フィールドを使用します。

    詳細は、「DevicePresets.xml の要素」を参照してください。

  4. 変更内容を有効にするには、IDE を再起動します。

IDE を再起動すると、新しい設定済みデバイスが「［デバイス マネージャ］」と「［マルチデバイス プレビュー］」に表示されます。

パッケージを新規作成する

  1. ［ファイル｜新規作成｜パッケージ - Delphi］または［ファイル｜新規作成｜パッケージ - C++Builder］を選択します。
  2. ［プロジェクト マネージャ］で、<プロジェクト名.bpl> を右クリックします。
  3. ［新規追加｜ユニット］を選択します。
  4. ユニットに以下のコードを追加します。
  • Delphi の場合：
unit Unit1;

interface

implementation

uses

  system.Devices, system.Types, system.SysUtils;

const
  ViewName = 'TestView'; // The unique name of the view, it has to be the same name as the one written between <Name></Name> tags of the DevicePreset.xml file.

initialization

  TDeviceinfo.AddDevice(TDeviceinfo.TDeviceClass.Phone, ViewName,
    TSize.Create(1216, 684), TSize.Create(1216 div 2, 684 div 2), // MinPhysicalSize(max, min), MinLogicalSize(max, min)
    TSize.Create(1280, 720), TSize.Create(1280 div 2, 720 div 2), // MaxPhysicalSize(max,min), MaxLogicalSize(max,min)
    TOSVersion.TPlatform.pfAndroid, 326); //Select the platform and the pixel density.

finalization

  TDeviceinfo.RemoveDevice(ViewName); // To unregister the view after unistalling the package.

end.
  • C++ の場合：

.cpp ファイルに次のコードを追加します。 

#include "Unit1.h"
#include <System.Devices.hpp>
// ---------------------------------------------------------------------------
#pragma package(smart_init)

void initdevice() {

    TDeviceInfo::AddDevice(TDeviceInfo::TDeviceClass::Phone, "TestView", // The unique name of the view, it has to be the same name as the one written between <Name></Name> tags of the DevicePreset.xml file.
        TSize(1216, 684), TSize(1216 / 2, 684 / 2), TSize(1280, 720),
        TSize(1280 / 2, 720 / 2), TOSVersion::TPlatform::pfAndroid, 326);
}

.h ファイルに次のコードを追加します。 

void initdevice();
#pragma startup initdevice 42
  1. パッケージをインストールする前に、デザイナで開いているプロジェクトがあればすべて閉じます。
  2. ［プロジェクト マネージャ］で、<プロジェクト名.bpl> を右クリックします。
  3. ［インストール］をクリックします。
  4. パッケージがインストールされたことを示す［情報］メッセージが表示されます。
  5. 変更内容を有効にするには、IDE を再起動します。

IDE を再起動すると、新しい設定済みデバイスが「ビュー セレクタ」と同様に、「［デバイス マネージャ］」、「［マルチデバイス プレビュー］」に表示されます。

新規ビューの使用

設定済みデバイスの追加、パッケージのインストール、IDE の再起動が完了すると、ビュー セレクタでビューが使用可能になります。このビューは、xml ファイルに定義された表示名で表示されます。

CustomizedView.png

マルチデバイス プロジェクトを対応するデバイスで動作させる際、カスタマイズしたビューを使用するには、以下を行う必要があります。

  • たとえば、.pas ユニットをプロジェクトに追加するなどして、プロジェクトからビューのユニットを参照します。
警告： プロジェクトでビューのユニットを参照するには、たとえ必要がなくても、ビューを登録してください。

プロジェクトを実行すると、選択したデバイスに最も適したビューが、アルゴリズムによって選択されます。 カスタマイズしたビューがターゲット デバイスに最も適したビューであれば、そのビューが起動されます。 システムは、ターゲット プラットフォームと互換性のないビューは無視します。

カスタマイズしたビューの削除

（「パッケージを新規作成する」ステップでパッケージに追加した）カスタマイズしたビューをビュー セレクタから登録解除するには、次のコードが必要です。 

const
    ViewName = 'TestView';

finalization
    TDeviceinfo.RemoveDevice(TestView);

カスタマイズしたビューをビュー セレクタから削除するには：

  1. カスタマイズしたビューを含んでいるパッケージをアンインストールする前に、フォームをすべて閉じます。
  2. ［コンポーネント｜パッケージのインストール...］を開きます。
  3. 削除したいパッケージを選択します。
  4. ［削除］をクリックします。

パッケージを削除した後、そのデバイスのプリセットがそれ以降必要がない場合には、デバイスのプリセットを削除しても構いません。その際には、デバイス マネージャからデバイス プリセットを削除するか、前のステップで追加した関連情報を DevicePresets.xml から削除します。

メモ： 変更が反映されるのに、IDE の再起動が必要な場合があります。

関連項目

「https://docwiki.embarcadero.com/RADStudio/Alexandria/j/index.php?title=カスタマイズしたビューのビュー_セレクタへの追加&oldid=250149」から取得