Erstellen einer für Mobilgeräte optimierten App

Überblick

Sie können UiPath Apps verwenden, um für Mobilgeräte optimierte Apps zu erstellen. Dieselbe App kann problemlos auf Geräten mit unterschiedlichen Bildschirmgrößen wie Mobiltelefonen, Tablets oder Computern verwendet werden.

To demonstrate this, follow the steps from the Tutorial section.

Am Ende dieser Seite finden Sie auch eine Beispiel-App-Datei mit weiteren Beispielen.

Tutorial

Verwenden Sie dieses Beispiel, um eine App zu erstellen, die drei Felder und eine Schaltfläche zum Senden enthält. Diese App verhält sich je nach Bildschirmgröße unterschiedlich.

1. Erstellen Sie eine neue App.

2. Fügen Sie Ihrer App ein Container -Steuerelement hinzu.

   2.1 Legen Sie das Layout des Containers auf Horizontal fest .

   2.2 Aktivieren Sie die Eigenschaft Wrapping zulassen des Containers.

   2.3 Konfigurieren Sie die Breite des Containers als 100 % .

   

3. Fügen Sie ein Textbox -Steuerelement im Container hinzu.

   3.1 Fügen Sie Name in der Label- Eigenschaft hinzu.

   3.2 Ändern Sie die Beschriftungsplatzierung auf der Registerkarte Stil in Oben .

4. Fügen Sie nach dem ersten ein zweites Textfeld -Steuerelement hinzu.

   4.1 Fügen Sie Age in der Eigenschaft Label hinzu.

   4.2 Ändern Sie die Beschriftungsplatzierung auf der Registerkarte Stil in Oben .

5. Fügen Sie nach dem zweiten ein drittes Textfeld -Steuerelement hinzu.

   4.1 Fügen Sie Address in der Eigenschaft Label hinzu.

   4.2 Ändern Sie die Beschriftungsplatzierung auf der Registerkarte Stil in Oben .

6. Fügen Sie einen zweiten Container unter dem ersten mit denselben Style- Eigenschaften hinzu.

7. Fügen Sie ein Button -Steuerelement im zweiten Container hinzu.

   

Ergebnis und Tests

Sie können Ihre App jetzt in der Vorschau anzeigen und testen.

Führen Sie die folgenden Schritte aus, um Ihre App mit dem Google Chrome -Browser zu testen:

1. Klicken Sie mit der rechten Maustaste auf eine beliebige Stelle auf der Seite.

2. Wählen Sie Überprüfen aus dem Menü aus.

3. Klicken Sie im Menü auf der rechten Seite auf Gerätesymbolleiste umschalten .

4. Wählen Sie die gewünschten Dimensionen aus der Dropdownliste oben auf der Seite aus, um Ihre App zu testen.

   

   Tipp:

   Im Fall des Container-Layout -Steuerelements sind die darin enthaltenen Container automatisch für Mobilgeräte optimiert. Wenn die Steuerelemente in den Containern ebenfalls reaktiv sein müssen, verwenden Sie die Eigenschaft Umbruch zulassen .

Weitere Beispiele finden Sie unten in der Beispiel-App-Datei.

Beispiel herunterladen