Ponad połowa wszystkich sesji Roblox odbywa się na urządzeniach mobilnych, więc ważne jest, aby rozważyć dostępność na platformach krzyżowych podczas projektowania doświadczenia dla szerokiej widowni. Powinieneś celować w duktylarność różnych urządzeń wejścia, w tym myszka i klawiatura i sterowanie.
Projektując doświadczenie mobilne, rozważ orientację urządzenia, którą zamiierz użytkownik w swoim doświadczeniu, a następnie wdroż w swoich wejściach za pomocą ContextActionService, aby wykonać następujące zadania w ramach mobilnych:
- Utwórz przyciski widoczne na ekranie tylko na urządzeniach mobilnych.
- Dostosuj przyciski i interfejs użytkownika mobilnego , aby stworzyć unikalne doświadczenie mobilne.
- Ustawienia kontekstu uzależnionych wskaźników, które umożliwiają tę samą przycisk lub wejście, aby wykonać różną akcję w zależności od sytuacji.
- Wykryj inne urządzenia wejściowe , takie jak myszka lub klawiatura połączona z mobilnym tabletem, aby zapewnić poprawne prompts na ekranie użytkownikowi.
Oriенacja urządzenia
Na telefonach i tabletach orientacja urządzenia znacznie wpływa na doświadczenie użytkownika i interakcję. Na przykład tryb krajobrazowy jest najlepiej zarządzany za pomocą dwóch palców, podczas gdy tryb portretowy może być zarządzany za pomocą jednego palca.
Domyślnie doświadczenia Roblox działają w trybie krajobrazu, umożliwiając wymianę doświadczeń pomiędzy krajobrazem "lewym" i krajobrazem "prawym", jak tarcza rotuje. Można jednak zablokować doświadczenia dla określonej orientacji, jeśli tego życzy.
Tryby Orientacji
Są pięć różnych trybów orientacji, w tym dwa tryby oparte na czujnikach i trzy zamknięte tryby.
| Tryby czujników | |
|---|---|
| Czujnik krajobrazu | Domyślne ustawienia Roblox, w których doświadczenie zawsze pojawia się w trybie krajobrazu (nie w trybie portretu), a urządzenie wykrywa jego orientację fizyczną, aby upewnić się, że widok doświadczenia zawsze jest skierowany w górę. |
| Czujnik | Urządzenie wykrywa swoją fizyczną orientację, aby zapewnić, że widok doświadczenia zawsze jest skierowany w górę, przełączając się między trybem krajobrazu i portretu, jeśli to konieczne. |
| Zablokowane tryby | |
|---|---|
| Lewy krajobraz | Na urządzeniach z fizycznym przyciskiem głównym przyciskiem jest po lewej stronie ekranu. Na urządzeniach z wirtualnym przyciskiem głównym jego region dotykowy znajduje się w dolnej części ekranu. |
| Prawe Podświetlenie | Na urządzeniach z fizycznym przyciskiem głównym przyciskiem jest po prawej stronie ekranu. Na urządzeniach z wirtualnym przyciskiem głównym jego region dotykowy znajduje się w dolnej części ekranu. |
| Portret | Na urządzeniach z fizycznym przyciskiem głównym przycisk główny jest poniżej ekranu. Na urządzeniach z wirtualną przyciskiem głównym/nav bar, jego obszar dotyku jest w dolnej części ekranu. |
Roblox nie włącza trybu „portretu do góry w dół”, ponieważ wiele urządzeń nie jest w stanie tego wspierać.
Właściwości orientacji
Podczas ustawiania orientacji możesz ustawić Rozpoczęcie orientacji, In-Experience Orientation i Current Orientation.
Początkowe Orientacje
StarterGui.ScreenOrientation ustawia domyślną orientację dla miejsce. Dostępne wartości to:
Ponieważ ta właściwość dotyczy wszystkich nowych użytkowników, którzy doświadczenie dołączają, możesz ustawić jego wartość w StarterGui → Enum.ScreenOrientation w Studio.
Oriенacja w przypadku doświadczenia
PlayerGui.ScreenOrientation wyraźnie zmienia orientację doświadczenia dla użytkownika. Gdy ta właściwość jest ustawiona na jeden z Enum.ScreenOrientation enums w LocalScript, doświadczenie natychmiastowo orientuje się, aby pasować do ustawienie. To może być użyteczne, gdy doświad
Poniższy kod przykładu w LocalScript ustawia orientację ekranu na portret:
Obecna Orientacja
PlayerGui.CurrentScreenOrientation dostaje obecną orientację urządzenia. Możliwe wartości to:
Poniższy kod drukuje obecną orientację ekranu użytkownika:
Tryby przemieszczania znaków
Roblox oferuje kilka StarterPlayer właściwości, które możesz ustawić, aby zmienić sposób, w jaki użytkownicy na urządzeniach mobilnych mogą przesuwać się przez twoje doświadczenie.
Możesz ustawić modele sterowania ruchem mobilnym dla doświadczeń Roblox, zmieniając wartości StarterPlayer.DevTouchMovementMode do jednej z obserwuje:
| Opcja | Opis |
|---|---|
| ClickToMove | Użytkownicy mogą poruszać się tylko poprzez doświadczenie, klikając lokalizację docelową. Ta funkcja zawiera przycisk skoku w dolnej prawnej części ekranu. Automatyczny skok jest zawsze aktywny w tym trybie ruchu. |
| DPad | Ta opcja została usunięta z aplikacji mobilnej Roblox i nie powinna być używana do doświadczeń gotowych do produkcji. |
| DynamicThumbstick | Pojawia się dynamiczny joystick, na którym użytkownik początkowo nacisnąć w dół. Ta trybica zawiera przycisk skoku w dolnej prawnej regionie ekranu. Jest to domyślna ustawienie użytkownika dla użytkowników mobilnych, jeśli UserChoice jest ustawiać. |
| Scriptable | Wyłącza wszystkie domyślne sterowanie i pozwala ci skrypcować własny schemat sterowania. |
| Thumbpad | Ta opcja została usunięta z aplikacji mobilnej Roblox i nie powinna być używana do doświadczeń gotowych do produkcji. |
| Thumbstick | Przenośny joystick położony w lewym dolnym regionie ekranu. W przeciwieństwie do DynamicThumbstick , pozycja joysticka jest statyczna i nie zmienia się pozycja, gdy użytkownik dotyka ekranu. |
| UserChoice | Umożliwia użytkownikom wybór dowolnego schematu kontroli z menu Ustawień w trybie bez doświadczenia. To jest domyślny tryb ruchu dla doświadczeń. |
Automatyczny Skok
Gdy StarterPlayer.AutoJumpEnabled jest włączony, automatycznie skacz postać użytkownika w przestrzeniach, gdy zbliża się krawędź platforma. StarterPlayer.AutoJumpEnabled jest włączony domyślnie dla urządzeń mobilnych.
Wyłącz StarterPlayer.AutoJumpEnabled , aby wyłączyć tę funkcję i zmusić użytkowników do skaczania tylko za pomocą ich wiązań klawiaturowych.
Dodawanie przycisków mobilnych
Aby dodać przyciski mobilne, użyj metody ContextActionService:BindAction().
Methode BindAction() przyjmuje następujące parametry:
| Parametr | Typ | Opis |
|---|---|---|
| nazwaAkcji | ciąg | String identyfikatora dla akcji, do której wiążesz. Możesz użyć akcjaName z innymi funkcjami w ContextActionService , aby edytować wiążące. |
| funkcjaDoBind | funkcja | Funkcja do wzywania, gdy określony wejście jest włączone. Ta funkcja otrzymuje trzy argumenty:
|
| utwórzPrzycisk dotykowy | boolean | Gdy prawda, tworzy przycisk na ekranie, gdy gra jest uruchomiona na urządzeniemobilnym. |
| 輸入Type | tupl | Wejścia, które chcesz związać z funkcją, takie jak wartości listy Enum.KeyCode . |
Możesz użyć poniższego kodu przykładu, aby stworzyć akcję interakcji, która tworzy przycisk na ekranie i akceptuje również klawiaturę i gry wpisy:
local ContextActionService = game:GetService("ContextActionService")
local function handleAction(actionName, inputState, inputObject)
if inputState == Enum.UserInputState.Begin then
print(actionName, inputObject)
end
end
-- Zwiąż funkcję
ContextActionService:BindAction("Interact", handleAction, true, Enum.KeyCode.T, Enum.KeyCode.ButtonR1)
Usuwanie przycisków mobilnych
Aby usunąć mobilny przycisk z ekranu, wezwij Class.ContextActionService:UnbindAction()|UnbindAction() używającą strungi actionName, którą przekazałeś do Class.ContextActionService:BindAction()|BindAction().
Użyj poniższego przykładu kodu, aby odłączyć wcześniej stworzoną akcjiInteract:
Personalizowanie interfejsu użytkownika
Możesz użyć jednej z kilku funkcji z ContextActionService , aby dostosować przyciski na ekranie, które są tworzone przez BindAction() .
Tekst przycisku
Aby zmienić etykietę tekstową dla przycisku mobilnego, wezwij SetTitle() z wartością akcji i tytułem:
Zdjęcie przycisku
Przyciski mobilne mogą używać niestandardowych obrazów tak jak inne przyciski GUI używając metody SetImage().
Użyj poniższego przykładowego kodu, aby ustawić obraz przycisku, zastępując ID zasobu obrazem swojego wyboru:
Pozycja przycisku
Domyślnie pozycja nowego przycisku pojawia się w pobliżu dolnej prawnej części ekranu. Powinieneś uważać na umieszczenie przycisku na urządzeniach mobilnych i pamiętać o pozycjach palców i rąk.
Użyj poniższego kodu przykładowego, aby ustawić pozycję przycisku za pomocą metody SetPosition() :
Zależne od kontekstu wpisy
Rozwija się na urządzeniach mobilnych zazwyczaj chcesz zmienić, co robi jeden przycisk w zależności od kontekstu. Ponieważ przestrzeń ekranu na urządzeniach mobilnych jest ograniczona, użyj przycisków kontekstowych, które wykonują różne akcje w zależności od tego, co może zrobić postać.
Na przykład możesz wyświetlić aktywny przycisk "Zbierz", gdy użytkownik stoi blisko skrzyni złota:
Użyj poniższego przykładu kodu, aby stworzyć mobilny przycisk o nazwie "Zbierz" i związany z funkcją collectTreasure :
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))
-- Ustaw obraz na niebieski przycisk "Zbierz"
ContextActionService:SetImage("Interact", "rbxassetid://0123456789")
W innym momencie w gramożesz zmienić przycisk „Rozmawiaj”, gdy użytkownik stoi blisko NPC. Zamiast dodać i usunąć istniejący przycisk, możesz po prostu użyć ContextActionService:BindAction() na istniejącym Interact akcji, zmieniając funkcję i obraz przycisku.
Użyj poniższego przykładu kodu, aby ustawić istniejące przyciskowe etykietę "Rozmawiaj" i związać go z funkcją nazwaną talkToNPC":
Wykrywanie innych urządzeń
W doświadczeniach platformowych konieczne jest zaznajomienie się z aktualnym urządzeniem użytkownika, aby dostosować interfejs użytkownika i wyświetlić poprawne powiadomienia kluczowe.
Na przykład, jeśli użytkownik podejmuje się skarbu i jest tam akcja związana z zbieraniem złota, możesz pokazać użytkownikom mobilnym przycisk "Zbierz" na ekranie i użytkownikom biurowym ikona"T" na ekranie.
Pamiętaj, że urządzenie mobilne może również mieć myszkę i klawiaturę lub gry wtykniętą. Możliwe jest również, że komputer stacjonarny ma włączoną touchscreen lub 2>gry2>. Należy również zaimportować opcje wtyczki użytkownika poprzez wyświetlenie opcji wtyczki
W tych przypadkach możesz użyć UserInputService , aby wykryć, które urządzenia wводу są włączone. Jeśli wiele urządzeń wводу jest włączonych, użyj UserInputService:GetLastInputType() , aby uzyskać używany przez użytkownika końcowy urząd w interfejsie użytkownika.
Możesz użyć następującego ModuleScript, umieszczonego w ReplicatedStorage i zmienionego na UserInputModule, aby uzyskać wpisywaćwejścia użytkownika, po czym możesz dostosować układ niestandardowy lub kontekst do specyficznych potrzeb swojego doświadczenia.
Użyj następującego ModuleScript aby sprawdzić czy włączone zostały urządzenia wвоju i ostatni użyty urządzenie wвоju:
local UserInputService = game:GetService("UserInputService")
local UserInput = {}
local inputTypeString
-- Jeśli urządzenie ma aktywną klawiaturę i myszkę, załóż te wejścia
if UserInputService.KeyboardEnabled and UserInputService.MouseEnabled then
inputTypeString = "Keyboard/Mouse"
-- Else if urządzenie ma zdolność dotyku, ale nie ma klawiatury i myszy, załóż, że dotykuję
elseif UserInputService.TouchEnabled then
inputTypeString = "Touch"
-- Else if urządzenie ma aktywną gamepad, załóż, że gamepad jest wpisywany
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
Kiedy skrypt UserInputModule zostanie miejsce, użyj poniższego przykładu kodu w LocalScript, aby uzyskać ostatni wpisywaćwejścia użytkownika: