Freigeben über

Picker-Steuerelement

Ein Steuerelement, das verwendet wird, um eine Suchabfrage bereitzustellen.

Notiz

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

Auswahl-Steuerelement.

Beschreibung

Eine Auswahl wird verwendet, um ein oder mehrere Elemente, wie z. B. Tags oder Dateien, aus einer großen Liste auszuwählen.

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

Die Tagauswahl-Codekomponente bietet die folgenden Funktionen:

  1. Stellt eine Bindung an eine Eingabesammlung für die ausgewählten Tags her.
  2. Stellt eine Bindung an eine Eingabesammlung für die vorgeschlagenen Tags her.
  3. Ermöglicht Benutzern, aus Vorschlägen auszuwählen oder ein Freitext-Tag einzugeben.
  4. Löst ein Bei Änderung-Ereignis aus, wenn ein Benutzer ein Tag hinzufügt oder entfernt.
  5. Ermöglicht Fokus setzen programmgesteuert.

DataSets

Die Tagauswahl verfügt über die folgenden Eingabedatensätze, die ausführlich in Wichtigste Eigenschaften später in diesem Artikel beschrieben werden.

  • Tags
    • TagsDisplayName
  • Suggestions
    • SuggestionsDisplayName
    • SuggestionSubDisplayName

Das Suggestions-DataSet sollte zum Beispiel mit der SearchTerm-Ausgangseigenschaft gefiltert werden:

Search(colSuggestions,TagPicker.SearchTerm,"name")

Eigenschaften

Schlüsseleigenschaften

Eigenschaften Beschreibung
Items Eine Sammlung (Tabelle) von Tags. Die App ist verantwortlich für das Hinzufügen oder Entfernen von Tags als Reaktion auf das Auslösen von Hinzufügen- oder Entfernen-Ereignissen der Komponente (im Folgenden im Abschnitt „OnChange-Ereignis“ beschrieben).
Suggestions_Items Eine Sammlung (Tabelle) von Vorschlägen.
TagMaxWidth Die Maximalbreite der Tags beim Rendern Überlaufender Text wird mit Auslassungspunkten abgekürzt, und ein Mouseover-Tooltip zeigt den vollständigen Text an.
AllowFreeText Wählen Sie beim Eingeben eines Werts nicht automatisch den ersten Vorschlag aus, damit eine freie Texteingabe möglich ist und nicht aus einer vordefinierten Liste ausgewählt werden muss.
SearchTermToShortMessage Die anzuzeigende Meldung, wenn der Suchbegriff kleiner als die MinimumSearchTermLength ist.
HintText Die in der Auswahl anzuzeigende Meldung, wenn kein Suchbegriff angegeben ist.
NoSuggestionsFoundMessage Die anzuzeigende Meldung, wenn die Vorschlagssammlung keine Ergebnisse enthält.
MinimumSearchTermLength Die Mindestanzahl an Zeichen zum Auslösen des Vorschlags-Flyouts.
MaxTags Die Maximalanzahl an Tags, die hinzugefügt werden können. Nach dieser Zahl wird die Tag-Auswahl nur noch so lange angezeigt, bis ein Tag entfernt wird.
Error True, wenn der rote Fehlerrahmen angezeigt werden soll.

Items-Eigenschaften

Eigenschaften Beschreibung
TagsDisplayName Auf den Namen der Spalte festgelegt, die den Tag-Anzeigename enthält.

Suggestions-Eigenschaften

Eigenschaften Beschreibung
SuggestionsDisplayName Auf den Namen der Spalte festgelegt, die den vorgeschlagenen Anzeigenamen enthält.
SuggestionsSubDisplayName (Optional): Auf den Namen der Spalte festlegen, die die sekundäre Textzeile enthält.

Stileigenschaften

Eigenschaften Beschreibung
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.
FontSize Die Schriftgröße der Tags, die in der Auswahl angezeigt werden.
BorderRadius Der Randradius der Tags, die in der Auswahl angezeigt werden.
ItemHeight Die Höhe der Tags (Pixel), die in der Auswahl angezeigt werden
AccessibilityLabel Aria-Beschriftung für Sprachausgabe

Ereigniseigenschaften

Eigenschaften Beschreibung
Input Event Auf das an den TagPicker zu sendende Ereignis festlegen

Ausgabeeigenschaften

Eigenschaften Beschreibung
SearchTerm Der in die Tag-Auswahl eingegebene Text, der zum Filtern des Vorschlags-DataSets verwendet werden kann.
TagsDisplayName Der zur Erstellung eines neuen Tags verwendete Text, wenn das Bei Änderung-Ereignis ausgelöst wird.
AutoHeight Wenn die Tag-Auswahl mehrere Zeilen umbricht, kann die Automatische Höhe-Eigenschaft verwendet werden, um die Höhe einer reaktionsfähigen Containerhöhe zu steuern.

Behavior

Unterstützt SetFocus als InputEvent.

OnChange-Ereignis

Die TagPicker-Komponente löst ein OnChange-Ereignis aus, wenn Tags hinzugefügt oder entfernt werden. Die verwendeten Eigenschaften sind:

Eigenschaften Beschreibung
TagEvent Der Name des ausgelösten Ereignisses
TagKey Der Schlüssel des Elements, das das Ereignis ausgelöst hat (wenn das Ereignis mit einem Tag zusammenhängt)

Das Ereignis sollte einen Ausdruck ähnlich dem folgenden enthalten:

If( TagPicker.TagEvent = "Add" && CountRows(Filter(colTags,name=TagPicker.TagsDisplayName)) = 0,
    Collect( colTags, { name:TagPicker.TagsDisplayName })
);

If( TagPicker.TagEvent="Remove",
 RemoveIf( colTags,name=Text(TagPicker.TagsDisplayName) )
);

Einschränkungen

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

  • Last updated on