diff --git a/How-to-create-custom-touch-control-layout.md b/How-to-create-custom-touch-control-layout.md index b746eb6..9f1249e 100644 --- a/How-to-create-custom-touch-control-layout.md +++ b/How-to-create-custom-touch-control-layout.md @@ -1,14 +1,15 @@ ## Requirements - Have Chrome/Edge or any Chromium browsers installed. +- Have an Android device with Kiwi Browser installed if you want to test on real device. - Basic knowgledge about: - [JSON format](https://www.freecodecamp.org/news/what-is-json-a-json-file-example/) - [Chrome DevTools](https://developer.chrome.com/docs/devtools/) and its [Console Panel](https://developer.chrome.com/docs/devtools/console) - Get familiar with the [Touch Adaptation Kit](https://learn.microsoft.com/en-us/gaming/gdk/_content/gc/system/overviews/game-streaming/game-streaming-touch-touch-adaptation-kit-overview). This is the same tech that is being used to create touch control layouts in xCloud and Better xCloud. The tool isn't provided publicly so we have to create the layout manually. -## Preparations +## Preparations for testing on desktop 1. Open the xCloud website in Chrome/Edge/Chromium browser. 2. Open the `Chrome DevTools`. -3. Click on the `Toggle device emulation` button and set `Dimensions` to `iPhone SE` (or anything you want). +3. Click on the `Toggle device emulation` button and set `Dimensions` to any device you want. I prefer `iPhone SE` because it has 16:9 screen ratio. Don't select Android devices or Chrome will become fullscreen every time you load a game. image image @@ -18,6 +19,11 @@ image 6. Done. +## Preparations for testing on Android device +... ## Getting started -... \ No newline at end of file +1. Do all the preparation steps. +2. Open Chrome DevTools, enable `Toggle device emulation`, reload page. +3. Load the game you want to create custom layout for. It must not having official touch support. In this guide I'll pick [DOOM (1993)](https://www.xbox.com/en-US/play/games/doom-1993/9PLZPHBNHTMF). + ![image](https://github.com/redphx/better-xcloud/assets/96280/d57753b2-3b2b-4ed9-89bf-35ad4a6d99cd)