`CanvasGroup` renderiza los descendientes como un grupo con color y transparencia
aplicados al resultado de renderizado. Los modificadores visuales de `Class.UIComponent` como
`Class.UICorner` y `Class.UIGradient` bajo un `CanvasGroup` también se aplicarán
a todo el grupo. Ten en cuenta que `CanvasGroup` siempre tiene
`Class.GuiObject.ClipsDescendants|ClipsDescendants` configurado en `true` y todos
los descendientes se renderizarán dentro del área de visualización del grupo.

#### Notas Importantes

- Los descendientes de `CanvasGroup` se renderizarán como una textura aplanada solo
  cuando el ancestro `Class.LayerCollector` tenga su
  `Class.LayerCollector.ZIndexBehavior|ZIndexBehavior` configurado en
  `Enum.ZIndexBehavior.Sibling`.
- `CanvasGroup` consume memoria adicional de textura. La calidad de la textura y
  el uso total de memoria está limitado por el `Enum.QualityLevel` del cliente. Cuando
  se excede el límite de memoria, `CanvasGroup` se renderizará como una textura en blanco.
- Se recomienda usar `CanvasGroup` con tamaños estáticos, de lo contrario, se necesitaría crear una nueva
  textura para acomodar nuevos tamaños.


CanvasGroup

Tono de color que se aplica a todos los descendientes.

CanvasGroup.GroupColor3

Transparencia que se aplica a todos los descendientes.

CanvasGroup.GroupTransparency

Mezcla los descendientes como un grupo con color/transparencia.

`Class.GuiObject` es una clase abstracta (muy parecida a `Class.BasePart`) para un objeto de interfaz de usuario 2D. Define todas las propiedades relacionadas con la visualización de un objeto de interfaz gráfica (GUI) como `Class.GuiObject.Size|Size` y `Class.GuiObject.Position|Position`. También tiene algunas propiedades útiles de solo lectura como `Class.GuiObject.AbsolutePosition|AbsolutePosition`, `Class.GuiObject.AbsoluteSize|AbsoluteSize` y `Class.GuiObject.AbsoluteRotation|AbsoluteRotation`.

Para manipular el diseño de los objetos GUI de maneras especiales, puedes usar una estructura de diseño como [list/flex](/ui/list-flex-layouts) o [grid](/ui/grid-table-layouts), y puedes estilizar más allá de sus propiedades centrales a través de [appearance modifiers](/ui/appearance-modifiers).

Aunque es posible detectar eventos de botones del mouse en cualquier objeto GUI usando `Class.GuiObject.InputBegan|InputBegan` y `Class.GuiObject.InputEnded|InputEnded`, solo `Class.ImageButton` y `Class.TextButton` tienen eventos dedicados convenientes como `Class.TextButton.Activated|Activated` para detectar clicks/presiones.

El siguiente ejemplo asume que está dentro de un GuiObject como un `TextButton`, y
que la propiedad `Class.GuiObject.Draggable` está configurada como verdadera. Imprimirá
el UDim2 de donde el jugador comenzó a arrastrar el objeto.

Este evento se activa cuando un jugador comienza a arrastrar el objeto.

Consulta también `Class.GuiObject.DragStopped`.

GuiObject.DragBegin

initialPosition

Un valor `Datatype.UDim2` de la posición del `Class.GuiObject` antes de que comenzara cualquier operación de arrastre.

Se activa cuando un jugador comienza a arrastrar el objeto.

El siguiente ejemplo asume que está dentro de un GuiObject como un `TextButton`, y
que la propiedad `Class.GuiObject.Draggable` está establecida en verdadero. Imprimirá
las coordenadas X e Y de dónde el jugador dejó de arrastrar la GUI. Por ejemplo, si el
jugador dejara de arrastrar el objeto en 189, 180, el siguiente mensaje imprimiría "El
jugador dejó de arrastrar el GuiObject en (189, 180)"

Este evento se activa cuando un jugador deja de arrastrar el objeto.

Consulta también `Class.GuiObject.DragBegin`.

GuiObject.DragStopped

La ubicación **X** del mouse en píxeles, relativa a la esquina superior izquierda de la pantalla.

La ubicación **Y** del mouse en píxeles, relativa a la esquina superior izquierda de la pantalla.

Se activa cuando un jugador deja de arrastrar el objeto.

El siguiente ejemplo demuestra uno de muchos ejemplos de uso de cómo manejar la entrada del usuario desde InputBegan dependiendo de su tipo.
Para que esto funcione como se espera, debe colocarse en un `LocalScript`
y ser hijo de _gui_.

Este evento se activa cuando un usuario comienza a interactuar con el `Class.GuiObject` a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El `Class.UserInputService` tiene un evento de nombre similar que no está restringido a un elemento UI específico: `Class.UserInputService.InputBegan`.

Este evento se activará siempre independientemente del estado del juego.

Consulta también `Class.GuiObject.InputEnded` y `Class.GuiObject.InputChanged`.

GuiObject.InputBegan

input

Un `Class.InputObject`, que contiene datos útiles para consultar la entrada del usuario
como el `Enum.UserInputType|tipo de entrada`,
`Enum.UserInputState|estado de entrada`, y
`Class.InputObject.Position|coordenadas de pantalla de la entrada`.

Se activa cuando un usuario comienza a interactuar a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El siguiente ejemplo demuestra uno de los muchos ejemplos de uso para manejar la
entrada del usuario desde InputChanged dependiendo de su tipo.
Para que esto funcione como se espera, debe estar colocado en un `LocalScript`
y ser un hijo de _gui_.

