> ## 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.

# Croix directionnelle

> Croix directionnelle

# Croix directionnelle

Un contrôle de croix directionnelle qui est toujours mappé à la croix directionnelle de la manette.

## Propriétés

`type` - *"directionalPad"*. Spécifie le type de contrôle.

`scale` - *nombre*, *facultatif*. La valeur par défaut est 1. Multiplicateur de taille, utile car les croix directionnelles sont placées comme des boutons et ne sont pas mises à l'échelle automatiquement comme les joysticks.

`deadzone` - *nombre*, *facultatif*. Une valeur comprise entre 0 et 1 qui spécifie la taille de la zone morte en pourcentage du contrôle. Notez que, contrairement à la [zone morte](/fr/reference/system/touchadaptationkit/types/game-streaming-touch-deadzone) des joysticks, les zones mortes des croix directionnelles sont toujours axiales (carrées).

`enabled` - *booléen*, *facultatif*. Valeur par défaut : `true`. Définit l'état visuel du contrôle sur activé/désactivé. Un contrôle désactivé continue de recevoir les entrées du joueur, mais ne modifie PAS son style visuel en fonction de ces entrées.

`visible` - *booléen*, *facultatif*. Valeur par défaut : `true`. Détermine si le contrôle est affiché au joueur pour qu'il puisse interagir avec. Pour le modifier en cours de jeu, consultez [Modification des dispositions tactiles à l'aide de l'état du jeu](/fr/build/core-features/common/game-streaming/building-touch-layouts/game-streaming-touch-changing-layouts-game-state#change_state).

`styles` - *objet*, *facultatif*. Personnalisation de la représentation visuelle du contrôle. Les styles sont représentés sous la forme d'un objet par état pouvant être stylisé.

`interaction` - *objet*, *facultatif*. Définitions de propriétés qui peuvent modifier les mécanismes d'interaction de l'utilisateur avec le contrôle

**Interaction**

`activationType` - *chaîne*, *facultatif*. Définit le type d'activation autorisé pour une direction donnée lors de l'interaction avec la croix directionnelle. Valeur par défaut : `allowNeighboring`. Lorsque la valeur est `exclusive`, une seule direction peut être activée à la fois sur la croix directionnelle (c'est-à-dire une seule parmi 'Up', 'Right', 'Down' ou 'Left'). Lorsque la valeur est `allowNeighboring`, une direction et l'une de ses directions voisines peuvent être activées simultanément en appuyant entre elles (c'est-à-dire que l'utilisateur peut activer 'Up+Right', 'Right+Down', 'Down+Left' ou 'Left+Up' en appuyant entre chacune d'elles, en plus de pouvoir activer chaque direction individuellement).

**États et propriétés de style**

Les états suivants du contrôle de croix directionnelle peuvent être stylisés :

* `default` - Le style de base.
* `disabled` - Le style lorsque le contrôle est désactivé. S'il n'est pas spécifié, une transformation est appliquée au style par défaut lorsque le contrôle est désactivé pour lui donner un aspect désactivé.
* `idle` - Appliqué lorsque le joueur n'interagit PAS avec le contrôle.
* `activated` - Appliqué lorsque le joueur touche le bouton.

Les propriétés suivantes peuvent être utilisées pour styliser le contrôle de croix directionnelle :

`opacity` - *nombre*, *facultatif*. L'opacité à appliquer au contrôle. Valeur par défaut : 1.0 pour tous les états sauf `disabled`.

`fill` - *objet*, *facultatif*. Un objet avec une couleur définie pour le dégradé à utiliser lorsque la croix directionnelle est activée.

`gradient` - *objet*, *facultatif*. Un objet avec une couleur définie pour le dégradé à utiliser lorsque la croix directionnelle est activée.

`background` - *objet*, *facultatif*. Peut être une [couleur](/fr/reference/system/touchadaptationkit/types/game-streaming-touch-color) ou une [ressource image](/fr/reference/system/touchadaptationkit/types/game-streaming-touch-asset).

`stroke` - *objet*, *facultatif*. Couleur à utiliser pour le contour de la croix directionnelle. Doit être un objet [stroke](/fr/reference/system/touchadaptationkit/types/game-streaming-touch-stroke).

**Dimensions des ressources**

Pour chacun des objets de style qui acceptent des ressources image, une ressource donnée est fournie à une résolution de base ainsi qu'aux échelles 1.5x, 2.0x, 3.0x et 4.0x de cette résolution de base. La résolution d'une image donnée doit être inférieure ou égale aux résolutions maximales suivantes :

| Objet | @1.0x | @1.5x | @2.0x | @3.0x | @4.0x |
| :- | :- | :- | :- | :- | :- |
| background | 75x75 | 112x112 | 150x150 | 225x225 | 300x300 |

## Remarques

La croix directionnelle sert à offrir une expérience similaire à celle de la croix directionnelle de la manette physique.

Si elle est utilisée comme mécanisme de déplacement principal du joueur (normalement dans l'emplacement `left` `inner`), il est recommandé d'utiliser une échelle de 2.

**Remarques sur le style**

Si vous utilisez une ressource image personnalisée pour `background`, les résolutions maximales indiquées correspondent à scale=1.0. Si vous utilisez une échelle différente, les résolutions maximales sont égales au produit de la résolution et de l'échelle. Par exemple, scale=1.5 implique qu'une image d'arrière-plan en DPI @1.0x peut avoir une résolution maximale de 90x90.

<Warning>Lors du streaming via la version Windows de Content Test Application, certains styles ne s'affichent pas correctement.</Warning>

## Exemples

#### Exemple 1 : Croix directionnelle par défaut

**Figure 1. Croix directionnelle**

<img src="https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-directional-pad.gif?s=663feec658af51030d5c73cca7b8fc6e" alt="Utilisateur interagissant avec une croix directionnelle" width="320" height="320" data-path="images/gdk/reference/game-streaming-touch-control-images-directional-pad.gif" />

```
{
    "type": "directionalPad",
    "scale": 1.0
}
```

#### Exemple 2 : Croix directionnelle plus grande avec des couleurs personnalisées.

**Figure 1. Croix directionnelle personnalisée**

<img src="https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-directional-pad-2.gif?s=1ccee19714099eab37c0d825a9621856" alt="Utilisateur interagissant avec une croix directionnelle personnalisée" width="320" height="320" data-path="images/gdk/reference/game-streaming-touch-control-images-directional-pad-2.gif" />

```
{
    "type": "directionalPad" ,
    "scale": 2.0,
    "styles" : {
        "default" : {
            "fill" : "#0e7a0d10",
            "gradient" : {
                "color": "#0e7a0d10"
            },
            "stroke" : {
                "type": "solid",
                "color" : "#0e7a0dff"
            }
        }
    }
}
```

## Configuration requise

**Version de la disposition :** 1.0+, (prise en charge du style dans 3.0+, prise en charge de l'interaction dans 3.4+).


## Related topics

- [XR022 Normes de dénomination officielles](/fr/publishing/certification/fma/xr-022.md)
- [XR022 Normes d'appellation officielles](/fr-CA/publishing/certification/fma/xr-022.md)
