Rastercontainerbeheer in Power Apps (preview)

[Dit artikel is een pre-releasedocument en kan worden gewijzigd.]

Met het besturingselement Rastercontainer kunt u onderliggende onderdelen indelen in een rasterpatroon. U krijgt nauwkeurige controle over waar elk onderdeel heen gaat in termen van rijen en kolommen.

Deze container werkt als CSS-rasters. U definieert de rijen en kolommen en stelt de exacte positie in voor elk onderliggend onderdeel met behulp van de eigenschappen.

Description

Het besturingselement Rastercontainer biedt een flexibel indelingssysteem voor canvas-apps. Hiermee kunt u het volgende doen:

• Onderliggende onderdelen in een rasterpatroon plaatsen
• Geef het begin en einde van de rij en kolom op voor elk onderliggend item
• Responsieve aanpassingen aanbrengen wanneer de grootte van de container of het scherm verandert
• Uitlijning, afstand en overloop binnen het raster regelen

Door deze methode te gebruiken, hoeft u elk onderdeel niet handmatig te positioneren. Uw apps worden beter onderhoudbaar en responsief.

Eigenschappen weergeven

• Tussenruimte : de afstand in pixels tussen onderliggende onderdelen in het raster.
• Kolommen : het aantal kolommen in de rasterindeling.
• Rijen : het aantal rijen in de rasterindeling.

Grootte en positie

• X : de horizontale afstand van de linkerrand van de bovenliggende container (of het scherm als er geen bovenliggende container is).
• Y : de verticale afstand van de bovenrand van de bovenliggende container (of het scherm als er geen bovenliggende container is).
• Breedte : de afstand tussen de linker- en rechterrand van een besturingselement.
• Hoogte : de afstand tussen de boven- en onderrand van een besturingselement.
• Opvulling : de afstand tussen de containerranden en de onderliggende onderdelen.

Kleur en rand

• Kleur : voorgrondkleur van de container, gebruikt voor randen en tekst, indien van toepassing.
• Rand
  • Stijl : type rand: effen, onderbroken, gestippeld of Geen.
  • Dikte : breedte van de rand in pixels.
  • Kleur – Kleur van de rand.
• Randstraal : de mate waarin de hoeken van de container worden afgerond. U kunt deze instelling op alle hoeken uniform toepassen of opsplitsen in afzonderlijke hoeken in geavanceerde instellingen.
• Slagschaduw : schaduweffect toegepast op de container. Opties: Geen, Licht, Gemiddeld of Zwaar.

Zichtbaarheid

• Zichtbaar : of de rastercontainer wordt weergegeven. In- of uitschakelen.

Eigenschappen van rasterindeling (onderliggend)

• Begin- en kolomeinde: definieert de begin- en eindkolommen voor een onderliggend onderdeel.
• Begin- en eindrij van rij : definieert de begin- en eindrijen voor een onderliggend onderdeel.

Example

1. Maak een volledig nieuwe canvas-app met een responsieve indeling.

2. Maak een nieuw scherm.

3. Selecteer rastercontainer in het deelvenster Invoegen onder Indeling.

4. Stel containereigenschappen in om het volledige scherm te bezetten:

   • X = 0
   • Y = 0
   • Breedte = Parent.Width
   • Height = Parent.Height

5. Voeg verschillende onderliggende onderdelen toe, zoals knoppen, tekstinvoer, pictogrammen en media. Stel voor elk onderliggend element eigenschappen voor rasterplaatsing in:

   • Begin/einde van kolom
   • Begin/einde van rij
   • Uitlijnen in cel

6. Druk op F5 om een voorbeeld te bekijken. Wijzig het formaat van het scherm en kijk hoe onderliggende onderdelen in hun rasterposities blijven en responsief worden aangepast.