Este evento se activa cuando un usuario cambia cómo interactúa a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El `Class.UserInputService` tiene un evento de nombre similar que no está restringido a un elemento UI específico: `Class.UserInputService.InputChanged`.

Este evento se activará siempre independientemente del estado del juego.

Consulta también `Class.GuiObject.InputBegan` y `Class.GuiObject.InputEnded`.

GuiObject.InputChanged

Se activa cuando un usuario cambia cómo interactúa a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El siguiente ejemplo demuestra uno de muchos ejemplos de uso de manejo de entrada
del usuario desde InputEnded dependiendo de su tipo.

Para que esto funcione como se espera, debe ser colocado en un `LocalScript`
y como un hijo de _gui_.

El evento InputEnded se activa cuando un usuario deja de interactuar a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El `Class.UserInputService` tiene un evento de nombre similar que no está restringido a un elemento UI específico: `Class.UserInputService.InputEnded`.

Este evento se activará siempre independientemente del estado del juego.

Consulta también `Class.GuiObject.InputBegan` y `Class.GuiObject.InputChanged`.

GuiObject.InputEnded

Un `Class.InputObject`, que contiene datos útiles para consultar la entrada del usuario
como el `Enum.UserInputType`, `Enum.UserInputState`, y
`Class.InputObject.Position`.

Se activa cuando un usuario deja de interactuar a través de un dispositivo de Interfaz Humano-Computadora (Botón del mouse presionado, toque iniciado, botón del teclado presionado, etc).

El siguiente ejemplo imprime la ubicación del mouse, en píxeles, cuando entra en el elemento de GUI.

El evento MouseEnter se activa cuando un usuario mueve su mouse dentro de un elemento `Class.GuiObject`.

Por favor no dependas de los argumentos `x` e `y` pasados por este evento como una forma infalible de determinar dónde está el mouse del usuario cuando entra a una GUI. Estas coordenadas pueden variar incluso cuando el mouse entra en la GUI a través del mismo borde - particularmente cuando el mouse entra rápidamente en el elemento. Esto se debe a que las coordenadas indican la posición del mouse cuando se activa el evento en lugar del momento exacto en que el mouse entra en la GUI.

Este evento se activa incluso cuando el elemento GUI renderiza por debajo de otro elemento.

Si deseas rastrear cuándo el mouse de un usuario sale de un elemento GUI, puedes usar el evento `Class.GuiObject.MouseLeave`.

##### Consulta También

- `Class.GuiObject.MouseLeave`
- `Class.GuiObject.MouseMoved`
- `Class.GuiObject.MouseWheelForward`
- `Class.GuiObject.MouseWheelBackward`

GuiObject.MouseEnter

La coordenada **X** del mouse en píxeles, relativa a la esquina superior izquierda de la pantalla.

La coordenada **Y** del mouse en píxeles, relativa a la esquina superior izquierda de la pantalla.

Se activa cuando un usuario mueve su mouse dentro de un elemento GUI.

El evento MouseLeave se activa cuando un usuario mueve su mouse fuera de un elemento `Class.GuiObject`.

Por favor no dependas de los argumentos `x` e `y` pasados por este evento como una forma infalible de determinar dónde está el mouse del usuario cuando sale de una GUI. Estas coordenadas pueden variar incluso cuando el mouse sale de la GUI a través del mismo borde - particularmente cuando el mouse deja rápidamente el elemento. Esto se debe a que las coordenadas indican la posición del mouse cuando se activa el evento en lugar del momento exacto en que el mouse deja la GUI.

Este evento se activa incluso cuando el elemento GUI renderiza por debajo de otro elemento.

##### Consulta También

- `Class.GuiObject.MouseEnter`
- `Class.GuiObject.MouseMoved`
- `Class.GuiObject.MouseWheelForward`
- `Class.GuiObject.MouseWheelBackward`

GuiObject.MouseLeave

Se activa cuando un usuario mueve su mouse fuera de un elemento GUI.

Se activa cada vez que un usuario mueve su mouse mientras está dentro de un elemento `Class.GuiObject`. Es similar a `Class.Mouse.Move`, que se activa independientemente de si el mouse del usuario está sobre un elemento GUI.

Ten en cuenta, este evento se activa cuando se actualiza la posición del mouse, por lo tanto se activará repetidamente mientras se mueve.

Los argumentos `x` e `y` indican las coordenadas en pantalla actualizadas del mouse del usuario en píxeles. Estos pueden ser útiles para determinar la ubicación del mouse en la GUI, pantalla y delta desde la posición anterior del mouse si se está rastreando en una variable global.

El código a continuación demuestra cómo determinar el desplazamiento `Datatype.Vector2` del mouse del usuario en relación a un elemento GUI:

```lua
local Players = game:GetService("Players")

local CustomScrollingFrame = script.Parent
local SubFrame = CustomScrollingFrame:FindFirstChild("SubFrame")

local mouse = Players.LocalPlayer:GetMouse()

local function getPosition(X, Y)
	local gui_X = CustomScrollingFrame.AbsolutePosition.X
	local gui_Y = CustomScrollingFrame.AbsolutePosition.Y


	local pos = Vector2.new(math.abs(X - gui_X), math.abs(Y - gui_Y - 36))
	print(pos)
end

CustomScrollingFrame.MouseMoved:Connect(getPosition)
```
Ten en cuenta que este evento puede no activarse exactamente cuando el mouse del usuario entra o sale de un elemento GUI. Por lo tanto, los argumentos `x` e `y` pueden no coincidir perfectamente con las coordenadas de los bordes de la GUI.

##### Consulta También

