Nav controle

Een besturingselement dat wordt gebruikt om te navigeren.

Notitie

Volledige documentatie en broncode vindt u in de GitHub-opslagplaats voor codeonderdelen.

Omschrijving

Een navigatievenster (Nav) biedt koppelingen naar de belangrijkste delen van een app of site.

Het codeonderdeel Nav maakt het gebruik mogelijk van het Fluent UI-menuonderdeel Nav vanuit canvas-apps en aangepaste pagina's.

Notitie

Onderdeelbroncode en meer informatie is beschikbaar in de GitHub-opslagplaats voor codeonderdelen.

Eigenschappen

Belangrijke eigenschappen

Eigenschappen	Omschrijving
Selected key	De te selecteren sleutel. Dit wordt bijgewerkt via de gebeurtenis OnChange wanneer de gebruiker werkt met het besturingselement.
Items	Vereist. De tabel met gegevensbronitems die moet worden weergegeven.
Fields	Vereist. De velden die zijn opgenomen uit de gegevensset.

Items eigenschappen

Elk item gebruikt het onderstaande schema om gegevens in het onderdeel te visualiseren.

Name	Omschrijving
ItemDisplayName	De weergavenaam van de opdracht/het tabblad/het menu-item
ItemKey	De toets die moet worden gebruikt om aan te geven welk item is geselecteerd en bij het toevoegen van subitems. De toetsen moeten uniek zijn.
ItemEnabled	Stel in op false als de optie is uitgeschakeld
ItemVisible	Stel in op false als de optie niet zichtbaar is
ItemIconName	Het Fluent UI-pictogram dat moet worden gebruikt (zie Fluent UI-pictogrammen)
ItemIconColor	De kleur waarin het pictogram moet worden weergegeven (bijvoorbeeld met naam, RGB- of hexwaarde)
ItemIconOnly	Laat het tekstlabel niet zien - alleen het pictogram
ItemParentKey	Geef de optie weer als onderliggend item van een andere optie
ItemExpanded	Stel in op false of true als de groep respectievelijk samengevouwen of uitgevouwen moet blijven.

Voorbeeld:

Table(
  {
      ItemKey: "1",
      ItemDisplayName: "Home with Icon & Custom color",
      ItemIconName: "Home",
      ItemIconColor: "Green"
  },
  {
      ItemKey: "2",
      ItemDisplayName: "Documents",
      ItemExpanded: true
  },
  {
      ItemKey: "3",
      ItemDisplayName: "Contents"
  },
  {
      ItemKey: "4",
      ItemDisplayName: "Item Invisible",
      ItemVisible: false
  },
  {
      ItemKey: "5",
      ItemDisplayName: "Quick Reference Guide",
      ItemParentKey: "3",
      ItemIconName: "Document"
  }
)

Stijleigenschappen

Eigenschappen	Omschrijving
Theme	Accepteert een JSON-tekenreeks die is gegenereerd met Ontwerper van Fluent UI Theme (windows.net). Als u dit leeg laat, wordt het standaardthema gebruikt dat door Power Apps is gedefinieerd. Zie Themagebruik voor richtlijnen voor configureren.
AccessibilityLabel	Arialabel voor schermlezers
CollapseByDefault	Stel in op true of false (aan of uit) als de groep van navigatie respectievelijk samengevouwen of uitgevouwen moet blijven. Individuele eigenschap voor uitbreiden op itemniveau wordt gerespecteerd.

Eigenschappen van gebeurtenis

Eigenschappen	Omschrijving
InputEvent	Een gebeurtenis waarnaar het besturingselement moet worden verzonden Bijvoorbeeld SetFocus. Zie hieronder.

Gedrag

Ondersteunt SetFocus als een InputEvent.

"OnSelect"-gedrag configureren

Gebruik de formule Switch() in de eigenschap OnSelect van het onderdeel om specifieke acties voor elk item te configureren door te verwijzen naar de geselecteerde ItemKey van het besturingselement als de schakelwaarde.

Vervang de false-waarden met geschikte expressies in de Power Fx-taal.

  Switch( Self.Selected.ItemKey,

    /* Action for ItemKey 1 */
    "1", false,

    /* Action for ItemKey 2 */
    "2", false,

    /* Action for ItemKey 3 */
    "3", false,

    /* Action for ItemKey 4 */
    "4", false,

    /* Action for ItemKey 5 */
    "5", false,

    /* Default action */
        false
  )

Focus op het besturingselement instellen

Wanneer een nieuw dialoogvenster wordt weergegeven en de standaardfocus op het besturingselement moet liggen, is een expliciete ingestelde focus nodig.

Als u de input-gebeurtenis wilt aanroepen, kunt u een contextvariabele die aan de eigenschap Input Event is gebonden, instellen op een tekenreeks die begint met SetFocus en gevolgd door een willekeurig element om ervoor te zorgen dat de app het als een wijziging detecteert.

Bijvoorbeeld:

UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));

De contextvariabele ctxResizableTextareaEvent is dan gebonden aan de eigenschap Input Event.

Beperkingen

Dit codeonderdeel kan alleen worden gebruikt in canvas-apps en aangepaste pagina's.