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

# Button

> Button

# Button

플레이어의 터치 입력에 반응할 수 있는 기본 컨트롤입니다. 배경과 페이스 이미지 모두에 대해 커스텀 아트워크를 갖도록 스타일을 지정할 수 있습니다.

## Properties

`type` - *"button"*. 컨트롤 유형을 지정합니다.

`action` - *string*. 플레이어가 버튼을 터치할 때 호출할 [Action(s)](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-action)입니다.

`enabled` - *boolean*, *optional*. 기본값은 `true`입니다. 컨트롤의 시각적 상태를 활성/비활성으로 설정합니다. 비활성화된 컨트롤은 플레이어로부터 여전히 입력을 받지만, 입력에 따라 시각적 스타일이 *변경되지는* 않습니다.

`pullAction` - *string* 또는 *object*, *optional*. 플레이어가 터치 중에 버튼을 당길 때 호출할 [Action(s)](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-action)입니다. 아래 샘플에서와 같이 풀 액션을 오브젝트로 정의하면, 풀 버튼이 분할되어 풀 액션 `items` 배열의 각 항목이 해당 세그먼트에 액션을 할당합니다. 세그먼트는 버튼 주위에 균등하게 배치되며 최대 4개까지 허용됩니다.

* Segmented Pull Action Properties (Introduced in v4.1)

  * `type` - *"segmented"*. 풀 액션의 유형을 세그먼트된 풀 액션으로 지정합니다.

  * `items` - *array*. 최대 4개의 [Action(s)](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-action) 배열이며, 각 항목은 플레이어가 해당 세그먼트 방향으로 컨트롤의 가장자리까지 터치를 드래그하거나 당길 때 호출됩니다.

`toggle` - *boolean*, *optional*. 기본값은 `false`입니다.

* `false`이면 버튼을 누를 때 입력이 전송되고, 누르지 않을 때는 전송되지 않습니다.
* `true`이면 버튼을 누를 때마다 해당 액션에 대해 입력을 전송하는지 여부가 전환됩니다.