- `Class.GuiObject.MouseEnter`
- `Class.GuiObject.MouseLeave`
- `Class.GuiObject.MouseWheelForward`
- `Class.GuiObject.MouseWheelBackward`

GuiObject.MouseMoved

Se activa cada vez que un usuario mueve su mouse mientras está dentro de un elemento GUI.

El evento WheelBackward se activa cuando un usuario desplaza su rueda del mouse hacia atrás cuando el mouse está sobre un elemento `Class.GuiObject`. Es similar a `Class.Mouse.WheelBackward`, que se activa independientemente de si el mouse del usuario está sobre un elemento GUI.

Este evento se activa meramente como un indicador del movimiento hacia atrás de la rueda. Esto significa que los argumentos de coordenadas del mouse **x** e **y** no cambian como resultado de este evento. Estas coordenadas solo cambian cuando el mouse se mueve, lo que puede ser rastreado por el evento `Class.GuiObject.MouseMoved`.

##### Consulta También

- `Class.GuiObject.MouseEnter`
- `Class.GuiObject.MouseLeave`
- `Class.GuiObject.MouseMoved`
- `Class.GuiObject.MouseWheelForward`

GuiObject.MouseWheelBackward

Se activa cuando un usuario desplaza su rueda del mouse hacia atrás cuando el mouse está sobre un elemento GUI.

El evento WheelForward se activa cuando un usuario desplaza su rueda del mouse hacia adelante cuando el mouse está sobre un elemento `Class.GuiObject`. Es similar a `Class.Mouse.WheelForward`, que se activa independientemente de si el mouse del usuario está sobre un elemento GUI.

Este evento se activa meramente como un indicador del movimiento hacia adelante de la rueda. Esto significa que los argumentos de coordenadas del mouse **X** y **Y** no cambian como resultado de este evento. Estas coordenadas solo cambian cuando el mouse se mueve, lo que puede ser rastreado por el evento `Class.GuiObject.MouseMoved`.

##### Consulta También

- `Class.GuiObject.MouseEnter`
- `Class.GuiObject.MouseLeave`
- `Class.GuiObject.MouseMoved`
- `Class.GuiObject.MouseWheelBackward`

GuiObject.MouseWheelForward

La coordenada **Y** del mouse del usuario.

Se activa cuando un usuario desplaza su rueda del mouse hacia adelante cuando el mouse está sobre un elemento GUI.

El siguiente ejemplo imprime un mensaje cuando el usuario selecciona el objeto con un
gamepad.

Para que esto funcione como se espera, debe estar en un `LocalScript`
y ser un hijo de _gui_.

Este evento se activa cuando el selector del Gamepad comienza a enfocarse en el `Class.GuiObject`.

Si deseas verificar cuándo el selector del Gamepad deja de enfocarse en el elemento GUI, puedes usar el evento `Class.GuiObject.SelectionLost`.

Cuando una GUI gana enfoque de selección, el valor de la propiedad `Class.GuiService.SelectedObject|SelectedObject` también cambia a la que gana seleção. Para determinar qué GUI ganó selección, verifica el valor de esta propiedad.

GuiObject.SelectionGained

Se activa cuando el objeto GuiObject está siendo enfocado con el selector del Gamepad.

El siguiente ejemplo imprime un mensaje cuando el elemento pierde el foco en
un gamepad.

Para que esto funcione como se espera, debe estar colocado en un `LocalScript`
y ser un hijo de _gui_.

Este evento se activa cuando el selector del Gamepad deja de enfocarse en el `Class.GuiObject`.

Si deseas verificar cuándo el selector del Gamepad comienza a enfocarse en el elemento GUI, puedes usar el evento `Class.GuiObject.SelectionGained`.

Cuando una GUI pierde el enfoque de selección, el valor de la propiedad `Class.GuiService.SelectionObject|SelectionObject` cambia a `nil` o al elemento GUI que gana enfoque de selección. Para determinar qué GUI ganó selección, o si no se seleccionó ninguna GUI, verifica el valor de esta propiedad.

GuiObject.SelectionLost

Se activa cuando el selector del Gamepad deja de enfocarse en el GuiObject.

Este ejemplo de código permite al jugador manipular la posición en la pantalla de algún
elemento UI, como un `Frame`, manteniendo presionado el elemento UI por un breve
momento. Luego, el jugador mueve su dedo y lo suelta. Durante el gesto
el Frame es coloreado de azul con un contorno blanco.

Este evento se activa después de un breve momento cuando el jugador sostiene su dedo
sobre el elemento UI utilizando un dispositivo con pantalla táctil. Se activa con una tabla de
`Datatype.Vector2` que describe las posiciones de pantalla relativas de los
dedos involucrados en el gesto. Además, se activa múltiples veces:
`Enum.UserInputState.Begin` después de un breve retraso,
`Enum.UserInputState.Change` si el jugador mueve su dedo durante el
gesto, y finalmente `Enum.UserInputState.End`. El retraso es dependiente de la plataforma;
en Studio es un poco más largo que un segundo.

GuiObject.TouchLongPress

touchPositions

Un arreglo de `Datatype.Vector2` que describe las **posiciones relativas** de los dedos involucrados en el gesto.

state

Un `Enum.UserInputState` que describe el estado del gesto:

- Begin se activa una vez al inicio del gesto (después del breve retraso).
- Change se activa si el jugador mueve su dedo mientras presiona.
- End se activa una vez al final del gesto cuando suelta su dedo.

Se activa cuando el jugador comienza, continúa y deja de presionar prolongadamente el elemento de UI.

Este ejemplo de código está destinado a ser colocado en un `LocalScript` dentro de un
`Frame` que está dentro de un `Frame` exterior, u otro `GuiObject`. Permite al
jugador manipular la posición del marco interno al mover su dedo sobre
el marco exterior.

Este evento se activa cuando el jugador mueve su dedo sobre el elemento UI
utilizando un dispositivo con pantalla táctil. Se activa poco antes de que
`Class.GuiObject.TouchSwipe` lo haría, y no se activa con
`Class.GuiObject.TouchTap`. Este evento es útil para permitir que el jugador
manipule la posición de los elementos UI en la pantalla.

Este evento se activa con una tabla de `Datatype.Vector2` que describe las
posiciones de pantalla relativas de los dedos involucrados en el gesto. Además,
se activa múltiples veces: `Enum.UserInputState.Begin` después de un
breve retraso, `Enum.UserInputState.Change` cuando el jugador mueve su
 dedo durante el gesto, y finalmente con `Enum.UserInputState.End`.

GuiObject.TouchPan

Un arreglo de Luau de objetos `Datatype.Vector2`, cada uno indicando la posición de todos los dedos involucrados en el gesto.

totalTranslation

Indica qué tan lejos ha llegado el gesto de pan desde su punto de inicio.

velocity

Indica qué tan rápido se está realizando el gesto en cada dimensión.

Indica el `Enum.UserInputState` del gesto.

Se activa cuando el jugador mueve su dedo en el elemento de UI.

Este ejemplo de código está destinado a un `LocalScript` dentro de un `Frame` interno que está
dentro de un `Frame` externo, u otro `GuiObject`. Permite al jugador escalar
el marco interno realizando un gesto de `Class.GuiObject.TouchPinch` en el
marco exterior.

Este evento se activa cuando el jugador utiliza dos dedos para hacer un gesto de pellizcar o separar
sobre el elemento UI utilizando un dispositivo con pantalla táctil. Un **pellizco**
ocurre cuando dos o más dedos se acercan, y una **separación**
ocurre cuando se alejan. Este evento se activa junto con
`Class.GuiObject.TouchPan`. Este evento es útil para permitir que el jugador
manipule la escala (tamaño) de los elementos UI en la pantalla, y se usa con mayor
frecuencia para características de zoom.

Este evento se activa con una tabla de `Datatype.Vector2` que describe las
posiciones de pantalla relativas de los dedos involucrados en el gesto. Además,
se activa múltiples veces: `Enum.UserInputState.Begin` después de un
breve retraso, `Enum.UserInputState.Change` cuando el jugador mueve un dedo
durante el gesto, y finalmente con `Enum.UserInputState.End`. Cabe
destacar que la escala debe ser utilizada **multiplicativamente**.

GuiObject.TouchPinch

Un arreglo de Luau de objetos `Datatype.Vector2`, cada uno indicando la posición de todos los dedos involucrados en el gesto de pellizco.

scale

Un float que indica la diferencia desde el inicio del gesto de pellizco.

Un float que indica qué tan rápido está ocurriendo el gesto de pellizco.

Se activa cuando el jugador realiza un gesto de pellizco o tirar utilizando dos dedos en el elemento de UI.

Este ejemplo de código está destinado a un `LocalScript` dentro de un `Frame` interno que está
dentro de un `Frame` externo, u otro `GuiObject`. Permite al jugador rotar
el marco interno realizando un gesto de `Class.GuiObject.TouchRotate` en el
marco externo.

Este evento se activa cuando el jugador utiliza dos dedos para hacer un gesto de pellizcar o separar
sobre el elemento UI utilizando un dispositivo con pantalla táctil. La rotación ocurre
cuando el ángulo de la línea entre dos dedos cambia. Este evento se activa
junto con `Class.GuiObject.TouchPan`. Este evento es útil para
permitir que el jugador manipule la rotación de los elementos UI en la
pantalla.

Este evento se activa con una tabla de `Datatype.Vector2` que describe las
posiciones de pantalla relativas de los dedos involucrados en el gesto. Además,
se activa múltiples veces: `Enum.UserInputState.Begin` después de un
breve retraso, `Enum.UserInputState.Change` cuando el jugador mueve un dedo
durante el gesto, y finalmente con `Enum.UserInputState.End`.

GuiObject.TouchRotate

Un array de Luau de objetos `Datatype.Vector2`, cada uno indicando la
posición de todos los dedos involucrados en el gesto.

rotation

Un float que indica cuánto ha rotado desde el inicio del gesto.

Un float que indica cuán rápido se está realizando el gesto.

Se activa cuando el jugador realiza un gesto de rotación usando dos dedos en el
elemento de la UI.

Este ejemplo de código hará que un `Frame` (u otro `GuiObject`) rebote cuando se realice un gesto de deslizamiento en un dispositivo con pantalla táctil (o el emulador de Studio).
Deslizamientos horizontales cambiarán el matiz de la
`Class.GuiObject.BackgroundColor3`, mientras que los deslizamientos verticales cambiarán la
saturación.

Este evento se activa cuando el jugador realiza un gesto de deslizar sobre el elemento UI
utilizando un dispositivo con pantalla táctil. Se activa con la dirección del
gesto (Arriba, Abajo, Izquierda o Derecha) y el número de puntos de toque involucrados
en el gesto. Los gestos de deslizar se utilizan a menudo para cambiar pestañas en las
interfaces móviles.

GuiObject.TouchSwipe

swipeDirection

Un `Enum.SwipeDirection` que indica la dirección del gesto de deslizamiento
(Arriba, Abajo, Izquierda o Derecha).

numberOfTouches

El número de puntos de contacto involucrados en el gesto (usualmente 1).

