New-UDGridLayout

Synopsis

Crée une nouvelle mise en page en grille. La mise en page en grille vous permet de glisser-déposer des composants dans une grille.

Syntaxe

New-UDGridLayout [[-Id] <String>] [[-RowHeight] <Int32>] [-Content] <ScriptBlock> [[-Layout] <String>] [[-LargeColumns] <Int32>] [[-MediumColumns] <Int32>] [[-SmallColumns] <Int32>] [[-ExtraSmallColumns] <Int32>] [[-ExtraExtraSmallColumns] <Int32>] [[-LargeBreakpoint] <Int32>] [[-MediumBreakpoint] <Int32>] [[-SmallBreakpoint] <Int32>] [[-ExtraSmallBreakpoint] <Int32>] [[-ExtraExtraSmallBreakpoint] <Int32>] [-Draggable] [-Resizable] [-Persist] [-Design] [<CommonParameters>]

Description

Crée une nouvelle mise en page en grille. La mise en page en grille vous permet de glisser-déposer des composants dans une grille.

Paramètres

-Id

L'ID de ce composant. La valeur par défaut est un GUID aléatoire.

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

-RowHeight

La hauteur de chaque rangée en pixels. La valeur par défaut est 30.

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

-Content

Le contenu de la mise en page en grille. Il s'agit d'un scriptblock qui retourne une liste de composants. Les composants doivent avoir des ID statiques.

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

-Layout

La disposition de la grille. Cela doit être une chaîne JSON.

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

-LargeColumns

Le nombre de colonnes dans le point de rupture large. La valeur par défaut est 12.

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

-MediumColumns

Le nombre de colonnes dans le point de rupture moyen. La valeur par défaut est 10.

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

-SmallColumns

Le nombre de colonnes dans le point de rupture petit. La valeur par défaut est 6.

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

-ExtraSmallColumns

Le nombre de colonnes dans le point de rupture très petit. La valeur par défaut est 4.

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

-ExtraExtraSmallColumns

Le nombre de colonnes dans le point de rupture extrêmement petit. La valeur par défaut est 2.

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

-LargeBreakpoint

La largeur du point de rupture large en pixels. La valeur par défaut est 1200.

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

-MediumBreakpoint

La largeur du point de rupture moyen en pixels. La valeur par défaut est 996.

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

-SmallBreakpoint

La largeur du point de rupture petit en pixels. La valeur par défaut est 768.

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

-ExtraSmallBreakpoint

La largeur du point de rupture très petit en pixels. La valeur par défaut est 480.

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

-ExtraExtraSmallBreakpoint

La largeur du point de rupture extrêmement petit en pixels. La valeur par défaut est 0.

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

-Draggable

Indique si les composants peuvent être déplacés ou non.

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

-Resizable

Indique si les composants peuvent être redimensionnés ou non.

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

-Persist

Indique si la mise en page doit être conservée ou non dans la session actuelle du navigateur.

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

-Design

Indique si la mise en page en grille est en mode conception ou non. Le mode conception permet de copier la disposition JSON actuelle.

Required?                    false
Position?                    named
Default value                False
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, voir about_CommonParameters.

Sorties

Exemples

Exemple 1 : mise en page en grille de base

New-UDGridLayout -Content {
    New-UDCard -Text "Card 1" -Id "card1"
    New-UDCard -Text "Card 2" -Id "card2"
} -Id 'gridLayout1' -Draggable -Resizable -Layout '{"lg":[{"w":2,"h":3,"x":0,"y":0,"i":"grid-element-card1","moved":false,"static":false},{"w":2,"h":3,"x":2,"y":0,"i":"grid-element-card2","moved":false,"static":false}]}'

Créer une mise en page en grille de base avec deux cartes.

Exemple 2 : déplaçable et redimensionnable

New-UDGridLayout -Content {
    New-UDCard -Text "Card 3" -Id "card3"
    New-UDCard -Text "Card 4" -Id "card4"
} -Id 'gridLayout2' -Design -Draggable -Resizable -Layout '{"lg":[{"w":2,"h":3,"x":0,"y":0,"i":"grid-element-card3","moved":false,"static":false},{"w":2,"h":3,"x":2,"y":0,"i":"grid-element-card4","moved":false,"static":false}]}'

Créer une mise en page en grille avec deux cartes qui peuvent être déplacées et redimensionnées. Cette mise en page est également en mode conception, ce qui vous permet de copier la disposition actuelle en JSON.

Exemple 3 : mise en page conservée

New-UDGridLayout -Content {
    New-UDCard -Text "Card 5" -Id "card5"
    New-UDCard -Text "Card 6" -Id "card6"
} -Id 'gridLayout3' -Design -Draggable -Resizable -Persist -Layout '{"lg":[{"w":2,"h":3,"x":0,"y":0,"i":"grid-element-card5","moved":false,"static":false},{"w":2,"h":3,"x":2,"y":0,"i":"grid-element-card6","moved":false,"static":false}]}'

Cette mise en page est également conservée dans la session actuelle du navigateur. Actualisez la page pour voir la mise en page conservée.

[Component("Grid Layout", "TableLayout", "Creates a new card.")]