# 触摸与反馈

> 通过 pressable() 实现自动按压动画，以及对组件 alpha 的手动控制。

Source: https://crossfly.dev/zh/docs/ui/animations/press-and-feedback — CrossFly documentation. Full docs as one file: https://crossfly.dev/llms-full.txt

# 触摸与反馈

在 CrossFly 中，当样式被标记为可按压时，对触摸的视觉响应（按钮的"下沉"）是**自动**的 — 你无需编写任何动画。

## 完整示例（复制、粘贴并运行）
```java
package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;
import dev.crossfly.ui.style.*;   // ComponentStyle

/** 可执行的主界面。将 launcher 指向此类（classname）并运行：gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      // 自动按压反馈：使用 .pressable() 的自定义样式
      Button botao = new Button("Enviar");
      botao.style(new ComponentStyle().backColor(0xFF0173ED).pressable());
      add(LAY_AUTO, botao);

      // 手动控制不透明度以表示状态（选中/禁用）
      Label item = new Label("Item");
      add(LAY_AUTO, item);
      boolean selecionado = false;
      item.alpha(selecionado ? 1f : 0.5f);
      Component.repaint();

      // 带反馈地切换状态：点击时将项目高亮恢复为不透明
      botao.onAction(c -> { item.alpha(1f); Component.repaint(); });
   }
}
```
> 下面的片段只展示了**核心部分**（放入 `onShow()` 内部的内容）。要运行它们，请将其放入上面的 `MainWindow` 骨架中。

## 自动按压反馈 — `pressable()`
将样式标记为 `pressable()`，组件在被触摸时便会自行播放动画（使用主题的
`animationDuration`）：
```java
Button b = new Button("Enviar");
b.style(Styles.button());   // Skin 的按钮样式已自带 .pressable()

// 在自定义样式中，显式启用：
b.style(new ComponentStyle().backColor(0xFF0173ED).pressable());
```
`Skin` 会从常态生成 `pressed` 状态（默认为更深的背景）。要自定义，请定义一个
`pressedStyle(...)`（参见 [组件样式设置](/docs/ui/theming/styling-components)）。

## 反馈时长
来自 `Styles.animationDuration`（默认 `0.3s`），并由 `Skin` 的样式读取。全局调整：
```java
Styles.animationDuration = 0.2f;   // 整个应用中更"干脆"的点击手感
```

## 手动控制不透明度 — `alpha(...)`
若要自行淡化/高亮某个组件（例如在视觉上禁用、突出选中），请使用 `alpha(float)`
（0 = 透明，1 = 不透明）：
```java
item.alpha(selecionado ? 1f : 0.5f);
Component.repaint();
```
若要不透明度的**平滑**过渡，请与 [`AlphaAnimation`](/docs/ui/animations/value-animations) 结合使用：
```java
AlphaAnimation fade = new AlphaAnimation(item.alpha(), 1f, 0.2f);
fade.onUpdate(() -> { item.alpha(fade.getValue()); Component.repaint(); }).start();
```

## 最佳实践
- 让 `pressable()` 负责触摸反馈 — 不要手动为按压做动画。
- 用 `alpha()` 表示状态（禁用/选中）；仅在过渡有增益时才做动画。
- **被禁用**的组件已通过样式的 `disabledAlpha` 淡化 — 不要重复处理。

## 常见错误
- 自定义样式缺少 `pressable()` → 按钮触摸时没有反馈。
- 设置 `alpha(...)` 却忘记 `Component.repaint()`（渲染是按需的）。

## 另请参阅
- [数值动画](/docs/ui/animations/value-animations) · [组件样式设置](/docs/ui/theming/styling-components)