Picker controle
Een besturingselement dat wordt gebruikt om een zoekervaring te bieden.
Notitie
Volledige documentatie en broncode vindt u in de GitHub-opslagplaats voor codeonderdelen.
Omschrijving
Pickers worden gebruikt om een of meer items, zoals tags of bestanden, uit een grote lijst te selecteren.
Picker-codeonderdelen maken het gebruik mogelijk van de Fluent UI-picker-menuonderdelen vanuit canvas-apps en aangepaste pagina's.
Het codeonderdeel Tag Picker biedt de volgende functies:
- Bindt aan een invoerverzameling voor de gekozen tags.
- Bindt aan een invoerverzameling voor voorgestelde tags.
- Stelt gebruikers in staat te kiezen uit suggesties of een vrije teksttag in te voeren.
- Activeert een OnChange-gebeurtenis wanneer een gebruiker een tag toevoegt of verwijdert.
- Staat programmatische Focus instellen toe.
Gegevenssets
De Tag Picker heeft de volgende invoergegevebssets, die in detail worden beschreven in Belangrijkste eigenschappen verderop in dit artikel.
Tags
TagsDisplayName
Suggestions
SuggestionsDisplayName
SuggestionSubDisplayName
De gegevensset Suggestions
moet worden gefilterd met de uitvoereigenschap SearchTerm
, bijvoorbeeld:
Search(colSuggestions,TagPicker.SearchTerm,"name")
Eigenschappen
Belangrijke eigenschappen
Eigenschappen | Omschrijving |
---|---|
Items |
Een verzameling (tabel) met tags. De app is verantwoordelijk voor het toevoegen of verwijderen van tags als reactie op het aanmaken van Toevoegen- of Verwijderen-gebeurtenissen van het onderdeel (beschreven in de onderstaande sectie OnChange-gebeurtenis). |
Suggestions_Items |
Een verzameling (tabel) met suggesties. |
TagMaxWidth |
De maximale breedte van de tags bij het weergeven. Overlooptekst wordt afgekapt met beletseltekens en een zwevende knopinfo toont de volledige tekst. |
AllowFreeText |
Selecteer bij het typen van een waarde niet automatisch de eerste suggestie zodat een vrije tekstinvoer kan worden geleverd in plaats van te selecteren uit een vooraf gedefinieerde lijst. |
SearchTermToShortMessage |
Het bericht dat moet worden weergegeven wanneer de zoekterm korter is dan de MinimumSearchTermLength . |
HintText |
Het bericht dat moet worden weergegeven in de kiezer wanneer geen zoekterm wordt opgegeven. |
NoSuggestionsFoundMessage |
Het bericht dat moet worden weergegeven wanneer de collectie Suggesties geen resultaten bevat. |
MinimumSearchTermLength |
Het minimum aantal tekens om de flyout van suggesties te activeren. |
MaxTags |
Het maximum aantal tags dat kan worden toegevoegd. Na dit aantal wordt de tagkiezer alleen opnieuw gebruikt totdat een tag wordt verwijderd. |
Error |
Waar als de rode foutrand moet worden weergegeven. |
Items
eigenschappen
Eigenschappen | Omschrijving |
---|---|
TagsDisplayName |
Ingesteld op de naam van de kolom die de weergavenaam voor de tag bevat. |
Suggestions
eigenschappen
Eigenschappen | Omschrijving |
---|---|
SuggestionsDisplayName |
ingesteld op de naam van de kolom die de weergavenaam voor de suggestie bevat. |
SuggestionsSubDisplayName |
(Optioneel): ingesteld op de naam van de kolom die de secundaire tekstregel bevat. |
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. |
FontSize |
De lettergrootte van de tags die in de kiezer worden weergegeven. |
BorderRadius |
De randradius van de tags die in de kiezer worden weergegeven. |
ItemHeight |
De hoogte van de tags (pixels) die in de kiezer worden weergegeven. |
AccessibilityLabel |
Arialabel voor schermlezers |
Eigenschappen van gebeurtenis
Eigenschappen | Omschrijving |
---|---|
Input Event |
Instellen op de gebeurtenis die naar de TagPicker moet worden verzonden |
Uitvoereigenschappen
Eigenschappen | Omschrijving |
---|---|
SearchTerm |
De tekst die is ingevoerd in de tagkiezer die kan worden gebruikt om de gegevensset met suggesties te filteren. |
TagsDisplayName |
De tekst die wordt gebruikt om een nieuwe Tag te maken wanneer de gebeurtenis OnChange wordt geactiveerd |
AutoHeight |
Wanneer de tagkiezer meerdere regels omvat, kan de eigenschap Automatische hoogte worden gebruikt om de hoogte van een responsieve containerhoogte te bepalen. |
Gedrag
Ondersteunt SetFocus als een InputEvent
.
OnChange-gebeurtenis
Het onderdeel TagPicker
activeert een gebeurtenis OnChange
wanneer tags worden toegevoegd of verwijderd. De gebruikte eigenschappen zijn:
Eigenschappen | Omschrijving |
---|---|
TagEvent |
De naam van de geactiveerde gebeurtenis. |
TagKey |
De sleutel van het item waarmee de gebeurtenis is geactiveerd (als de gebeurtenis is gerelateerd aan een tag) |
De gebeurtenis moet een uitdrukking bevatten die lijkt op:
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) )
);
Beperkingen
Dit codeonderdeel kan alleen worden gebruikt in canvas-apps en aangepaste pagina's.