New-UDTabs

Résumé

Crée un nouvel ensemble d'onglets.

Syntaxe

New-UDTabs [-Tabs] <ScriptBlock> [[-Id] <String>] [-RenderOnActive] [[-Orientation] <String>] [[-Variant] <String>] [[-ScrollButtons] <String>] [-Centered] [[-ClassName] <String>] [[-SelectedTabIndex] <Int32>] [[-Style] <Hashtable>] [[-Sx] <Hashtable>] [<CommonParameters>]

Description

Crée un nouvel ensemble d'onglets. Les onglets peuvent servir à afficher beaucoup de contenu sur une seule page.

Paramètres

-Tabs

Les onglets à placer dans ce conteneur.

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

-Id

L'ID du composant. Il s'agit par défaut d'un GUID aléatoire.

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

-RenderOnActive

Obsolète

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

-Orientation

L'orientation des onglets. Les valeurs valides sont horizontal et vertical.

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

-Variant

La variante des onglets. Les valeurs valides sont standard, fullWidth et scrollable.

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

-ScrollButtons

Le comportement des boutons de défilement. Les valeurs valides sont on, off, auto et desktop. On active les boutons de défilement en tout temps. off désactive tous les boutons de défilement. Auto affiche les boutons de défilement au besoin. Desktop affiche les boutons de défilement sur les écrans moyens et grands.

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

-Centered

Indique si les onglets doivent être centrés.

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

-ClassName

La classe CSS à appliquer aux onglets.

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

-SelectedTabIndex

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

-Style

Le style à appliquer aux onglets.

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

-Sx

Un style propre au thème à appliquer aux onglets.

Required?                    false
Position?                    9
Default value
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'information, voir about_CommonParameters.

Sorties

Exemples

Exemple 1 : Onglets de base

New-UDTabs -Tabs {
   New-UDTab -Text "Tab1" -Id 'Tab1' -Content {
       New-UDElement -Tag div -Id 'tab1Content' -Content { "Tab1Content"}
   }
   New-UDTab -Text "Tab2" -Id 'Tab2' -Content {
       New-UDElement -Tag div -Id 'tab2Content' -Content { "Tab2Content"}
   }
   New-UDTab -Text "Tab3" -Id 'Tab3' -Content {
       New-UDElement -Tag div -Id 'tab3Content' -Content { "Tab3Content"}
   }
} -Id 'tabs1'

Un ensemble d'onglets de base.

Exemple 2 : Onglets dynamiques

New-UDTabs -Id 'tabs2' -Tabs {
   New-UDTab -Text "Tab1" -Id 'DynamicTab1' -Dynamic -Content {
       New-UDElement -Tag div -Id 'DynamicTab1Content' -Content { Get-Date }
   }
   New-UDTab -Text "Tab2" -Id 'DynamicTab2' -Dynamic -Content {
       New-UDElement -Tag div -Id 'DynamicTab2Content' -Content { Get-Date }
   }
   New-UDTab -Text "Tab3" -Id 'DynamicTab3' -Dynamic -Content {
       New-UDElement -Tag div -Id 'DynamicTab3Content' -Content { Get-Date }
   }
}

Un ensemble d'onglets dynamiques.

Exemple 3 : Onglets verticaux

New-UDTabs -Id 'tabs3' -Orientation 'vertical' -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets verticaux.

Exemple 4 : Onglets pleine largeur

New-UDTabs -Id 'tabs4' -Variant 'fullWidth' -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets pleine largeur.

Exemple 5 : Onglets défilables

New-UDTabs -Id 'tabs5' -Variant 'scrollable' -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets défilables.

Exemple 6 : Boutons de défilement activés

New-UDTabs -Id 'tabs6' -ScrollButtons 'on' -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets dont les boutons de défilement sont toujours activés.

Exemple 7 : Onglets centrés

New-UDTabs -Id 'tabs7' -Centered -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets centrés.

Exemple 8 : Onglets avec icônes

New-UDTabs -Id 'tabs8' -Tabs {
    New-UDTab -Text "Tab1" -Icon (New-UDIcon -Icon Eye) -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Icon (New-UDIcon -Icon Home) -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Icon (New-UDIcon -Icon User) -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets avec icônes.

Exemple 9 : Onglet désactivé

New-UDTabs -Id 'tabs7' -Tabs {
    New-UDTab -Text "Tab1" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab2" -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
    New-UDTab -Text "Tab3" -Disabled -Content {
        New-UDElement -Tag div -Content { Get-Date }
    }
}

Un ensemble d'onglets avec un onglet désactivé.