New-UDChip

Übersicht

Chips sind kompakte Elemente, die eine Eingabe, ein Attribut oder eine Aktion darstellen.

Syntax

New-UDChip [-Id <String>] [[-Label] <String>] [[-OnDelete] <Endpoint>] [[-OnClick] <Endpoint>] [[-Icon] <Object>] [[-Style] <Hashtable>] [[-Variant] <String>] [[-Size] <String>] [-ClassName <String>] [-Color <String>] [<CommonParameters>]

New-UDChip [-Id <String>] [[-Label] <String>] [[-OnDelete] <Endpoint>] [[-OnClick] <Endpoint>] [[-Style] <Hashtable>] [[-Variant] <String>] [[-Avatar] <String>] [[-AvatarType] <String>] [[-Size] <String>] [-ClassName <String>] [-Color <String>] [<CommonParameters>]

Beschreibung

Chips sind kompakte Elemente, die eine Eingabe, ein Attribut oder eine Aktion darstellen.

Parameter

-Id

Die ID der Komponente. Standardmäßig eine zufällige GUID.

Required?                    false
Position?                    named
Default value                ([Guid]::NewGuid()).ToString()
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Label

Die Beschriftung des Chips.

Required?                    false
Position?                    1
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-OnDelete

Ein Skriptblock, der aufgerufen wird, wenn der Chip gelöscht wird.

Required?                    false
Position?                    9
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-OnClick

Ein Skriptblock, der aufgerufen wird, wenn auf den Chip geklickt wird.

Required?                    false
Position?                    8
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Icon

Ein Symbol, das innerhalb des Chips angezeigt wird.

Required?                    false
Position?                    2
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Style

CSS-Stile, die auf den Chip angewendet werden.

Required?                    false
Position?                    3
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Variant

Die Themenvariante, die auf den Chip angewendet wird.

Required?                    false
Position?                    4
Default value                default
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Avatar

Ein Avatar, der innerhalb des Chips angezeigt wird.

Required?                    false
Position?                    5
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-AvatarType

Der Typ des Avatars, der im Chip angezeigt wird.

Required?                    false
Position?                    6
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Size

Die Größe des Chips. Gültige Werte sind: "small", "medium"

Required?                    false
Position?                    10
Default value                medium
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-ClassName

Eine CSS-Klasse, die auf den Chip angewendet wird.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Color

Die Farbe des Chips. Standardmäßig 'default'. Gültige Werte: "default", "primary", "secondary"

Required?                    false
Position?                    named
Default value                default
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

Allgemeine Parameter

Dieses Cmdlet unterstützt die allgemeinen Parameter: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable und OutVariable. Weitere Informationen finden Sie unter about_CommonParameters.

Ausgaben

Beispiele

Beispiel 1: Einfacher Chip

New-UDChip -Label 'Basic' -Icon (New-UDIcon -Icon 'user') -Id 'chip1'

Ein einfacher Chip mit einem Symbol.

Beispiel 2: Umrandeter Chip

New-UDChip -Variant outlined -Label 'Outlined' -Icon (New-UDIcon -Icon 'user') -Id 'chip2'

Ein umrandeter Chip mit einem Symbol.

Beispiel 3: Klickbarer Chip

New-UDChip -Label 'Clickable' -Icon (New-UDIcon -Icon 'user') -OnClick {
   Show-UDToast -Message 'Hello!'
} -Id 'chip3'

Ein klickbarer Chip mit einem Symbol.

Beispiel 4: Löschbarer Chip

New-UDChip -Label 'Deletable' -Icon (New-UDIcon -Icon 'user') -OnDelete {
   Show-UDToast -Message 'Deleted!'
} -Id 'chip4'

Ein löschbarer Chip mit einem Symbol.

Beispiel 5: Klickbarer und löschbarer Chip

New-UDChip -Label 'Clickable and deletable' -Icon (New-UDIcon -Icon 'user') -OnClick {
   Show-UDToast -Message 'Hello!'
} -OnDelete {
   Show-UDToast -Message 'Deleted!'
} -Id 'chip5'

Ein klickbarer und löschbarer Chip mit einem Symbol.

Beispiel 6: Avatar-Chip

New-UDChip -Avatar "A" -AvatarType letter -Label 'Avatar' -Id 'chip6'

Ein Chip mit einem Avatar.

Beispiel 7: Bild-Chip

New-UDChip -Avatar "https://picsum.photos/200/300" -AvatarType image -Label 'Avatar' -Id 'chip7'

Ein Chip mit einem Avatar-Bild.

Beispiel 8: Kleiner Chip

New-UDChip -Label 'Small' -Icon (New-UDIcon -Icon 'user') -Size small -Id 'chip8'

Ein kleiner Chip mit einem Symbol.

Beispiel 9

New-UDChip -Style @{background = 'red'; color = 'white'} -Label 'Styled' -Icon (New-UDIcon -Icon 'user') -Id 'chip9'