Al diseñar botones, los objetos TextButton y ImageButton permiten a un usuario realizar una acción. Puede personalizar estos objetos para proporcionar contexto y sugerencias para lo que desea que haga un usuario. Por ejemplo, puede proporcionar comentarios visuales a los usuarios cambiando la apariencia de un botón de imagen cuando un usuario hace clic en él.
Debido a que estos objetos son GuiObjects, puede personalizar propiedades como BackgroundColor3, BorderMode, Transparency y Rotation para adaptarse a la estética de su experiencia.
Hay dos tipos de botones que puedes usar en una pantalla o superficie de una parte:
Botón de texto - Un TextButton es un rectángulo con texto que realiza una acción definida cuando se hace clic. Esta acción determina la propiedad GuiButton.Activated con scripting.
ImageButton - Un ImageButton es un rectángulo con una imagen que realiza una acción definida cuando se hace clic. Este objeto es útil para una pantalla de selección de personajes o botones de acción rápida intuitivos, como un botón con un icono de carrito que abre un mercado.
Creando Botones en la Pantalla
Los botones en una pantalla son útiles para guiar rápidamente a los usuarios a varios menús o páginas.
Para añadir un botón a la pantalla:
En la ventana Explorador , seleccione StarterGui y agregue un ScreenGui .
Pase el cursor sobre StarterGui y haga clic en el botón ⊕. Aparece un menú contextual.
Inserta un ScreenGui .
Selecciona el nuevo ScreenGui y añade un botón.
Pase el cursor sobre ScreenGui y haga clic en el botón ⊕. Aparece un menú contextual.
Inserta un Botón de Texto o Botón de Imagen .
Creación de botones en caras de partes
Los botones en una parte son útiles para permitir que los usuarios interactúen con las partes. Por ejemplo, puede permitir que los usuarios presionen un botón para completar una acción.
Para añadir un botón a la cara de una parte:
En la ventana Explorador , seleccione la parte y agregue un SurfaceGui .
Pase el cursor sobre la parte **** y haga clic en el botón ⊕. Aparecerá un menú contextual.
Inserta un SurfaceGui .
Selecciona el nuevo SurfaceGui y añade cualquier tipo de botón o entrada.
Pase el cursor sobre SurfaceGui y haga clic en el botón ⊕. Aparece un menú contextual.
Inserta un Botón de Texto o Botón de Imagen .
Si no ve el botón, intente elegir una cara diferente en la propiedad Face del SurfaceGui .
Cambiando la Apariencia de un Botón de Imagen
Cambiar la apariencia de un ImageButton cuando un usuario está interactuando con él proporciona una opiniónvisual útil. Por ejemplo, cuando un ImageButton cambia la apariencia visual cuando un usuario pasa por encima de él, le permite al usuario saber que no está desactivado y que tiene la opción de hacer clic en él si desea realizar esa ImageButton acción.
Un ImageButton tiene tres propiedades para cambiar su aspecto, lookvisual:
Image - La imagen que se muestra cuando un usuario no está interactuando con el ImageButton .
HoverImage - La imagen que se muestra cuando un usuario está moviendo el cursor sobre el ImageButton.
PressedImage - La imagen que se muestra cuando un usuario hace clic en el ImageButton .
Para cambiar la apariencia de un ImageButton con entrada de usuario:
Añade un ImageButton a una pantalla o una superficie.
En la ventana Explorador , haga clic en el objeto ImageButton .
En la ventana Propiedades , asigna tres ID de recurso respectivos para las propiedades Imagen , HoverImage y PressedImage .
Botones de Scripting
Puedes programar una acción cuando un usuario presione un botón conectando el botón a un GuiButton.Activated evento. Por ejemplo, al parentalizar el siguiente LocalScript a un botón, el botón cambia a un color aleatorio cada vez que un usuario hace clic en él.
local button = script.Parent
local RNG = Random.new()
local function onButtonActivated()
-- aleatoriza el color del botón
button.BackgroundColor3 = Color3.fromHSV(RNG:NextNumber(), 1, 1)
end
button.Activated:Connect(onButtonActivated)