高对比度模式

根据游戏的配色方案，有时可能难以看到触摸布局，因为它们与在基础流中运行的游戏的对比不佳。这对于视力不佳、色盲或其他视觉障碍的玩家来说问题尤其严重。高对比度模式是一种客户端设置，激活后，它会向带图标样式的按钮添加额外笔划和按钮背板，并修改系统颜色以提高对比度。

例如，在高对比度模式下，将禁用标准布局和纯浅色背景：

禁用了高对比度模式的标准触控布局

下面是启用了高对比度模式的相同设置：

启用了高对比度模式的标准触控布局

虽然可以依赖系统默认设置高对比度模式样式，也可以为自定义资产包含高对比度模式变体，并替代系统颜色以匹配游戏的视觉美观。

高对比度模式的自定义资产

在触控适应捆绑包中使用自定义资产时，可以为每个标准对比度资产包含高对比度资产变体。启用高对比度模式时，将呈现这些高对比度资产变体。可通过将 .hc 后缀添加到资产名称后面和文件扩展名之前，将资产标记为高对比度变体。例如，请考虑 myAsset.png （左）和其高对比度变体， myAsset.hc.png （右）：

并排展示自定义资产和高对比度自定义资产变体

在磁盘上布局资产时，标准对比度和高对比度资产将像平常一样按语言和资产规模组织。对于上述资产，文件结构可能如下所示：

assets/
└───neutral/
    ├───@1.0x/
    │       myAsset.png
    │       myAsset.hc.png
    ├───@1.5x/
    │       myAsset.png
    │       myAsset.hc.png
    ├───@2.0x/
    │       myAsset.png
    │       myAsset.hc.png
    ├───@3.0x/
    │       myAsset.png
    │       myAsset.hc.png
    └───@4.0x/
            myAsset.png
            myAsset.hc.png

在布局中，引用资产时不使用文件名扩展名和 .hc 后缀。例如，具有上述资产样式的按钮可能配置如下所示：

{
    "type": "button",
    "action": "gamepadA",
    "styles": {
        "idle": {
            "faceImage": {
                "type": "asset",
                "value": "myAsset"
            }
        }
    }
}

鉴于此样式，触控适配工具包将自动选择 myAsset.png 或 myAsset.hc.png，具体取决于是禁用还是启用高对比度模式。禁用高对比度模式时，此样式将生成以下内容：

禁用了自定义资产和高对比度模式的触控布局

启用高对比度模式时，将生成以下内容：

启用了自定义资产和高对比度模式的触控布局

高对比度模式中的替代系统颜色

触控布局或上下文文件中的调色板可用于替代系统颜色。控件在样式设置时隐式采样系统颜色，这意味着任何替代都将影响所有控件的全局样式（除非控件在自定义 styles 块中具有它自己的替代）。

例如，在启用高对比度模式时，以下布局将替代某些系统颜色以实现自定义样式：

{
  "$schema": "https://raw.githubusercontent.com/microsoft/xbox-game-streaming-tools/main/touch-adaptation-kit/schemas/layout/v4.0/layout.json",
  "styles": {
    "colors": {
      "highContrast": {
        "system_contentPrimary": "#ff00ffff",
        "system_contentSecondary": "#00ff00aa",
        "system_contrastPrimary": "#ff0000aa"
      }
    }
  },
  "content": {
    "left": {
      "inner": [
        {
          "type": "joystick",
          "axis": {
            "input": "axisXY",
            "output": "leftJoystick"
          }
        },
        {
          "type": "button",
          "action": "dPadRight",
          "styles": {
            "default": {
              "faceImage": {
                "type": "icon",
                "value": "map"
              }
            }
          }
        }
      ]
    },
    "right": {
      "inner": [
        {
          "type": "button",
          "action": "gamepadY"
        },
        {
          "type": "button",
          "action": "gamepadB"
        },
        {
          "type": "button",
          "action": "gamepadA"
        },
        {
          "type": "button",
          "action": "gamepadX"
        }
      ]
    }
  }
}

在上面的布局中，在 highContrast 块中声明了三个颜色替代，仅在启用高对比度模式时才应用这些颜色替代：