Picker Kontrolle

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

Notiz

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

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.