Se activa cuando el jugador realiza un gesto de deslizamiento en el elemento de la UI.

Este ejemplo de código alternará el `Class.GuiObject.BackgroundTransparency` de un
elemento de UI, como un `Frame`, cuando se toque en un dispositivo habilitado para táctil.

Este evento se activa cuando el jugador realiza un gesto de toque sobre el elemento UI
utilizando un dispositivo con pantalla táctil. Un toque es un contacto rápido y único sin
ningún movimiento involucrado (una presión más prolongada activaría
`Class.GuiObject.TouchLongPress`, y moverse durante el toque activaría
`Class.GuiObject.TouchPan` y/o `Class.GuiObject.TouchSwipe`). Se activa
con una tabla de objetos `Datatype.Vector2` que describen las posiciones
relativas de los dedos involucrados en el gesto.

GuiObject.TouchTap

Un array de `Datatype.Vector2` que describe las **posiciones**
relativas de los dedos involucrados en el gesto.

Se activa cuando el jugador realiza un gesto de toque en el elemento de la UI.

Este ejemplo de código demuestra un uso más detallado de TweenPosition al
detectar cuándo se completa/cancela el tween definiendo una función de callback. También
imprime si el tween se reproducirá.

Mueve suavemente una GUI a una nueva posición `Datatype.UDim2` en el tiempo especificado usando la `Enum.EasingDirection` y `Enum.EasingStyle` especificadas.

Esta función devolverá si el tween se reproducirá. No se reproducirá si otro tween está actuando sobre el `Class.GuiObject` y el parámetro override es `false`.

Consulta también `Class.GuiObject:TweenSize()` y `Class.GuiObject:TweenSizeAndPosition()`.

GuiObject:TweenPosition

endPosition

easingDirection

La dirección en la que se debe pasar suavemente la GUI a la _endPosition_.

easingStyle

El estilo en el que se debe pasar suavemente la GUI a la _endPosition_.

time

Cuánto tiempo, en segundos, debe tardar el tween en completarse.

override

Si el tween sobrescribirá un tween en progreso.

callback

Una función de callback para ejecutar cuando se complete el tween.

Mueve suavemente una GUI a una nueva `Datatype.UDim2`.

Este ejemplo de código demuestra el uso de la función `Class.GuiObject:TweenSize()`
. Inicia una animación en la propiedad `Class.GuiObject.Size` del padre
a `UDim2.new(0.5, 0, 0.5, 0)`, que es la mitad del tamaño del
padre del `GuiObject` en ambos ejes.

Además, demuestra cómo se puede usar el parámetro de callback para detectar
cuándo se detiene la interpolación (ya sea que fue cancelada por otra interpolación o completada).

Redimensiona suavemente un `Class.GuiObject` a un nuevo `Datatype.UDim2` en el tiempo especificado utilizando la `Enum.EasingDirection` y `Enum.EasingStyle` especificadas.

Esta función devolverá si el tween se reproducirá. Normalmente, esto siempre devolverá `true`, pero devolverá `false` si otro tween está activo y override se establece en `false`.

Consulta también `Class.GuiObject:TweenSize()` y `Class.GuiObject:TweenSizeAndPosition()`.

GuiObject:TweenSize

endSize

El tamaño al que la GUI debe redimensionarse.

La dirección en la que la GUI debe pasar suavemente al _endSize_.

El estilo en el que la GUI debe pasar suavemente al _endSize_.

Redimensiona suavemente un `Class.GuiObject` a un nuevo `Datatype.UDim2`.

El siguiente ejemplo animará un `Class.Frame` a la esquina superior izquierda del padre's
tamaño y lo redimensionará a 0.

Redimensiona y mueve suavemente una GUI a un nuevo tamaño y posición `Datatype.UDim2` en el tiempo especificado usando la `Enum.EasingDirection` y `Enum.EasingStyle` especificadas.

Esta función devolverá si el tween se reproducirá. Normalmente, esto siempre devolverá `true`, pero devolverá `false` si otro tween está activo y override se establece en `false`.

Consulta también `Class.GuiObject:TweenSize()` y `Class.GuiObject:TweenSizeAndPosition()`.

GuiObject:TweenSizeAndPosition

La dirección en la que la GUI debe pasar suavemente al _endSize_ y _endPosition_.

El estilo en el que la GUI debe pasar suavemente al _endSize_ y _endPosition_.

Mueve suavemente una GUI a un nuevo tamaño y posición.

GuiObject

Este ejemplo de código demuestra el uso de la propiedad Activo como un debounce
para el evento Activado.

Esta propiedad determina si el `Class.GuiObject` aceptará entradas al espacio 3D, como modelos subyacentes con una clase `Class.ClickDetector` como `Class.DragDetector`.

Para los objetos de `Class.GuiButton` (`Class.ImageButton` y `Class.TextButton`), esta propiedad determina si se activa `Class.GuiButton.Activated|Activated` (`Class.GuiButton.AutoButtonColor|AutoButtonColor` seguirá funcionando para esos también). Los eventos `Class.GuiObject.InputBegan|InputBegan`, `Class.GuiObject.InputChanged|InputChanged`, y `Class.GuiObject.InputEnded|InputEnded` funcionan normalmente sin importar el valor de esta propiedad.

GuiObject.Active

Determina si este elemento de UI acepta entradas.

Este código mueve un elemento de UI a diferentes lados del elemento padre.
Comienza en la parte superior izquierda y termina en la parte inferior derecha. Pega esto en un
LocalScript en un Frame, dentro de un ScreenGui.

Esta propiedad determina el punto de origen de un `Class.GuiObject`, relativo a su tamaño absoluto. El punto de origen determina desde dónde se posiciona el elemento (a través de `Class.GuiObject.Position`) y desde donde se expande el tamaño renderizado `Class.GuiObject.Size`.

Consulta [aquí](/ui/position-and-size#anchorpoint) para diagramas ilustrados y detalles.

GuiObject.AnchorPoint

Determina el punto de origen de un `Class.GuiObject`, relativo a su tamaño absoluto.

El siguiente script crea un marco padre de tamaño automático con
un `UIListLayout`, luego inserta varios objetos `TextLabel` de
tamaño automático. Nota cómo el `UIListLayout` padre cambia de tamaño automáticamente para ajustarse a su
contenido hijo y las etiquetas se redimensionan automáticamente para ajustarse a su contenido de texto.
Este script se puede incorporar a un `ScreenGui`.

Esta propiedad se utiliza para dimensionar automáticamente los objetos de UI padre en función del tamaño de sus descendientes. Puedes usar esta propiedad para agregar texto y otro contenido dinámicamente a un objeto de UI en tiempo de edición o ejecución, y el tamaño se ajustará para adaptarse a ese contenido.

Cuando `Class.GuiObject.AutomaticSize|AutomaticSize` se establece en un valor `Enum.AutomaticSize` diferente de `Enum.AutomaticSize|None`, este objeto de UI puede redimensionarse según su contenido secundario.

Para más información sobre cómo usar esta propiedad y cómo funciona, por favor consulta [aquí](/ui/size-modifiers#automatic-sizing).

GuiObject.AutomaticSize

Determina si el redimensionamiento ocurre según el contenido secundario.

Determina el color de fondo del `Class.GuiObject`.

GuiObject.BackgroundColor

Este ejemplo de código hace que un Frame padre recorra todos los colores del arcoíris usando Color3.fromHSV.

Esta propiedad determina el color de fondo de un `Class.GuiObject` (el color de relleno). Si tu elemento contiene texto, como un `Class.TextBox`, `Class.TextButton`, o `Class.TextLabel`, asegúrate de que el color de tu fondo contraste con el color del texto.

Otra propiedad que determina las propiedades visuales del fondo es `Class.GuiObject.BackgroundTransparency`; si esto se establece en `1`, ni el fondo ni el borde se renderizarán.

Consulta también `Class.GuiObject.BorderColor3|BorderColor3`.

GuiObject.BackgroundColor3

Esta propiedad determina la transparencia del fondo y borde del `Class.GuiObject`. Sin embargo, no determina la transparencia del texto si la GUI es un `Class.TextBox`, `Class.TextButton`, o `Class.TextLabel`; la transparencia del texto se determina mediante `Class.TextBox.TextTransparency`, `Class.TextButton.TextTransparency` y `Class.TextLabel.TextTransparency`, respectivamente.

Si esta propiedad se establece en `1`, ni el fondo ni el borde se renderizarán y el fondo de la GUI será completamente transparente.

GuiObject.BackgroundTransparency

Determina la transparencia del fondo y borde del `Class.GuiObject`.

Determina el color del borde del `Class.GuiObject`.

GuiObject.BorderColor

Este código de ejemplo hace que el borde de un GuiObject padre se resalte cuando el
usuario pasa el ratón sobre el elemento.

Determina el color del borde rectangular del `Class.GuiObject` (también conocido como el color del trazo). Esto es separado del `Class.GuiObject.BackgroundColor3` del objeto. No podrás ver el borde del objeto si su propiedad `Class.GuiObject.BorderSizePixel` se establece en `0`.

Ten en cuenta que el componente `Class.UIStroke` permite efectos de borde más avanzados.

GuiObject.BorderColor3

Esta propiedad determina de qué manera se dispone el borde del `Class.GuiObject` en relación a sus dimensiones utilizando el enum del mismo nombre, `Enum.BorderMode`.

Ten en cuenta que `Class.UIStroke` puede sobrescribir esta propiedad y permitir efectos de borde más avanzados.

GuiObject.BorderMode

Determina de qué manera se dispone el borde del `Class.GuiObject` en relación a sus dimensiones.

Esta propiedad determina qué tan ancho se renderiza el borde del `Class.GuiObject`, en píxeles. Establecer esto en 0 desactiva el borde por completo.

Ten en cuenta que `Class.UIStroke` puede sobrescribir esta propiedad y permitir efectos de borde más avanzados.

GuiObject.BorderSizePixel

Determina el ancho en píxeles del borde del `Class.GuiObject`.

Esta propiedad determina si el `Class.GuiObject` recortará (hará invisibles) cualquier parte de los elementos descendentes de la GUI que de otro modo se renderizarían fuera de los límites del rectángulo.

Ten en cuenta que `Class.GuiObject.Rotation|Rotation` no es compatible con esta propiedad. Si esta o cualquier GUI antecesora tiene un **no cero** `Class.GuiObject.Rotation|Rotation`, esta propiedad es **ignorada** y los elementos descendentes de la GUI se renderizarán independientemente del valor de esta propiedad.

GuiObject.ClipsDescendants

Determina si los `Class.GuiObject|GuiObjects` descendientes fuera de los límites de un elemento padre de GUI deben renderizarse.

Esto indica si un `Class.GuiObject` (y sus descendientes) pueden ser arrastrados por la pantalla.

GuiObject.Draggable

Determina si un `Class.GuiObject` (y sus descendientes) puede ser arrastrado por la pantalla.

Cuando el dedo del jugador está siendo tocado y mantenido sobre el `Class.GuiObject`, el `Class.GuiObject.GuiState|GuiState` del `Class.GuiObject` se establecerá en `Enum.GuiState.Press|Press`. De manera similar, cuando el dedo del jugador se esté liberando del `Class.GuiObject`, el `Class.GuiObject.GuiState|GuiState` del `Class.GuiObject` se establecerá en `Enum.GuiState.Idle|Idle`, y cuando `Class.GuiObject.Interactable|Interactable` se desactive en el `Class.GuiObject`, el `Class.GuiState` del `Class.GuiObject` se establecerá en `Enum.GuiState.NonInteractable|NonInteractable`.

GuiObject.GuiState

Determina si el mouse del jugador está siendo presionado activamente sobre el `Class.GuiObject` o no.

GuiObject.InputSink

Determina si el `Class.GuiButton` se puede interactuar o no, o
si el `Enum.GuiState|GuiState` del `Class.GuiObject` está cambiando o
no.

En un `Class.GuiButton`:

- Cuando el ajuste `Class.GuiObject.Interactable|Interactable` en el
  `Class.GuiButton` está establecido a `false`, el `Class.GuiButton` ya
  no podrá ser presionado o clicado, y el
  `Class.GuiObject.GuiState|GuiState` se establecerá constantemente a
  `Enum.GuiState.NonInteractable|NonInteractable`.
- Cuando el ajuste `Class.GuiObject.Interactable|Interactable` en el
  `Class.GuiButton` está establecido a `true`, el `Class.GuiButton` se comportará
  normalmente de nuevo y el `Class.GuiObject.GuiState|GuiState` se comportará
  normalmente.

En un `Class.GuiObject`:

- Cuando el ajuste `Class.GuiObject.Interactable|Interactable` en el
  `Class.GuiButton` está establecido a `false`, el
  `Class.GuiObject.GuiState|GuiState` se establecerá constantemente a
  `Enum.GuiState.NonInteractable|NonInteractable`.
- Cuando el ajuste `Class.GuiObject.Interactable|Interactable` en el
  `Class.GuiButton` está establecido a `true`, el
  `Class.GuiObject.GuiState|GuiState` se comportará normalmente de nuevo.


GuiObject.Interactable

Determina si el `Class.GuiButton` se puede interactuar o no, o
si el `Enum.GuiState|GuiState` del `Class.GuiObject` está cambiando o
no.


Esta propiedad controla el orden de clasificación del `Class.GuiObject` cuando
se utiliza un `Class.UIGridStyleLayout` (como `Class.UIListLayout` o
`Class.UIPageLayout`) con `Class.UIGridStyleLayout.SortOrder|SortOrder`
establecido en `Enum.SortOrder.LayoutOrder`. No tiene funcionalidad si el objeto
no tiene una estructura de diseño de interfaz de usuario hermana.

Los `Class.GuiObject|GuiObjects` se clasifican en orden ascendente donde los
valores más bajos tienen prioridad sobre los mayores. Los objetos con valores
eguales regresan al orden en que fueron añadidos.

Si no estás seguro de si necesitarás añadir un elemento entre dos elementos
e existentes en el futuro, es una buena práctica usar múltiplos de `100`
(`0`, `100`, `200`, etc.). Esto asegura una gran brecha de valores de orden
de diseño que puedes usar para elementos ordenados entre otros elementos.

Consulta también `Class.GuiObject.ZIndex|ZIndex` que determina el
orden de **renderizado** del objeto en lugar del orden de clasificación.


GuiObject.LayoutOrder

Controla el orden de clasificación del `Class.GuiObject` cuando se usa con un
`Class.UIGridStyleLayout`.


Este ejemplo demuestra cómo habilitar la navegación con gamepad a través de una cuadrícula de
`GuiObject|GUI` elementos sin tener que conectar manualmente los
`Class.GuiObject.NextSelectionUp`, `Class.GuiObject.NextSelectionDown`, y
`GuiObject|NextSelectionRight`, y `Class.GuiObject.NextSelectionLeft`
propiedades para cada elemento en la cuadrícula.

Ten en cuenta que este código asume que tu `UIGridLayout` está ordenado por
`Class.UIGridLayout.SortOrder|name`, donde los elementos están nombrados en orden numérico sucesivo.

El código se basa en esto para establecer las propiedades NextSelection para todos
`GuiObjects` en el mismo nivel que el UIGridLayout. En nuestro ejemplo, el
UIGridLayoutObject y los elementos de GUI dentro de la cuadrícula son todos hijos de un
`Frame` llamado _"Container"_. El código
`Class.Instance:GetChildren()|obtiene los hijos` de _"Container"_ y recorre
cada hijo. Los hijos que no son GuiObjects son ignorados. Para cada elemento de GUI,
el código intenta asignar las propiedades NextSelection utilizando la
siguiente lógica:

1. Comenzando con 1, el nombre de todos los elementos de GUI coincide con su posición en la
   cuadrícula
2. Izquierda: El elemento a la izquierda siempre será numerado 1 menos que el actual
   elemento
3. Derecha: El elemento a la derecha siempre será numerado 1 más que el actual
   elemento
4. Arriba: El elemento arriba (hacia arriba) siempre será el número de GUIs en una fila 1 menos que
   el actual elemento
5. Abajo: El elemento abajo (hacia abajo) siempre será el número de GUIs en una fila más
   que el actual elemento. Esta lógica también permite que los elementos de GUI en el
   comienzo y final de las filas (excluyendo el primer y último elemento) se envuelvan
   a las filas siguiente y anterior. Si un elemento no existe a la
   izquierda, derecha, arriba, o abajo, el NextSelection permanecerá nil y mover el
   selector del Gamepad en esa dirección no cambiará el GUI seleccionado.

Este ejemplo también contiene código para probar la cuadrícula usando las teclas de flecha (Arriba,
Abajo, Izquierda, Derecha) de tu teclado en lugar de un gamepad, por si acaso no
tienes un gamepad para probar. Esta parte del código selecciona inicialmente el
elemento llamado _"1"_ asignándolo a la propiedad `Class.GuiService.SelectedObject`.

Esta propiedad establece el `Class.GuiObject` seleccionado cuando el usuario
mueve el selector del [controlador](/input/gamepad) hacia abajo. Si esta
propiedad está vacía, mover el controlador hacia abajo no cambiará el GUI
seleccionado.

Mover el selector del controlador hacia abajo establece el
`Class.GuiService.SelectedObject` a este objeto a menos que el GUI no sea
`Class.GuiObject.Selectable|Selectable`. Ten en cuenta que esta propiedad puede
ser establecida en un elemento GUI incluso si no es
`Class.GuiObject.Selectable|Selectable`, por lo que debes asegurarte de que el
valor de la propiedad seleccionable de un GUI coincida con tu comportamiento
easperado.

Consulta también `Class.GuiObject.NextSelectionUp|NextSelectionUp`,
`Class.GuiObject.NextSelectionLeft|NextSelectionLeft`, y
`Class.GuiObject.NextSelectionRight|NextSelectionRight`.


GuiObject.NextSelectionDown

Establece el `Class.GuiObject` que se seleccionará cuando el selector del
controlador se mueva hacia abajo.


Esta propiedad establece el `Class.GuiObject` seleccionado cuando el usuario
mueve el selector del [controlador](/input/gamepad) a la izquierda. Si esta
propiedad está vacía, mover el controlador a la izquierda no cambiará el
GUI seleccionado.

Mover el selector del controlador a la izquierda establece el
`Class.GuiService.SelectedObject` a este objeto a menos que el GUI no sea
`Class.GuiObject.Selectable|Selectable`. Ten en cuenta que esta propiedad puede
ser establecida en un elemento GUI incluso si no es
`Class.GuiObject.Selectable|Selectable`, por lo que debes asegurarte de que el
valor de la propiedad seleccionable de un GUI coincida con tu comportamiento
easperado.

Consulta también `Class.GuiObject.NextSelectionUp|NextSelectionUp`,
`Class.GuiObject.NextSelectionDown|NextSelectionDown`, y
`Class.GuiObject.NextSelectionRight|NextSelectionRight`.


GuiObject.NextSelectionLeft

Establece el `Class.GuiObject` que se seleccionará cuando el selector del
controlador se mueva a la izquierda.


Esta propiedad establece el `Class.GuiObject` seleccionado cuando el usuario
mueve el selector del [controlador](/input/gamepad) a la derecha. Si esta
propiedad está vacía, mover el controlador a la derecha no cambiará el
GUI seleccionado.

Mover el selector del controlador a la derecha establece el
`Class.GuiService.SelectedObject` a este objeto a menos que el GUI no sea
`Class.GuiObject.Selectable|Selectable`. Ten en cuenta que esta propiedad puede
ser establecida en un elemento GUI incluso si no es
`Class.GuiObject.Selectable|Selectable`, por lo que debes asegurarte de que el
valor de la propiedad seleccionable de un GUI coincida con tu comportamiento
easperado.

Consulta también `Class.GuiObject.NextSelectionUp|NextSelectionUp`,
`Class.GuiObject.NextSelectionDown|NextSelectionDown`, y
`Class.GuiObject.NextSelectionLeft|NextSelectionLeft`.


GuiObject.NextSelectionRight

Establece el `Class.GuiObject` que se seleccionará cuando el selector del
controlador se mueva a la derecha.


Esta propiedad establece el `Class.GuiObject` seleccionado cuando el usuario
mueve el selector del [controlador](/input/gamepad) hacia arriba. Si esta propiedad es
vacía, mover el controlador hacia arriba no cambiará el GUI seleccionado.

Mover el selector del controlador hacia arriba establece el
`Class.GuiService.SelectedObject` a este objeto a menos que el GUI no sea
`Class.GuiObject.Selectable|Selectable`. Ten en cuenta que esta propiedad puede
ser establecida en un elemento GUI incluso si no es
`Class.GuiObject.Selectable|Selectable`, por lo que debes asegurarte de que el
valor de la propiedad seleccionable de un GUI coincida con tu comportamiento
easperado.

Consulta también `Class.GuiObject.NextSelectionDown|NextSelectionDown`,
`Class.GuiObject.NextSelectionLeft|NextSelectionLeft`,
`Class.GuiObject.NextSelectionRight|NextSelectionRight`.


GuiObject.NextSelectionUp

Establece el `Class.GuiObject` que se seleccionará cuando el selector del
controlador se mueva hacia arriba.


Esta propiedad determina la posición pixel y escalar del `Class.GuiObject`
utilizando un `Datatype.UDim2`. La posición está centrada alrededor del
`Class.GuiObject.AnchorPoint` del objeto.

La posición escalar es relativa al tamaño del elemento GUI padre, si
lo hay.

Las porciones en píxeles del valor de `Datatype.UDim2` son las mismas sin
importar el tamaño del GUI padre. Los valores representan la posición del
objeto en píxeles. La posición pixel real de un objeto se puede leer desde la
propiedad `Class.GuiBase2d.AbsolutePosition`.


GuiObject.Position

Determina la posición pixel y escalar del `Class.GuiObject`.


Una clase abstracta para todos los objetos de interfaz de usuario 2D.

/reference/engine/classes/CanvasGroup.yaml