Nav Kontrolle

Ein Steuerelement, das zur Bereitstellung der Navigation verwendet wird.

Notiz

Sie finden die vollständige Dokumentation und den Quellcode im GitHub-Codekomponenten-Repository.

Beschreibung des Dataflows

Ein Navigationsbereich (Nav) bietet Links zu den Hauptbereichen einer App oder Website.

Die Nav-Codekomponente ermöglicht die Verwendung der Fluent-Benutzeroberfläche Nav-Menükomponente aus Canvas-Apps und benutzerdefinierten Seiten.

Notiz

Komponenten-Quellcode und weitere Informationen finden Sie im GitHub-Codekomponenten-Repository.

Eigenschaften

Schlüsseleigenschaften

Eigenschaften	Beschreibung des Dataflows
Selected key	Der auszuwählende Schlüssel Dies wird über das OnChange-Ereignis aktualisiert, wenn der Benutzer mit dem Steuerelement interagiert.
Items	Erforderlich. Die Elementetabelle der Datenquelle, die gerendert werden soll.
Fields	Erforderlich. Die enthaltenen, aus dem DataSet stammenden Felder

Items Eigenschaften

Jedes Element verwendet das folgende Schema, um Daten in der Komponente zu visualisieren.

Name des Dataflows	Beschreibung des Dataflows
ItemDisplayName	Der Anzeigename des Befehls-/Registerkarten-/Menüelements
ItemKey	Die zu verwendende Taste, um anzuzeigen, welches Element ausgewählt ist, und wenn Unterelemente hinzugefügt werden. Die Tasten müssen eindeutig sein.
ItemEnabled	Auf „False“ setzen, wenn die Option deaktiviert ist
ItemVisible	Auf „False“ setzen, wenn die Option nicht sichtbar ist
ItemIconName	Das zu verwendende Fluent-UI-Symbol (siehe Fluent-UI-Symbole)
ItemIconColor	Die Farbe, in der das Symbol gerendert werden soll (z. B. benannt, RGB- oder Hex-Wert)
ItemIconOnly	Textbeschriftung nicht anzeigen – nur das Symbol
ItemParentKey	Option als untergeordnetes Element einer anderen Option rendern
ItemExpanded	Auf „False“ oder „True“ setzen, wenn die Gruppe zusammen- bzw. ausgeklappt bleiben soll

Beispiel:

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"
  }
)

Stileigenschaften

Eigenschaften	Beschreibung des Dataflows
Theme	Akzeptiert eine JSON-Zeichenfolge, die mithilfe des Fluent-UI-Themen-Designers (windows.net) generiert wird. Wenn Sie dieses Feld leer lassen, wird das in Power Apps definierte Standarddesign verwendet. Siehe Designs für eine Konfigurationsanleitung.
AccessibilityLabel	Aria-Beschriftung für Sprachausgabe
CollapseByDefault	Auf „True“ oder „False“ (An oder Aus) setzen, wenn die gesamte Gruppe der Navigation zusammen- bzw. ausgeklappt bleiben soll Die Eigenschaft zum Ausklappen auf Ebene einzelner Elemente wird respektiert.

Ereigniseigenschaften

Eigenschaften	Beschreibung des Dataflows
InputEvent	Ein Ereignis, das an das Steuerelement gesendet werden soll. z. B. SetFocus. Siehe unten.

Behavior

Unterstützt SetFocus als InputEvent.

Das „Bei Auswahl“-Verhalten konfigurieren

Verwenden Sie die Switch()-Formel in der OnSelect-Eigenschaft der Komponente, um bestimmte Aktionen für jedes Element zu konfigurieren, indem auf die den für das Steuerelement ausgewählten ItemKey als Switch-Wert verwiesen wird.

Ersetzen Sie false-Werte mit entsprechenden Ausdrücken in der Power Fx-Sprache.

  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
  )

Festlegen des Fokus auf das Steuerelement

Wenn ein neues Dialogfeld angezeigt wird, und der Standardfokus auf dem Steuerelement liegen sollte, ist ein expliziter festgelegter Fokus erforderlich.

Um das Eingabeereignis aufzurufen, können Sie eine Kontextvariable, die an die Eigenschaft „Eingabeereignis“ gebunden ist, auf eine Zeichenfolge festlegen, die mit SetFocus beginnt, gefolgt von einem zufälligen Element. So kann sichergestellt werden, dass die App dies als Änderung erkennt.

z. B.

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

Die Kontextvariable ctxResizableTextareaEvent würde dann an die Input Event-Eigenschaft gebunden werden.

Einschränkungen

Diese Codekomponente kann nur in Canvas-Apps und benutzerdefinierten Seiten verwendet werden.