什么时候使用哪个按钮以及在 flutter 中使用哪个按钮更好

Question

flutter 中有一些按钮，我很清楚何时使用 TextButton，但其他按钮我不明白如何使用它。哪个更好用于更好的练习。

Answer 1

TextButton（较旧的 - FlatButton）- 主要用于显示具有按钮点击效果的文本。

ElevatedButton（较旧的按钮 - 凸起按钮）- 显示具有点击效果的真实按钮。

OutlinedButton（旧版 - OutlineButton）- 顾名思义，它显示带有文本和点击效果的按钮轮廓。

Answer 2

RaishedButton 已弃用，因此请不要使用它。其更新的替代方案是 ElevatedButton。我们还使用 TextButton。如果您想显示任何图标类型按钮，请使用 IconButton 并自定义按钮形状。

我经常使用像 InkWell 这样的容器和小部件。

Answer 3

如材料设计 3 个按钮指南中所述，按钮类型决定了按钮与其他按钮和 UI 元素相比应显示的突出程度。

• 填充按钮 (

  FilledButton

  ) 在 FAB 之后最具视觉冲击力，应用于完成流程的重要的最终操作，例如保存、立即加入或确认。
• 轮廓按钮 (

  OutlinedButton

  ) 是中强调按钮。它们包含重要的操作，但不是应用程序中的主要操作。 轮廓按钮与填充按钮完美搭配，以指示替代的辅助操作。
• 填充色调按钮 (

  FilledButton.tonal

  ) 是填充按钮和轮廓按钮之间的替代中间地带。它们在低优先级按钮需要比大纲给出的重点稍多的情况下很有用，例如入职流程中的“下一步”。
• 文本按钮 (

  TextButton

  ) 用于最低优先级操作，尤其是在呈现多个选项时。
• 升高的按钮（

  ElevatedButton

  ）本质上是带有阴影的填充色调按钮。为了防止阴影蠕动，仅在绝对必要时使用它们，例如当按钮需要与图案背景进行视觉分离时。