`visible` - *boolean*, *optional*. 기본값은 `true`입니다. 플레이어가 상호 작용할 수 있도록 컨트롤을 표시할지 여부를 결정합니다. 게임 플레이 중에 변경하려면 [게임 상태를 사용하여 터치 레이아웃 변경](/ko/build/core-features/common/game-streaming/building-touch-layouts/game-streaming-touch-changing-layouts-game-state#change_state)을 참조하세요.

`styles` - *object*, *optional*. 컨트롤의 시각적 표현을 커스터마이즈합니다. 스타일은 스타일을 지정할 수 있는 상태별 오브젝트로 표현됩니다.

버튼 컨트롤은 다음 상태에 대해 스타일을 지정할 수 있습니다.

* `default` - 기본 스타일입니다.
* `disabled` - 컨트롤이 비활성화되었을 때의 스타일입니다. 지정하지 않으면 컨트롤이 비활성화되었을 때 기본 스타일에 변환이 적용되어 비활성화된 것처럼 표시됩니다.
* `idle` - 플레이어가 컨트롤과 *상호 작용하지 않을* 때 적용됩니다.
* `activated` - 플레이어가 버튼을 터치하고 있을 때 적용됩니다.
* `pulled` - 플레이어가 버튼을 터치하고 당기고 있을 때 적용됩니다. 세그먼트된 풀 액션의 경우, 당겨진 단일 세그먼트에만 이 상태의 스타일이 적용됩니다. 다른 세그먼트는 `activated` 스타일을 유지합니다.
* `toggled` - 버튼이 토글된 상태이고 플레이어가 버튼을 터치하지 않고 있을 때 적용됩니다.

**Styling properties per state**

`opacity` - *number*, *optional*. 컨트롤에 적용될 불투명도입니다. `disabled`를 제외한 모든 상태에서 기본값은 1.0입니다.

`faceImage` - *object*, *optional*. [icon](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-icon) 또는 [image asset](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-asset)일 수 있습니다.

`background` - *object*, *optional*. [color](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-color) 또는 [image asset](/ko/reference/system/touchadaptationkit/types/game-streaming-touch-asset)일 수 있습니다. idle 및 disabled 상태에서는 표시되지 않습니다.

**Asset dimensions**

이미지 애셋을 허용하는 각 스타일 오브젝트에 대해, 주어진 애셋은 기본 해상도와 해당 기본 해상도의 1.5x, 2.0x, 3.0x, 4.0x 배율로 제공됩니다. 주어진 이미지의 해상도는 다음 최대 해상도보다 작거나 같아야 합니다.

| Object | @1.0x | @1.5x | @2.0x | @3.0x | @4.0x |
| :- | :- | :- | :- | :- | :- |
| faceImage | 60x60 | 90x90 | 120x120 | 180x180 | 240x240 |
| background | 60x60 | 90x90 | 120x120 | 180x180 | 240x240 |

## Remarks

버튼은 일반적으로 물리적 컨트롤러의 하나 이상의 물리적 버튼으로 수행되는 액션을 플레이어가 수행할 수 있도록 하는 데 사용됩니다.

여러 액션을 활용하여 플레이어가 조합 액션(예: 왼쪽 범퍼와 오른쪽 범퍼를 동시에 누르기)을 쉽게 복제할 수 있도록 합니다.

**Styling remarks**

`activated` 상태일 때 `faceImage`가 25% 더 작게 표시됩니다.

커스텀 애셋을 사용하지 않고 `gamepadX`, `gamepadY`, `gamepadA` 또는 `gamepadB` 중 하나의 액션만 갖는 버튼에 대해서는 라벨과 배경색에 대한 기본 스타일이 있습니다.

## Samples

#### Example 1: Jump button mapped to the A button

![버튼을 누르는 사용자](https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-button.gif?s=585c8746250b36534c236117851e82f4)

```JSON theme={null}
{
    "type": "button",
    "action": "gamepadA",
    "styles": {
        "default": {
            "faceImage": {
                "type": "icon",
                "value": "jump"
            }
        }
    }
}
```

#### Example 2: Crouch button mapped to pressing the left bumper and the right bumper simultaneously

![두 개의 액션에 매핑된 버튼을 누르는 사용자](https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-button-2.gif?s=0c9485ee05b533ae100e8edaee6882b6)

```JSON theme={null}
{
    "type": "button",
    "action": [ "leftBumper", "rightBumper"] ,
    "styles": {
        "default": {
            "faceImage": {
                "type": "icon",
                "value": "crouch"
            }
        }
    }
}
```

#### Example 3: Button with custom face image and background image

![커스텀 애셋이 있는 버튼을 누르는 사용자](https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-button-3.gif?s=4503a193449c834d72a50e19a111e9d2)

```JSON theme={null}
{
    "type": "button",
    "action": "gamepadA",
    "enabled" : true,
    "styles": {
        "default": {
            "background": {
                "type": "asset",
                "value": "hex_background"
            },
            "faceImage": {
                "type": "asset",
                "value": "one"
            }
        },
        "activated": {
            "background": {
                "type": "asset",
                "value": "hex_background_glow"
            }
        }
    }
}
```

#### Example 4: Segmented pull action with custom styling per segment

> [!NOTE]
>
> 세그먼트된 풀 버튼의 스타일을 지정하려면 `pullIndicator` 배열이 세그먼트를 정의한 `items` 속성과 동일한 길이여야 합니다. 즉, 각 세그먼트는 스타일 정의를 가져야 하며, 특정 세그먼트에 대해 스타일 재정의를 생략하려면 `null`을 사용해야 합니다.

![세그먼트된 풀 액션이 있는 버튼을 누르는 사용자.](https://mintcdn.com/microsoft-4404708b/-_0FrcE2bDxzGxv-/images/gdk/reference/game-streaming-touch-control-images-button-segmented-pull.gif?s=d28b3799cc728ed15d8af352b009bb46)

```JSON theme={null}
{
    "type": "button",
    "action": "gamepadA",
    "pullAction": {
       "type": "segmented",
       "items": [
          "gamepadB",
          "gamepadY"
       ]
    },
    "styles": {
        "default": {
           "pullIndicator": [
               {
                 "faceImage": {
                    "type": "icon",
                    "value": "sword"
                 }
               },
               {
                 "faceImage": {
                    "type": "icon",
                    "value": "block"
                 }
               }
            ]
        },
        "idle": {
           "pullIndicator": [
               null,
               {
                 "opacity": 0.5
               }
            ]
        }
    }
}
```

## Requirements

**Minimum Layout Version:** 1.0+ (Styling support in 2.0+).

## See also

[Touch Adaptation Kit 참조](/ko/build/core-features/common/game-streaming/game-streaming-touch-touch-adaptation-kit-overview)


## Related topics

- [GAMEPAD_BUTTONS Enumeration](/reference/tools/xtf/xtfinput/enumerations/GAMEPAD_BUTTONS-typedef-xtfinput-xbox-windows-t.md)
- [GAMEPAD_MORE_BUTTONS](/reference/tools/xtf/xtfinput/enumerations/gamepad_more_buttons.md)
- [Enumeración GAMEPAD_BUTTONS](/es/reference/tools/xtf/xtfinput/enumerations/GAMEPAD_BUTTONS-typedef-xtfinput-xbox-windows-t.md)
- [Énumération GAMEPAD_BUTTONS](/fr-CA/reference/tools/xtf/xtfinput/enumerations/GAMEPAD_BUTTONS-typedef-xtfinput-xbox-windows-t.md)
