Flutter 3.22.0稳定版的MaterialState迁移WidgetState

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

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

1.1 之间的对应关系

3.22以前 3.22稳定以后 ---
MaterialState WidgetState ---
MaterialStatePropertyResolver WidgetStatePropertyResolver ---
MaterialStateColor WidgetStateColor ---
MaterialStateBorderSide WidgetStateBorderSide --
MaterialStateOutlinedBorder WidgetStateOutlinedBorder --
MaterialStateMouseCursor WidgetStateColorMouseCursor --
MaterialStateTextStyle WidgetStateTextStyle --
MaterialStateProperty WidgetStateProperty --
MaterialStatePropertyAll WidgetStatePropertyAll --
MaterialStatesController WidgetStatesController --
MaterialStateOutlineInputBorder xxxx 仍然保留在Material 库
MaterialStateUnderlineInputBorder xxxx 仍然保留在Material 库

要迁移,请替换MaterialStateWidgetState

1.2以前的MaterialState代码:


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;
});

1.3 迁移后的WidgetState代码:


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;
});

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容