首页
/ FlexColorScheme 8.2.0 发布:支持 Flutter 3.29 及 Shadcn UI 色彩方案

FlexColorScheme 8.2.0 发布:支持 Flutter 3.29 及 Shadcn UI 色彩方案

2025-07-05 12:51:55作者:蔡怀权

FlexColorScheme 是一个强大的 Flutter 主题定制库,它简化了 Material Design 主题的创建过程,提供了丰富的预设色彩方案和高度可定制的主题配置选项。通过 FlexColorScheme,开发者可以轻松实现美观且一致的应用主题,同时支持浅色和深色模式。

版本 8.2.0 主要更新

对 Flutter 3.29.0 的全面支持

本次更新移除了所有在 Flutter 3.29.0 中已弃用的属性引用,包括:

  • MaterialStateUnderlineInputBorderMaterialStateOutlineInputBorder 替换为新的 WidgetStateInputBorder
  • 完全移除了对 Themedata.dialogBackgroundColor 的使用
  • 移除了即将在 Flutter 3.31.0 中弃用的 ThemeData.indicatorColor 属性,转而使用 TabBarThemeData.indicatorColor

这些变更确保了 FlexColorScheme 与最新 Flutter 版本的兼容性,同时遵循了 Flutter 团队推荐的实践方式。

TabBar 主题修复

针对 Flutter 3.27 和 3.31 版本中 TabBar 主题 API 的重大变更,FlexColorScheme 8.2.0 提供了完整的兼容性修复。这些变更包括:

  • 在 Flutter 3.27 中引入的组件主题规范化变更
  • 在 Flutter 3.31 beta 中新增的编译时破坏性变更

开发者现在可以放心地在所有 Flutter 渠道(稳定版、beta 版和 master 版)中使用 TabBar 主题功能,而无需担心兼容性问题。

新增 Shadcn UI 色彩方案(Beta 功能)

FlexColorScheme 8.2.0 引入了备受期待的 Shadcn UI 色彩方案支持。Shadcn 是一个流行的设计系统,以其简洁现代的风格著称。本次更新包含了:

  • 12 种 Shadcn 色彩方案,可通过以下枚举轻松使用:
    • FlexScheme.shadBlue
    • FlexScheme.shadGray
    • FlexScheme.shadGreen
    • FlexScheme.shadNeutral
    • FlexScheme.shadOrange
    • FlexScheme.shadRed
    • FlexScheme.shadRose
    • FlexScheme.shadSlate
    • FlexScheme.shadStone
    • FlexScheme.shadViolet
    • FlexScheme.shadYellow
    • FlexScheme.shadZinc

需要注意的是,当前版本中 Shadcn 色彩方案仍处于 Beta 阶段,表面颜色(background、surface 和 container)暂时使用 FlexColorScheme 的单色表面颜色。未来版本可能会增加对原生 Shadcn 表面颜色的支持,并提供切换选项。

Themes Playground 更新

代码生成改进

主题代码生成功能得到了显著增强:

  • 修复了第一个方案的代码生成问题
  • 改进了第二和第三个方案的代码生成,现在能准确反映它们在应用内部的定义方式
  • 优化了生成代码的结构,增加了注释以提高可读性
  • 移除了直接粘贴到 MaterialApp 属性的旧代码生成选项,专注于更灵活的文件配置方式

导航组件优化

针对 NavigationRail 组件:

  • 默认配置现在使用 NavigationRailLabelType.none,以解决 Flutter SDK 中关于折叠样式的限制
  • 添加了相关信息说明,帮助开发者理解这一设计决策
  • 提供了组件级别的解决方案,允许在不同状态下使用不同的标签类型

新增平台自适应组件展示

Themes Playground 现在展示了更多 Material-Cupertino 平台自适应组件,包括:

  • AlertDialog.adaptive
  • Slider.adaptive
  • Checkbox.adaptive
  • Radio.adaptive

这些示例帮助开发者更好地理解如何创建跨平台一致的用户界面。

Shadcn UI 预设配置(Beta)

新增了一个 Shadcn UI 风格的预设配置:

  • 这是一个初步的 Beta 版本配置
  • 将 Material 主题调整为类似 Shadcn UI 设计系统的风格
  • 主要设计用于 Shadcn 主题色彩,但也可与其他内置方案配合使用
  • 未来版本会持续改进这一配置,使其更接近 Shadcn 设计理念

开发者应注意,这一配置在未来的 Playground 版本中可能会发生变化,建议通过导出 JSON 设置来保存喜欢的配置。

总结

FlexColorScheme 8.2.0 带来了对最新 Flutter 版本的全面支持,修复了重要的主题兼容性问题,并引入了备受期待的 Shadcn UI 色彩方案。这些更新使开发者能够更轻松地创建美观、一致且符合现代设计趋势的应用程序界面。

对于想要尝试新功能的开发者,建议从 Shadcn 色彩方案开始探索,同时注意其 Beta 状态可能会带来未来的变化。通过 Themes Playground 的增强功能,开发者现在可以更直观地测试和导出各种主题配置,加速开发流程。

登录后查看全文
热门项目推荐