New-UDToggleButtonGroup

Sinossi

Un Toggle Button può essere utilizzato per raggruppare opzioni correlate.

Sintassi

New-UDToggleButtonGroup [[-Id] <String>] [[-Color] <String>] [-Disabled] [-Exclusive] [-FullWidth] [[-OnChange] <Endpoint>] [[-Size] <String>] [[-Orientation] <String>] [[-Sx] <Hashtable>] [[-Value] <String[]>] [-Children] <ScriptBlock> [<CommonParameters>]

Descrizione

Un Toggle Button può essere utilizzato per raggruppare opzioni correlate.

Parametri

-Id

L'ID del componente. Se non specificato, verrà assegnato un GUID casuale.

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

-Color

Il colore del componente. I valori validi sono 'standard', 'primary', 'secondary', 'error', 'info', 'success', 'warning'.

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

-Disabled

Se specificato, il componente sarà disabilitato.

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

-Exclusive

Se specificato, il componente consentirà una sola selezione.

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

-FullWidth

Se specificato, il componente occuperà l'intera larghezza del suo contenitore.

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

-OnChange

L'endpoint da chiamare quando il valore del componente cambia.

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

-Size

La dimensione del componente. I valori validi sono 'small', 'medium', 'large'.

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

-Orientation

L'orientamento del componente. I valori validi sono 'horizontal', 'vertical'.

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

-Sx

Lo stile del componente.

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

-Value <String[]>

Il valore del componente.

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

-Children

Il contenuto del componente. Utilizzi New-UDToggleButton per creare i toggle button.

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

Parametri comuni

Questo cmdlet supporta i parametri comuni: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable e OutVariable. Per maggiori informazioni, veda about_CommonParameters.

Output

Esempi

Esempio 1: selezione esclusiva

New-UDToggleButtonGroup -Content {
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    } -Id 'test'
} -Exclusive

Con la selezione esclusiva, selezionando un'opzione si deseleziona qualsiasi altra.

Esempio 2: selezione multipla

New-UDToggleButtonGroup -Content {
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    } -Id 'test'
}

Con la selezione multipla, selezionando un'opzione non si deseleziona alcuna altra.

Esempio 3: dimensione

New-UDToggleButtonGroup -Content {
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    } -Id 'test'
} -Size 'small'

La dimensione small equivale allo stile dense del toggle button.

Esempio 4: orientamento

New-UDToggleButtonGroup -Content {
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    } -Id 'test'
} -Orientation 'vertical'

L'orientamento verticale può essere utilizzato per visualizzare una colonna di toggle button.

Esempio 5: OnChange

New-UDToggleButtonGroup -Content {
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    }
    New-UDToggleButton -Content {
        New-UDIcon -Icon 'User'
    } -Id 'test'
} -OnChange {
    Show-UDToast -Message "You selected $EventData"
}

L'endpoint OnChange viene chiamato quando il valore del componente cambia. I dati dell'evento sono il valore del componente.