> ## Documentation Index
> Fetch the complete documentation index at: https://devdocs.xbox.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Cambio de los diseños de controles táctiles según el estado del juego

> Cambio de los diseños de controles táctiles según el estado del juego

Los juegos tienen la capacidad de cambiar el diseño táctil que se muestra al jugador o de modificar el estado que usa un diseño que se está mostrando actualmente. Ambos métodos se pueden usar juntos para crear la experiencia más natural para los jugadores.

**[Cambio de diseños](#change_layout)**

El cambio de diseños debe usarse cuando:

* Se realiza la transición entre distintos esquemas de control (por ejemplo, conducir un vehículo y un shooter en primera persona)
* Se oculta el diseño táctil temporalmente (para ofrecer una experiencia táctil completa, habilitar una experiencia cinematográfica, etc.)

**[Cambio de estado](#change_state)**

El cambio del estado del juego que se incluye en la parte de contexto del paquete de adaptación táctil debe usarse cuando:

* Se modifican las imágenes o la iconografía de los controles según el estado actual del juego del jugador. Algunos ejemplos son:
  * Cambiar la imagen del botón de disparo según el arma que el jugador haya seleccionado.
  * Cambiar las imágenes de las habilidades según los objetos que el jugador tenga actualmente en su inventario.
* Se modifica el estado visual (visibilidad y habilitación) de los controles según el estado actual del juego del jugador. Algunos ejemplos son:
  * Deshabilitar el botón de recarga cuando el jugador no tiene munición adicional.
  * Hacer visible el botón de interacción cuando el jugador se acerca a un objeto con el que puede interactuar (e invisible cuando se aleja).

<a id="change_layout" />

## Cambio de diseños en tiempo de ejecución

**Mostrar un diseño especificado**
El juego debe usar la API [`XGameStreamingShowTouchControlLayout`](/reference/system/xgamestreaming/functions/xgamestreamingshowtouchcontrollayout) para mostrar un nuevo diseño.

**Ocultar el diseño actual**
El juego debe usar la API [`XGameStreamingHideTouchControls`](/reference/system/xgamestreaming/functions/xgamestreaminghidetouchcontrols) para ocultar el diseño que se está mostrando actualmente.

Ejemplo de cómo un juego puede establecer el diseño según el estado actual del juego:

```C++ theme={null}
void OnGameStateChanged(GameState newState)
{
    // Toggle to the set of touch overlay controls which best match the new state of the game
    switch (newState)
    {
    case GameState::FirstPersonAction:
        XGameStreamingShowTouchControlLayout("FirstPersonAction");
        break;
    case GameState::Driving:
        XGameStreamingShowTouchControlLayout("Driving");
        break;
    case GameState::CutScene:
        // Don't show any touch overlay controls while the cut scene is rendering
        XGameStreamingHideTouchControls();
        break;
    }
}
```

<a id="change_state" />

## Cambio de estado en tiempo de ejecución

El estado inicial en el inicio del juego se define mediante el [estado predeterminado](/build/core-features/common/game-streaming/game-streaming-touch-touch-adaptation-bundle#context) incluido en el paquete de adaptación táctil. En el diseño de controles táctiles, el control debe hacer referencia al estado de la propiedad que puede cambiarse en tiempo de ejecución.

El juego puede utilizar la API `XGameStreamingUpdateTouchControlsState` para actualizar el estado durante el tiempo de ejecución.

Por ejemplo, lo siguiente se usaría para tener un control de "recarga" que comienza deshabilitado, pero que se habilita cuando el jugador debe tener esa capacidad.

```JSON theme={null}
//Example context file
{
  "$schema": "https://raw.githubusercontent.com/microsoft/xbox-game-streaming-tools/main/touch-adaptation-kit/schemas/context/v3.0/context.json",

  "state": {
    "enableReload": false
  }
}

//Example control in the layout:
{
    "type": "button",
    "action": "leftBumper",
    "enabled": {
        "$ref": "../../context.json#/state/enableReload"
    }
    ...
}
```

El juego realizaría las llamadas a la API para actualizar el estado:

```C++ theme={null}

// In this example, after the player has switched their active weapon - the game updates the
// enabled state of reload based on whether the player has extra magazines.
//
// Assumes passing in game structure that includes the active weapon with appropriate state.
//

void GameStreamingClientManager::UpdateStateAfterItemsChange(const playerWeapon& playerWeapon)
{
    // create an update for whether the reload button should be enabled
    XGameStreamingTouchControlsStateOperation reloadEnabled;
    reloadEnabled.operationKind = XGameStreamingTouchControlsStateOperationKind::Replace;
    reloadEnabled.path = "/enableReload";
    reloadEnabled.valueKind = XGameStreamingTouchControlsStateValueKind::Bool;
    reloadEnabled.booleanValue = playerWeapon.activeWeapon.reloadClips > 0;

    // combine all the updates into the update state call and make the call
    XGameStreamingTouchControlsStateOperation[1] updateOperations = {reloadEnabled};

    XGameStreamingUpdateTouchControlsState(updateOperations, _countof(updateOperations));
}
```


## Related topics

- [Compilación de diseños de controles táctiles para el streaming de juegos de XBOX](/es/build/core-features/common/game-streaming/building-touch-layouts/index.md)
- [Guía del diseñador para crear controles táctiles](/es/build/core-features/common/game-streaming/building-touch-layouts/game-streaming-tak-designers-guide.md)
- [Diseño de controles táctiles de plataformas 2D](/es/build/core-features/common/game-streaming/building-touch-layouts/samples/game-streaming-touch-tak-sample-platformer.md)
- [Compilación de diseños de controles táctiles](/es/build/core-features/common/game-streaming/building-touch-layouts/game-streaming-touch-building-touch-layout.md)
- [Diseño de controles táctiles de conducción](/es/build/core-features/common/game-streaming/building-touch-layouts/samples/game-streaming-touch-tak-sample-driving.md)