> For the complete documentation index, see [llms.txt](https://docs.devolutions.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.devolutions.net/powershell-universal/es/comandos-de-powershell/new-udgrid.md).

# New-UDGrid

New-UDGrid crea una cuadrícula de diseño adaptable de 12 puntos en PowerShell Universal que adapta la colocación de los componentes al tamaño de la pantalla de visualización.

### Sinopsis

La cuadrícula es un sistema de cuadrícula de 12 puntos que puede adaptarse en función del tamaño de la pantalla que muestra los controles.

### Sintaxis

```powershell
New-UDGrid [-Id <String>] [-ExtraSmallSize <Int32>] [-SmallSize <Int32>] [-MediumSize <Int32>] [-LargeSize <Int32>] [-ExtraLargeSize <Int32>] [-Item] [-Children <ScriptBlock>] [-ClassName <String>] [-Direction <String>] [-RowSpacing <Object>] [-ColumnSpacing <Object>] [-JustifyContent <String>] [-AlignItems <String>] [-Version <String>] [-Style <Hashtable>] [<CommonParameters>]

New-UDGrid [-Id <String>] [-Container] [-Spacing <Int32>] [-Children <ScriptBlock>] [-ClassName <String>] [-Direction <String>] [-RowSpacing <Object>] [-ColumnSpacing <Object>] [-JustifyContent <String>] [-AlignItems <String>] [-Version <String>] [-Style <Hashtable>] [<CommonParameters>]
```

### Descripción

Crea una cuadrícula para distribuir componentes. La cuadrícula es un sistema de cuadrícula de 12 puntos que puede adaptarse en función del tamaño de la pantalla que muestra los controles.

### Parámetros

#### -Id

El ID del componente. De forma predeterminada, es un GUID aleatorio.

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

#### -ExtraSmallSize

El tamaño (1-12) para dispositivos muy pequeños.

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

#### -SmallSize

El tamaño (1-12) para dispositivos pequeños.

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

#### -MediumSize

El tamaño (1-12) para dispositivos medianos.

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

#### -LargeSize

El tamaño (1-12) para dispositivos grandes.

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

#### -ExtraLargeSize

El tamaño (1-12) para dispositivos muy grandes.

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

#### -Container

Si se trata de un contenedor. Un contenedor puede describirse mejor como una fila.

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

#### -Spacing

Espaciado entre los elementos.

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

#### -Item

Si se trata de un elemento dentro de un contenedor.

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

#### -Children

Componentes incluidos en este elemento de la cuadrícula.

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

#### -ClassName

Una clase CSS que aplicar a la cuadrícula.

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

#### -Direction

La dirección de la cuadrícula. Puede ser row, column, row-reverse o column-reverse.

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

#### -RowSpacing

El espaciado entre filas.

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

#### -ColumnSpacing

El espaciado entre columnas.

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

#### -JustifyContent

La alineación de los elementos de la cuadrícula a lo largo del eje principal. Puede ser flex-start, flex-end, center, space-between, space-around o space-evenly.

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

#### -AlignItems

La alineación de los elementos de la cuadrícula a lo largo del eje transversal. Puede ser flex-start, flex-end, center, baseline o stretch.

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

#### -Version

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

#### -Style

```
Required?                    false
Position?                    named
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](https://go.microsoft.com/fwlink/?LinkID=113216).

### Salidas

### Ejemplos

#### Ejemplo 1: cuadrícula básica

```powershell
New-UDGrid -Container -Children {
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
} -Id "grid1"
```

Una cuadrícula básica con 3 tarjetas en una fila.

#### Ejemplo 2: cuadrícula adaptable

```powershell
New-UDGrid -Container -Children {
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4  -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
} -Id "grid2"
```

Una cuadrícula adaptable con 3 tarjetas en una fila. Las tarjetas se apilarán en pantallas de dispositivos pequeños.

#### Ejemplo 3: espaciado de la cuadrícula

```powershell
New-UDDynamic -Id 'grid4' -Content {
   $Spacing = (Get-UDElement -Id 'gridSpacingSelect').value
   New-UDGrid -Container -Children {
     New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4  -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
   New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
  } -Spacing $Spacing
}
New-UDSelect -Id 'gridSpacingSelect' -Label Spacing -Option {
  for ($i = 0; $i -lt 10; $i++) {
      New-UDSelectOption -Name $i -Value $i
  }
} -OnChange { Sync-UDElement -Id 'grid4' } -DefaultValue 3
```

Una cuadrícula adaptable con 3 tarjetas en una fila. El espaciado entre las tarjetas puede cambiarse con el cuadro de selección.

#### Ejemplo 4: filas y columnas

```powershell
New-UDRow -Columns {
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 1" -Content {}
    }
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 2" -Content {}
    }
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 3" -Content {}
    }
} -Id 'grid5'
```

Los alias de fila y columna pueden utilizarse para crear una cuadrícula.

#### Ejemplo 5: alineación

```powershell
$Session:direction = 'row'
$Session:justifyContent = 'center'
$Session:alignItems = 'center'
New-UDSelect -Label 'direction' -Option {
    New-UDSelectOption -Name 'row'
    New-UDSelectOption -Name 'row-reverse'
    New-UDSelectOption -Name 'column'
    New-UDSelectOption -Name 'column-reverse'
} -DefaultValue 'row' -OnChange {
    $Session:direction = $EventData
    Sync-UDElement -Id 'example'
}
New-UDSelect -Label 'justifyContent' -Option {
    New-UDSelectOption -Name 'flex-start'
    New-UDSelectOption -Name 'center'
    New-UDSelectOption -Name 'flex-end'
    New-UDSelectOption -Name 'space-between'
    New-UDSelectOption -Name 'space-around'
    New-UDSelectOption -Name 'space-evenly'
} -DefaultValue 'center' -OnChange {
    $Session:justifyContent = $EventData
    Sync-UDElement -Id 'example'
}
New-UDSelect -Label 'alignItems' -Option {
    New-UDSelectOption -Name 'flex-start'
    New-UDSelectOption -Name 'center'
    New-UDSelectOption -Name 'flex-end'
    New-UDSelectOption -Name 'stretch'
    New-UDSelectOption -Name 'baseline'
} -DefaultValue 'center' -OnChange {
    $Session:alignItems = $EventData
    Sync-UDElement -Id 'example'
}
New-UDDynamic -Id 'example' -Content {
    New-UDGrid -Container -Children {
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 1" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 2" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 3" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
    } -Direction $Session:Direction -JustifyContent $Session:justifyContent -AlignItems $Session:alignItems
}
```

La alineación de los elementos de la cuadrícula puede cambiarse con los parámetros direction, justifyContent y alignItems.

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


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.devolutions.net/powershell-universal/es/comandos-de-powershell/new-udgrid.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.