Dialog controle (experimenteel)
[Dit artikel maakt deel uit van de voorlopige documentatie en kan nog veranderen.]
Een besturingselement dat wordt gebruikt om inhoud te groeperen.
Belangrijk
- Dit is een experimentele functie.
- Experimentele functies zijn niet bedoeld voor productiegebruik en bieden mogelijk beperkte functionaliteit. Deze functies zijn beschikbaar voor een officiƫle release zodat klanten vroeg toegang kunnen krijgen en feedback kunnen geven.
Omschrijving
Een dialoogvenster (Dialog) is een tijdelijk pop-upvenster dat de focus van de pagina of app haalt en interactie met gebruikers vereist. Het wordt voornamelijk gebruikt voor het bevestigen van acties, zoals het verwijderen van een bestand of het vragen van gebruikers om een keuze te maken.
Dit canvasonderdeel bootst de stijl en het gedrag van het Fluent UI-besturingselement Dialog na. Zie documentatie voor best practices.
Bekijk het onderdeel in de Creator Kit GitHub-repository.
Eigenschappen
Belangrijke eigenschappen
Eigenschappen | Omschrijving |
---|---|
Buttons |
Een gegevensset die de knoppen definieert (zie eigenschappen hieronder) |
Title |
Tekst die wordt weergegeven in de titelsectie |
OverlayColor |
Kleur die wordt weergegeven in het overlay-gebied |
DialogWidth |
De breedte van het dialoogvenster (niet te verwarren met de breedte van het besturingselement, die de app-breedte moet omvatten) |
DialogHeight |
De hoogte van het dialoogvenster (niet te verwarren met de hoogte van het besturingselement, die de app-hoogte moet omvatten). |
SubTitle |
Tekst die wordt weergegeven onder de titel |
Buttons
eigenschappen
Eigenschappen | Omschrijving |
---|---|
Label |
Het label dat wordt weergegeven op de knop. |
ButtonType |
Opsomming die de stijl van de knop bepaalt. Kies tussen Standard en Primary . |
Table(
{
Label: "Cancel",
ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Standard
},{
Label: "Ok",
ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Primary
}
)
Stijleigenschappen
Eigenschappen | Omschrijving |
---|---|
Theme |
Theme-object. Zie Themagebruik voor richtlijnen voor configureren. |
Zie voor opmaak de richtlijnen in het gedeelte Inhoud van het deelvenster Opmaken van Paneel.
Eigenschappen van gebeurtenis
Eigenschappen | Omschrijving |
---|---|
OnCloseSelect |
Actie-expressie die wordt uitgevoerd wanneer de knop Sluiten wordt geselecteerd. |
OnButtonSelect |
Actie-expressie die wordt uitgevoerd wanneer een van de actieknoppen wordt geselecteerd. |
Gedrag
Zichtbaarheid van dialoogvenster configureren
Maak het besturingselement Dialog
zelf (of het oppervlak waarbinnen het zich bevindt) zichtbaar wanneer een variabele van het type booleaans (true/false) verandert in true, en wijs die variabele toe aan de zichtbaarheidseigenschap van het dialoogvenster. Nadat het dialoogvenster is weergegeven, kunt u het dialoogvenster verbergen door de variabele in de eigenschap reset bij te werken, die wordt geactiveerd wanneer het pictogram Sluiten wordt geselecteerd.
Hieronder ziet u de Power Fx-formule om het dialoogvenster te openen in een actieformule voor een ander onderdeel ergens in de app (bijvoorbeeld de eigenschap OnSelect
van een knop):
UpdateContext({ showHideDialog: true })
Hieronder ziet u de Power Fx-formule om het dialoogvenster te sluiten in de eigenschap OnCloseSelect
van het dialoogvenster:
UpdateContext({ showHideDialog: false })
Wijs de variabele toe aan de eigenschap Visible
van het dialoogvenster:
showHideDialog
Knopacties configureren
Geef in de eigenschap OnButtonSelect
van het dialoogvenster acties op in een voorwaarde If()
of Switch()
op basis van de tekstwaarde Self.SelectedButton.Label
om de actie te definiƫren. Afhankelijk van de actie kan het zinvol zijn om ook het dialoogvenster te sluiten nadat de actie is voltooid.
If( Self.SelectedButton.Label = "Send",
Notify("Email Sent")
);
UpdateContext({ showHideDialog: false })
Beperkingen
Dit canvasonderdeel kan alleen worden gebruikt in canvas-apps en aangepaste pagina's.