Hinzufügen einer angepassten Ansicht zur Ansichtsauswahl

Nach oben zu Verwenden von FireMonkey-Ansichten

Wenn die verfügbaren Ansichten die Spezifikationen Ihres Zielgeräts nicht abdecken, können Sie neue Ansichten erstellen und sie der Ansichtsauswahl im Formular-Designer hinzufügen.

Display-Spezifikationen für verfügbare Ansichten

Ansicht	Datei	Min. physikalische Größe	Max. physikalische Größe	Min. logische Größe	Max. logische Größe	PPI
Windows-Desktop	System.Win.Devices
Surface Pro	System.Win.Devices
Android 3,5 Zoll Phone	System.Android.Devices	(800,500)	(1000,600)	(400,250)	(500,300)	320
Android 4 Zoll Phone	System.Android.Devices	(1280,800)	(1360,850)	(640,400)	(680,425)	320
Android 5 Zoll Phone	System.Android.Devices	(1708,960)	(1920,1200)	(854,480)	(960,600)	320
Android 7 Zoll Tablet	System.Android.Devices	(1708,960)	(1920,1200)	(854,480)	(960,600)	320
Android 10 Zoll Tablet	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 Zoll	System.iOS.Devices		(480,320)		(480,320)	163
iPhone 4 Zoll	System.iOS.Devices		(1136,640)		(568,320)	326
iPhone 4,7 Zoll	System.iOS.Devices		(1334, 750)		(667, 375)	326
iPhone 5,5 Zoll	System.iOS.Devices		(2208, 1242)		(736, 414)	489
iPad	System.iOS.Devices		(2048,1536)		(1024,768)	264
macOS Desktop	System.Mac.Devices

Hinweis: Für Geräte mit Werten nur für MaxPhysicalSize und MaxLogicalSize sind die tatsächlichen, exakten Dimensionen angegeben.

Hinzufügen einer Android-Ansicht für ein bestimmtes Gerät

Um eine neue Ansicht zu erstellen, müssen Sie:

• Hinzufügen der Geräte-Voreinstellung für die neue Ansicht.
• Das Package mit der neuen Ansicht hinzufügen und installieren.

Im folgenden Beispiel wird gezeigt, wie eine Ansicht für ein Android-Gerät mit den folgenden Display-Spezifikationen erstellt wird:

• Modell = MyPhone
• Diagonale (Zoll) = 4,5
• Auflösung = 720 x 1280 Pixel
• Punktdichte = 326 ppi (Pixel pro Zoll)
• CSS-Pixelverhältnis = xhdpi (2,0x)

Die Spezifikationen für ein bestimmtes Gerät finden Sie im Datenblatt auf der Hersteller-Website.

Hinzufügen der Geräte-Voreinstellung für die neue Ansicht

Um die Ansicht in der Ansichtsauswahl zu aktivieren und deren Formular anzupassen, müssen Sie die Geräte-Voreinstellung aus dem Gerätemanager oder aus der Datei DevicePresets.xml hinzufügen:

• Um die neue Geräte-Voreinstellung aus dem Gerätemanager hinzuzufügen, führen Sie die folgenden Schritte zum Hinzufügen einer Geräte-Voreinstellung aus.

Hinweis: Beim Hinzufügen einer Geräte-Voreinstellung aus dem Gerätemanager müssen Sie die Datei DevicePresets.xml aus dem Verzeichnis C:\Users\<Benutzername>\AppData\Roaming\Embarcadero\BDS\22.0 öffnen und den automatisch generierten Namen zwischen den <Name></Name>-Tags kopieren. Dieser Name muss mit dem im Ansichts-Package verwendeten Namen der Ansicht übereinstimmen.

• Um die neue Geräte-Voreinstellung aus der Datei DevicePresets.xml hinzufügen, führen Sie die folgenden Schritte aus:

Warnung: Überprüfen Sie die Änderungen in der Datei DevicePresets.xml äußerst sorgfältig. Achten Sie insbesondere auf die korrekte Schreibweise (groß oder klein) der XML-Tags. Andernfalls kann der Designer sie nicht erkennen und möglicherweise unerwartetes Verhalten zeigen.

1. Wechseln Sie zum Ordner C:\Benutzer\<Benutzername>\AppData\Roaming\Embarcadero\BDS\22.0.

   Hinweis: Dies ist ein verborgener Ordner. Wenn er nicht angezeigt wird, aktivieren Sie in der Windows-Systemsteuerung im Dialogfeld Ordneroptionen die Option Versteckte Dateien, Ordner und Treiber anzeigen.

