Rastercontainer-Steuerelement in Power Apps

Mit dem Rastercontainer-Steuerelement können Sie untergeordnete Komponenten in einem Rastermuster layouten. Sie erhalten präzise Kontrolle darüber, wo die einzelnen Komponenten in Bezug auf Zeilen und Spalten liegen.

Dieser Container funktioniert wie CSS-Formatraster. Sie definieren die Zeilen und Spalten und legen die genaue Position für jede untergeordnete Komponente mithilfe der zugehörigen Eigenschaften fest.

Description

Das Rastercontainersteuerelement bietet ein flexibles Layoutsystem für Canvas-Apps. Dies erlaubt Ihnen:

• Platzieren untergeordneter Komponenten in einem Rastermuster
• Angeben des Zeilen- und Spaltenanfangs und -endes für jedes untergeordnete Element
• Reaktionsfähige Anpassungen vornehmen, wenn sich der Container oder die Bildschirmgröße ändert
• Steuern der Ausrichtung, des Abstands und des Überlaufs innerhalb des Rasters

Mit diesem Ansatz müssen Sie jede Komponente nicht manuell positionieren. Ihre Apps werden wartungsfähiger und reaktionsfähiger.

Display properties

• Abstand – Der Abstand in Pixeln zwischen untergeordneten Komponenten innerhalb des Rasters.
• Spalten – Die Anzahl der Spalten im Rasterlayout.
• Zeilen – Die Anzahl der Zeilen im Rasterlayout.

Größe und Position

• X – Der horizontale Abstand vom linken Rand des übergeordneten Containers (oder Bildschirm, wenn kein übergeordnetes Element).
• Y – Der vertikale Abstand vom oberen Rand des übergeordneten Containers (oder Bildschirm, wenn kein übergeordnetes Element).
• Width – Der Abstand zwischen den linken und rechten Rändern eines Steuerelements.
• Höhe – Der Abstand zwischen den oberen und unteren Rändern eines Steuerelements.
• Abstand – Der Abstand zwischen den Containerrändern und den untergeordneten Komponenten.

Farbe und Rahmen

• Farbe – Vordergrundfarbe des Containers, verwendet für Rahmen und Text, falls zutreffend.
• Border
  • Formatvorlage – Rahmentyp: Einfarbig, gestrichelt, gepunktet oder Keine.
  • Stärke – Breite des Rahmens in Pixeln.
  • Farbe – Farbe des Rahmens.
• Rahmenradius – Der Grad, in dem die Ecken des Containers gerundet werden. Sie können diese Einstellung auf alle Ecken einheitlich anwenden oder in einzelne Ecken in erweiterten Einstellungen aufteilen.
• Schlagschatten – Schatteneffekt, der auf den Container angewendet wird. Optionen: Keine, Hell, Mittel oder Schwer.

Visibility

• Sichtbar – Gibt an, ob der Rastercontainer angezeigt wird. Ein- oder Ausschalten.

Rasterlayouteigenschaften (child-specific)

• Spaltenanfang /Spaltenende – Definiert die Anfangs- und Endspalten für eine untergeordnete Komponente.
• Zeilenanfang/Zeilenende – Definiert die Anfangs- und Endzeilen für eine untergeordnete Komponente.

Example

1. Erstellen Sie eine leere Canvas-App ganz neu mit einem dynamischen Layout.

2. Erstellen Sie einen neuen Bildschirm.

3. Wählen Sie im Bereich "Einfügen " unter "Layout" die Option "Rastercontainer" aus.

4. Legen Sie Containereigenschaften fest, um den Vollbildmodus zu belegen:

   • X = 0
   • Y = 0
   • Breite = Parent.Width
   • Höhe = Eltern.Höhe

5. Fügen Sie mehrere untergeordnete Komponenten hinzu, z. B. Schaltflächen, Texteingaben, Symbole und Medien. Legen Sie für jedes untergeordnete Element die Rasterplatzierungseigenschaften fest:

   • Spaltenanfang /Ende
   • Zeilenanfang /Ende
   • In Zelle ausrichten

6. Drücken Sie F5 , um eine Vorschau anzuzeigen. Ändern Sie die Größe des Bildschirms, und beobachten Sie, wie untergeordnete Komponenten in ihren Rasterpositionen verbleiben und reaktionsfähig anpassen.