New-UDButton

Résumé

Les boutons permettent aux utilisateurs d'effectuer des actions et de faire des choix en une seule touche..

Syntaxe

New-UDButton [[-Text] <String>] [[-Icon] <Object>] [[-Variant] <String>] [[-IconAlignment] <String>] [[-FullWidth]] [[-OnClick] <Endpoint>] [[-Size] <String>] [[-Style] <Hashtable>] [[-Href] <String>] [-Target <String>] [-Id <String>] [-Color <String>] [-Disabled] [-ClassName <String>] [-ShowLoading] [-LoadingIndicator <Object>] [-LoadingPosition <String>] [<CommonParameters>]

Description

Crée un nouveau bouton. Les boutons permettent aux utilisateurs d'effectuer des actions et de faire des choix en une seule touche.

Paramètres

-Text

Le texte à afficher dans le bouton.

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

-Icon

Une icône à afficher dans le bouton. Utilisez New-UDIcon pour créer une icône pour ce paramètre.

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

-Variant

Le type de variante de ce bouton. Les valeurs valides sont : "text", "outlined", "contained"

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

-IconAlignment

Comment aligner l'icône dans le bouton. Les valeurs valides sont : "left", "right"

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

-FullWidth

Si le bouton occupe toute la largeur de son conteneur.

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

-OnClick

L'action à effectuer lorsque le bouton est cliqué.

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

-Size

La taille du bouton. Les valeurs valides sont : "small", "medium", "large"

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

-Style

Les styles à appliquer au bouton.

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

-Href

Une URL vers laquelle l'utilisateur doit être redirigé lorsqu'il clique sur le bouton.

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

-Target

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

-Id

L'ID du composant. Par défaut, il s'agit d'un GUID aléatoire.

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

-Color

La couleur du composant. Les valeurs valides sont : 'default', 'inherit', 'primary', 'secondary', 'info', 'warning', 'error', 'success'

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

-Disabled

Si le bouton est désactivé.

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

-ClassName

La classe CSS à appliquer au bouton.

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

-ShowLoading

Affiche un indicateur de chargement pendant l'exécution du gestionnaire d'événement OnClick.

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

-LoadingIndicator

Un élément personnalisé à afficher à la place de l'indicateur intégré pour -ShowLoading

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

-LoadingPosition

La position de l'indicateur de chargement. Les valeurs valides sont : 'start', 'end', 'center'

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

Paramètres communs

Cette applet de commande prend en charge les paramètres communs : Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable et OutVariable. Pour plus d'informations, consultez about_CommonParameters.

Sorties

Exemples

Exemple 1 : Boutons de base

New-UDButton -Variant 'text' -Text 'Text' -Id 'button1'
New-UDButton -Variant 'contained' -Text 'Contained'  -Id 'button2'
New-UDButton -Variant 'outlined' -Text 'Outlined' -Id 'button3'

UDButton est offert en trois variantes : text, contained et outlined.

Exemple 2 : Gestion des clics

New-UDButton -Text 'Click me' -OnClick {
  Show-UDToast -Message 'Hello, world!'
} -Id 'button4'

PowerShell qui est exécuté lorsque le bouton est cliqué.

Exemple 3 : Couleur

New-UDButton -Text 'Secondary' -Color secondary -Id 'button5'
New-UDButton -Text 'Success' -Color success -Id 'button6'
New-UDButton -Text 'Error' -Color error -Id 'button7'

Ajustez la couleur du bouton avec -Color

Exemple 4 : Tailles

New-UDButton -Variant 'text' -Text 'small' -Id 'button8' -Size small
New-UDButton -Variant 'text' -Text 'medium'  -Id 'button9' -Size medium
New-UDButton -Variant 'text' -Text 'large' -Id 'button10' -Size large
New-UDButton -Variant 'contained' -Text 'small' -Id 'button11'  -Size small
New-UDButton -Variant 'contained' -Text 'medium'  -Id 'button12'  -Size medium
New-UDButton -Variant 'contained' -Text 'large' -Id 'button13'  -Size large
New-UDButton -Variant 'outlined' -Text 'small' -Id 'button14'  -Size small
New-UDButton -Variant 'outlined' -Text 'medium'  -Id 'button15'  -Size medium
New-UDButton -Variant 'outlined' -Text 'large' -Id 'button16'  -Size large

Pour des boutons plus grands ou plus petits, utilisez le paramètre -Size.

Exemple 5 : Icône

New-UDButton -Icon (New-UDIcon -Icon 'User') -Text 'View User' -Id 'button17'

Afficher une icône dans le bouton

Exemple 6 : Chargement

New-UDButton -OnClick { Start-Sleep 3 } -ShowLoading -Text 'Load Data' -Id 'button18'

Afficher un indicateur de chargement pendant l'exécution du gestionnaire d'événement OnClick.