New-UDTabs

Sinopsis

Crea un nuevo conjunto de pestañas.

Sintaxis

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

Descripción

Crea un nuevo conjunto de pestañas. Las pestañas se pueden usar para mostrar mucho contenido en una sola página.

Parámetros

-Tabs

Las pestañas que se colocarán dentro de este contenedor.

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

-Id

El ID del componente. Su valor predeterminado es un GUID aleatorio.

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

-RenderOnActive

Obsoleto

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

-Orientation

La orientación de las pestañas. Los valores válidos son horizontal y vertical.

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

-Variant

La variación de las pestañas. Los valores válidos son standard, fullWidth y scrollable.

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

-ScrollButtons

El comportamiento de los botones de desplazamiento. Los valores válidos son on, off, auto y desktop. On habilitará los botones de desplazamiento en cualquier caso. off deshabilitará todos los botones de desplazamiento. Auto mostrará los botones de desplazamiento cuando sea necesario. Desktop mostrará los botones de desplazamiento en pantallas medianas y grandes.

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

-Centered

Si las pestañas deben estar centradas.

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

-ClassName

La clase CSS que se aplicará a las pestañas.

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

El estilo que se aplicará a las pestañas.

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

-Sx

Un estilo específico del tema que se aplicará a las pestañas.

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

Parámetros comunes

Este cmdlet admite los parámetros comunes: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable y OutVariable. Para más información, consulte about_CommonParameters.

Salidas

Ejemplos

Ejemplo 1: pestañas básicas

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 conjunto básico de pestañas.

Ejemplo 2: pestañas dinámicas

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 conjunto de pestañas dinámicas.

Ejemplo 3: pestañas verticales

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 conjunto de pestañas verticales.

Ejemplo 4: pestañas de ancho completo

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 conjunto de pestañas de ancho completo.

Ejemplo 5: pestañas desplazables

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 conjunto de pestañas desplazables.

Ejemplo 6: botones de desplazamiento activados

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 conjunto de pestañas con los botones de desplazamiento siempre activados.

Ejemplo 7: pestañas centradas

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 conjunto de pestañas centradas.

Ejemplo 8: pestañas con iconos

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 conjunto de pestañas con iconos.

Ejemplo 9: pestaña deshabilitada

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 conjunto de pestañas con una pestaña deshabilitada.