2. Öffnen Sie die Datei in einem Texteditor.
3. Fügen Sie im Tag <MobileDevices RepositoryVersion="3"> ein neues MobileDevice;-Element wie folgt hinzu:

     <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>
   

   Hinweise:

   • Sie müssen ARTWORK_PATH durch den korrekten Pfad zu Ihren Grafiken, Symbolen etc. ersetzen.
   • Wenn Sie eine Geräte-Voreinstellung mit einer nicht rechteckigen Form festlegen möchten, verwenden Sie das Mask-Feld.

   Weitere Informationen finden Sie unter Elemente von DevicePresets.xml.

4. Starten Sie die IDE neu, damit die Änderungen wirksam werden.

Nach dem Neustart der IDE wird die neue Geräte-Voreinstellung im Gerätemanager und im Fenster Geräteübergreifende Vorschau angezeigt.

Erstellen eines neuen Package

1. Wählen Sie Datei > Neu > Package - Delphi oder C++Builder.
2. Klicken Sie in der Projektverwaltung mit der rechten Maustaste auf den Knoten <Projektname.bpl>.
3. Wählen Sie Neue hinzufügen > Unit.
4. Fügen Sie der Unit den folgenden Code hinzu:

• 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++:

Fügen Sie diesen Code der .cpp-Datei hinzu:

#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);
}

Fügen Sie diesen Code der .h-Datei hinzu:

void initdevice();
#pragma startup initdevice 42

5. Schließen Sie vor dem Installieren des Package alle geöffneten Projekte im Designer.
6. Klicken Sie in der Projektverwaltung mit der rechten Maustaste auf den Knoten <Projektname.bpl>.
7. Klicken Sie auf Installieren.
8. Es wird eine Informationsmeldung angezeigt, die Sie darüber informiert, dass das Package installiert wurde.
9. Starten Sie die IDE neu, damit die Änderungen wirksam werden.

Nach dem Neustart der IDE wird die neue Geräte-Voreinstellung im Gerätemanager, im Fenster Geräteübergreifende Vorschau sowie in der Ansichtsauswahl angezeigt.

Verwenden der neuen Ansicht

Nach dem Hinzufügen der Geräte-Voreinstellung, dem Installieren des Package und dem Neustart der IDE steht die Ansicht in der Ansichtsauswahl zur Verfügung. Sie wird mit dem in der XML-Datei festgelegten Anzeigenamen angezeigt.

Um die angepasste Ansicht beim Ausführen des geräteübergreifenden Projekts auf dem entsprechenden Gerät zu verwenden, müssen Sie folgendermaßen vorgehen:

• Referenzieren Sie in Ihrem Projekt die Unit der Ansicht, beispielsweise, indem Sie Ihrem Projekt die Unit .pas hinzufügen.

Warnung: Beim Referenzieren auf die Ansichts-Unit in Ihrem Projekt, wird die Ansicht registriert, selbst wenn es nicht nötig ist.

Beim Ausführen des Projekts wählt ein Algorithmus die geeignetste Ansicht für das ausgewählte Gerät aus. Wenn die benutzerdefinierte Ansicht die geeignetste Ansicht für das Zielgerät ist, wird diese Ansicht aufgerufen. Das System ignoriert die Ansichten, die mit der Zielplattform nicht kompatibel sind.

Entfernen von angepassten Ansichten

Mit dem folgenden Code können Sie die Registrierung einer angepassten Ansicht in der Ansichtsauswahl aufheben (der Ansicht, die dem Package im Schritt Erstellen eines neuen Package hinzugefügt wurde).

const
    ViewName = 'TestView';

finalization
    TDeviceinfo.RemoveDevice(TestView);

So entfernen Sie eine angepasste Ansicht aus der Ansichtsauswahl:

1. Schließen Sie alle Formulare, bevor Sie ein Package mit angepassten Ansichten deinstallieren.
2. Wählen Sie Komponente > Packages installieren....
3. Wählen Sie das Package aus, das Sie entfernen möchten.
4. Klicken Sie auf Entfernen.

Wenn Sie die Geräte-Voreinstellung nicht mehr benötigen, können Sie nach dem Entfernen des Packages die Geräte-Voreinstellung löschen, indem Sie die Geräte-Voreinstellung aus dem Gerätemanager löschen oder die betreffenden Informationen, die im vorherigen Schritt hinzugefügt wurden, aus der Datei DevicePresets.xml löschen.

Hinweis: Sie müssen die IDE eventuell neu starten, damit die Änderungen wirksam werden.

Siehe auch

• Hinzufügen von Ansichten zu einem geräteübergreifenden Projekt
• Formular-Designer
• Gerätemanager
• Geräteübergreifende Vorschau