marcel/better-xcloud
1
0
Fork 0
mirror of https://github.com/redphx/better-xcloud.git synced 2025-06-07 16:17:20 +02:00
Code Issues Packages Projects Releases Wiki Activity

Updated How to create custom touch control layout (markdown)

redphx 2024-03-09 12:54:39 +07:00
parent fb752c6ea1
commit e56fbdbc0f
1 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
How-to-create-custom-touch-control-layout.md

@ -1,8 +1,16 @@
## Requirements ## Requirements
- Have Chrome/Edge or any Chromium browsers installed. - Have Chrome/Edge or any Chromium browsers installed.
- Know how to use [Chrome DevTools](https://developer.chrome.com/docs/devtools/) and its [Console Panel](https://developer.chrome.com/docs/devtools/console). - Basic knowgledge about:
- Know about [JSON](https://www.freecodecamp.org/news/what-is-json-a-json-file-example/). - [JSON format](https://www.freecodecamp.org/news/what-is-json-a-json-file-example/)
- Get familiar with [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 kit that is being used to create touch control layouts in xCloud and Better xCloud. - [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.
## Getting started ## Preparations
... 1. Open the xCloud website in Chrome/Edge/Chromium browser.
2. Open the Chrome DevTools.
3. Click on "Toggle device emulation" and set "Dimensions" to "iPhone SE" (or anything you want)
<img width="352" alt="image" src="https://github.com/redphx/better-xcloud/assets/96280/38e27f71-9148-4eb4-873c-81d3b1184a3e">
<img width="285" alt="image" src="https://github.com/redphx/better-xcloud/assets/96280/0ee0fcf6-58a6-4828-b3d6-2f9838035f27">
4. Make sure Better xCloud's `Touch controller > Availability` is set to `All games`. Reload the page if needed.
<img width="455" alt="image" src="https://github.com/redphx/better-xcloud/assets/96280/1ba3118d-9680-4adc-9e66-3aa5b27e89e0">