Más de la mitad de todas las sesiones de Roblox se reproducen en dispositivos móviles, por lo que es importante considerar la accesibilidad en plataforma cruzada al diseñar una experiencia para un amplio público. Debe apuntar a apoyar una variedad de dispositivos de entrada, incluidos mouse y teclado y gamepad .
Al diseñar una experiencia móvil, considere la orientación del dispositivo que tiene la intención de usar en su experiencia, luego implemente sus entradas con Class.ContextActionService para realizar las siguientes tareas de entrada relacionadas con móviles:
- Crear botones en la pantalla solo es visible en dispositivos móviles.
- Configurar contextos de dependencia de entrada que permite que el mismo botón o entrada realice una acción diferente dependiendo de la situación.
- Detecta otros dispositivos de entrada, como un mouse o teclado conectado a un tablet móvil, para proporcionar las solicitudes de pantalla correctas al usuario.
Orientación del dispositivo
En teléfonos y tabletas, la orientación del dispositivo afecta principalmente la experiencia del usuario y la interacción. Por ejemplo, el modo de paisaje se opera mejor con dos dedos mientras que el modo de retrato puede dar lugar a una interfaz de un dedo.
Por defecto, las experiencias de Roblox se ejecutan en modo de paisaje, lo que permite que la experiencia se cambie entre el modo de paisaje "izquierdo" y el modo de paisaje "derecho" a medida que el dispositivo gira. Sin embargo, las experiencias se pueden bloquear para una orientación específica si se desea.
Modos de Orientación
Hay cinco diferentes modos de orientación, incluidos dos modos basados en sensores y tres modos bloqueados.
| Modos de sensores | |
|---|---|
| Sensor de paisaje | La configuración predeterminada de Roblox en la que siempre aparece el modo de vista de la experiencia (sin modo de retrato) y el dispositivo detecta su orientación física para asegurar que la vista de la experiencia siempre esté orientada hacia arriba. |
| Sensor | El dispositivo detecta su orientación física para asegurar que la vista de la experiencia siempre esté orientada hacia arriba, cambiando entre el modo de paisaje y el modo de retrato según sea necesario. |
| Modos bloqueados | |
|---|---|
| izquierda paisaje | En dispositivos con un botón de inicio físico, el botón de inicio está a la izquierda de la pantalla. En dispositivos con una barra de inicio virtual, su región de toque está en la parte inferior de la pantalla. |
| Escarcha derecha | En dispositivos con un botón de inicio físico, el botón de inicio está a la derecha de la pantalla. En dispositivos con una barra de inicio virtual, su región de toque está en la parte inferior de la pantalla. |
| Retrato | En dispositivos con un botón de inicio físico, el botón de inicio está debajo de la pantalla. En dispositivos con una barra de inicio virtual, su región de toque está en la parte inferior de la pantalla. |
Roblox no incluye un modo "al revés" ya que muchos dispositivos no admiten esa orientación por defecto.
Propiedades de orientación
Al configurar una orientación, puede establecer la Orientación de inicio, la Orientación en la experiencia y la Configuración actual.
Comenzando Orientación
StarterGui.ScreenOrientation establece la orientación predeterminada para un lugar. Los valores aceptables incluyen:
Dado que esta propiedad afecta a todos los nuevos usuarios que se unen a la experiencia, puede establecer su valor en StarterGui → Enum.ScreenOrientation dentro de Studio.
Orientación In-Experience
PlayerGui.ScreenOrientation Explica explícitamente la orientación de la experiencia para un usuario. Cuando esta propiedad está configurada como una de las Enum.ScreenOrientation en un LocalScript , la experiencia se alineará inmediatamente con la configuración. Esto puede ser útil cuando una experiencia necesita proporcionar una experiencia específica como bloquear la vista para un minijuego
El siguiente código de ejemplo en un LocalScript establece la orientación de la pantalla a retrato:
Orientación actual
PlayerGui.CurrentScreenOrientation obtiene la orientación del dispositivo actual. Los valores posibles incluyen:
El siguiente código imprime la orientación de la pantalla actual del usuario:
Modos de movimiento de personajes
Roblox ofrece varias propiedades de StarterPlayer que puedes configurar para cambiar la forma en que los usuarios en dispositivos móviles pueden moverse a través de tu experiencia.
Puede configurar los esquemas de control de movimiento móvil para las experiencias de Roblox cambiando los valores de StarterPlayer.DevTouchMovementMode a uno de los siguiendo:
| Opción | Descripción |
|---|---|
| ClickToMove | Los usuarios solo pueden moverse por la experiencia al tocar una ubicación de destino. Este modo incluye un botón de salto en la región inferior derecha de la pantalla. Saltar automáticamente siempre está activo en este modo de movimiento. |
| DPad | Esta opción se ha eliminado de la aplicación móvil de Roblox y no se debe usar para experiencias de producción. |
| DynamicThumbstick | Un joystick dinámico aparece donde el usuario inicialmente presiona hacia abajo. Este modo incluye un botón de salto en la región inferior derecha de la pantalla. Esta es la configuración predeterminada para los usuarios móviles si se establecerUserChoice . |
| Scriptable | Desactiva todos los controles predeterminados y te permite programar tu propio esquema de control . |
| Thumbpad | Esta opción se ha eliminado de la aplicación móvil de Roblox y no se debe usar para experiencias de producción. |
| Thumbstick | Un joystick móvil que se encuentra en la región inferior izquierda de la pantalla. A diferencia de DynamicThumbstick, la posición del joystick no es estática y no cambia la posición cuando el usuario toca la pantalla. |
| UserChoice | Le permite a los usuarios elegir su esquema de control deseado desde el menú In-Experience Settings. Este es el modo de movimiento predeterminado para las experiencias. |
Salto automático
Cuando StarterPlayer.AutoJumpEnabled está activado, el personaje del usuario salta automáticamente entre los espacios cuando se acerca el borde de una plataforma. StarterPlayer.AutoJumpEnabled está activado por defecto para los dispositivos móviles.
Desactivar StarterPlayer.AutoJumpEnabled para desactivar esta función y obligar a los usuarios a saltar solo usando sus atajos de teclas.
Agregar botones móviles
Para agregar botones móviles, use el método ContextActionService:BindAction().
El método BindAction() toma los siguientes parámetros:
| Parámetro | Tipo | Descripción |
|---|---|---|
| Nombre de acción | cadena | Una cadena de identificador para la acción a la que estás vinculando. Puedes usar el actionName con otras funciones en ContextActionService para editar el vínculo. |
| función para vincular | función | La función para llamar cuando se activa la entrada especificada. Esta función recibe tres argumentos:
|
| crearBotón de crear | booleano | Cuando es cierto, crea un botón en la pantalla cuando el juego se está ejecutando en un dispositivo móvil. |
| Tipos de entrada | tupla | Las entradas que desea vincular a la función, como valores de lista de valores de un Enum.KeyCode . |
Puede usar el siguiente código de ejemplo para crear una acción de Interact que crea un botón en la pantalla y también acepta una entrada teclado y gamepad:
local ContextActionService = game:GetService("ContextActionService")
local function handleAction(actionName, inputState, inputObject)
if inputState == Enum.UserInputState.Begin then
print(actionName, inputObject)
end
end
-- Vincular acción para funcionar
ContextActionService:BindAction("Interact", handleAction, true, Enum.KeyCode.T, Enum.KeyCode.ButtonR1)
Eliminando botones móviles
Para eliminar un botón móvil de la pantalla, llama a UnbindAction() usando la cadena de acciónName que pasaste a BindAction() .
Usa el siguiente código de ejemplo para desvincular la acción Interact previo:
Personalización de la interfaz de usuario
Puede usar una de las varias funciones de ContextActionService para personalizar los botones de pantalla que se crean por BindAction() .
Texto del botón
Para cambiar la etiqueta de texto para un botón móvil, llame a SetTitle() con la cadena de acción y un título:
Imagen de Botón
Los botones móviles pueden usar imágenes personalizadas al igual que otros botones de GUI usando el método SetImage() .
Usa el código de ejemplo a continuación para establecer una imagen de botón, reemplazando la ID de la herramienta con una imagen de tu elección:
Posición de botón
Por defecto, la posición de un nuevo botón aparece cerca de la sección inferior derecha de la pantalla. Deberías considerar cuidadosamente la posición de los botones en los dispositivos móviles y mantener en mente las posiciones de los dedos y las manos.
Usa el código de ejemplo siguiente para configurar la posición de un botón con el método SetPosition() :
Entradas contexto-dependientes
Al desarrollar para dispositivos móviles, a menudo puede que quieras cambiar lo que hace un solo botón en función del contexto. Dado que el espacio de pantalla en los dispositivos móviles es limitado, usa botones contextuales que realicen diferentes acciones en función de lo que el personaje es capaz de hacer.
Por ejemplo, puede mostrar un botón "Recolectar" activo cuando el usuario está cerca de un cofre de oro:
Usa el siguiente código de ejemplo para crear un botón móvil que se etiqueta "Recolectar" y está vinculado a la función recolectarTreasure:
local ContextActionService = game:GetService("ContextActionService")
local function collectTreasure(actionName, inputState, inputObject)
if inputState == Enum.UserInputState.Begin then
print("Collect treasure")
end
end
ContextActionService:BindAction("Interact", collectTreasure, true, Enum.KeyCode.T, Enum.KeyCode.ButtonR1)
ContextActionService:SetPosition("Interact", UDim2.new(1, -70, 0, 10))
-- Establecer el imagen en azul "Recolectar" botón
ContextActionService:SetImage("Interact", "rbxassetid://0123456789")
En otro momento en el juego, puede cambiar el botón a "Hablar" cuando el usuario está cerca de un PNJ. En lugar de agregar y eliminar el botón existente, puede simplemente usar ContextActionService:BindAction() en la acción de Interact existente, cambiando la función y el imagen del botón.
Usa el siguiente código de ejemplo para asignar la etiqueta de botón existente a "Hablar" y vincularla a una función llamada talkToNPC.:
Detectando otros dispositivos
En las experiencias de plataforma cruzada, es necesario conocer el dispositivo actual del usuario para ajustar las solicitudes de teclas correctas.
Por ejemplo, si un usuario se acerca a un cofre de tesoro y hay una acción vinculada a la recolección de oro, puede mostrar a los usuarios móviles un botón "Recolectar" en la pantalla y a los usuarios de escritorio un íconode "T" en la pantalla.
Tenga en cuenta que un dispositivo móvil también puede tener un ratón y teclado o gamepad conectado. También es posible que un escritorio tenga un touchscreen habilitado. Es importante referirse a las opciones de entrada preferidas del usuario al mostrar las opciones de entrada para el dispositivo activamente usado.
En estos casos, puede usar UserInputService para detectar qué dispositivos de entrada están habilitados. Si se habilitan múltiples dispositivos de entrada, use UserInputService:GetLastInputType() para obtener el dispositivo de entrada del usuario para mostrar en la interfaz de usuario.
Puedes usar el siguiente ModuleScript, colocado dentro de ReplicatedStorage y renombrado a UserInputModule, para obtener el introducirde entrada del usuario, después de lo cual puedes adaptar el diseño de la interfaz de usuario o el contexto a las necesidades específicas de tu experiencia.
Usa el siguiente ModuleScript para chequear por dispositivos de entrada habilitados y el último dispositivo de entrada usado:
local UserInputService = game:GetService("UserInputService")
local UserInput = {}
local inputTypeString
-- Si el dispositivo tiene teclado y ratónactivo, asume esos controles
if UserInputService.KeyboardEnabled and UserInputService.MouseEnabled then
inputTypeString = "Keyboard/Mouse"
-- De lo contrario, si el dispositivo tiene capacidad de tocar pero no tiene teclado y ratón, asume que la entrada de toque
elseif UserInputService.TouchEnabled then
inputTypeString = "Touch"
-- De lo contrario, si el dispositivo tiene una plataforma de juegos activa, asumir la entrada de la plataforma de juegos
elseif UserInputService.GamepadEnabled then
inputTypeString = "Gamepad"
end
function UserInput.getInputType()
local lastInputEnum = UserInputService:GetLastInputType()
if lastInputEnum == Enum.UserInputType.Keyboard or string.find(tostring(lastInputEnum.Name), "MouseButton") or lastInputEnum == Enum.UserInputType.MouseWheel then
inputTypeString = "Keyboard/Mouse"
elseif lastInputEnum == Enum.UserInputType.Touch then
inputTypeString = "Touch"
elseif string.find(tostring(lastInputEnum.Name), "Gamepad") then
inputTypeString = "Gamepad"
end
return inputTypeString, lastInputEnum
end
return UserInput
Una vez que el script UserInputModule esté en lugar, usa el siguiente ejemplo de código en un LocalScript para obtener el último introducirde entrada del usuario: