跳至主要内容

将 MaterialState 重命名为 WidgetState

摘要

#

MaterialState 及其相关 API 已从 Material 库中移出并重命名为 WidgetState

背景

#

以前,MaterialState 提供了用于处理部件可能具有的多种不同状态的逻辑,例如“悬停”、“聚焦”和“禁用”。由于此功能在 Material 库之外也很有用,即对于基本部件层和 Cupertino,因此决定将其移出 Material。作为移动的一部分,为了避免未来的混淆,不同的 MaterialState 类已重命名为 WidgetState。两者的行为相同。

之前现在
MaterialStateWidgetState
MaterialStatePropertyResolverWidgetStatePropertyResolver
MaterialStateColorWidgetStateColor
MaterialStateMouseCursorWidgetStateColorMouseCursor
MaterialStateBorderSideWidgetStateBorderSide
MaterialStateOutlinedBorderWidgetStateOutlinedBorder
MaterialStateTextStyleWidgetStateTextStyle
MaterialStatePropertyWidgetStateProperty
MaterialStatePropertyAllWidgetStatePropertyAll
MaterialStatesControllerWidgetStatesController

MaterialStateOutlineInputBorderMaterialStateUnderlineInputBorder保留在Material库中,没有对应的WidgetState,因为它们是特定于Material设计的。

迁移指南

#

提供了一个Flutter修复来帮助将MaterialState类迁移到WidgetState

要迁移,请将MaterialState替换为WidgetState

迁移前代码

dart
MaterialState selected = MaterialState.selected;

final MaterialStateProperty<Color> backgroundColor;

class _MouseCursor extends MaterialStateMouseCursor{
  const _MouseCursor(this.resolveCallback);

  final MaterialPropertyResolver<MouseCursor?> resolveCallback;

  @override
  MouseCursor resolve(Set<MaterialState> states) => resolveCallback(states) ?? MouseCursor.uncontrolled;
}

BorderSide side = MaterialStateBorderSide.resolveWith((Set<MaterialState> states) {
  if (states.contains(MaterialState.selected)) {
    return const BorderSide(color: Colors.red);
  }
  return null;
});

迁移后代码

dart
WidgetState selected = WidgetState.selected;

final WidgetStateProperty<Color> backgroundColor;

class _MouseCursor extends WidgetStateMouseCursor{
  const _MouseCursor(this.resolveCallback);

  final WidgetPropertyResolver<MouseCursor?> resolveCallback;

  @override
  MouseCursor resolve(Set<WidgetState> states) => resolveCallback(states) ?? MouseCursor.uncontrolled;
}

BorderSide side = WidgetStateBorderSide.resolveWith((Set<WidgetState> states) {
  if (states.contains(WidgetState.selected)) {
    return const BorderSide(color: Colors.red);
  }
  return null;
});

时间线

#

包含在版本中:3.21.0-11.0.pre
稳定版发布:3.22.0

参考文献

#

相关问题

相关PR