fluent_ui

机器翻译正文由机器翻译自项目原始文档（英文），排版经程序统一处理，可能存在偏差，请以原项目仓库为准。

动机与维护

由于 Flutter 已经对 Windows 提供了稳定支持，因此有必要支持其 UI 指南，以便高保真地构建应用程序，就像它支持 Material 和 Cupertino 一样。有关官方 Fluent UI 支持的更多信息，请参见 this

另请参见：

• Flutter 的 Material UI
• Flutter 的 Cupertino UI
• Flutter 的 MacOS 用户界面

这是一个开源软件包，这意味着任何人都可以为它做出贡献。然而，我，bdlukaa，是唯一一个积极维护它的人，因此审查和合并拉取请求可能需要一些时间。如果你想支持这个项目，你可以赞助我。

安装

将该包添加到你的依赖项中：

dependencies:
  fluent_ui: ^4.17.0

或

dependencies:
  fluent_ui:
    git: https://github.com/bdlukaa/fluent_ui.git

最后，运行 dart pub get 来下载该包。

使用此库的项目应使用 Flutter 的稳定通道

开发工具图标浏览器

fluent_ui 包含一个 Fluent UI DevTools 扩展，用于浏览 FluentIcons 和 WindowsIcons 目录。从依赖于 fluent_ui 的项目中打开 DevTools，选择 Fluent UI 选项卡，并在 DevTools 提示时启用该扩展。搜索支持部分名称，并会忽略空格、连字符和下划线。选择一个图标以进行检查，然后点击它以复制其 Dart 标识符或从预览中复制使用代码片段。

强调色

常用控件使用强调色来传达状态信息。了解更多。

默认情况下，强调色是 Colors.blue 。但是，您也可以自定义应用的强调色以反映您的品牌：

FluentThemeData(
  accentColor: Colors.blue,
)

要使用系统的强调色，您可以使用插件 system_theme。它支持 Android、iOS、Web、MacOS、Windows 和 Linux (GTK 3) 平台。

import 'package:system_theme/system_theme.dart';

FluentThemeData(
  accentColor: AccentColor.swatch({
    'darkest': SystemTheme.accentColor.darkest,
    'darker': SystemTheme.accentColor.darker,
    'dark': SystemTheme.accentColor.dark,
    'normal': SystemTheme.accentColor.accent,
    'light': SystemTheme.accentColor.light,
    'lighter': SystemTheme.accentColor.lighter,
    'lightest': SystemTheme.accentColor.lightest,
  }),
)

本地化

FluentUI 小组件目前开箱即用支持多种语言，包括：

• 阿拉伯语 (@dmakwt)
• 印度尼西亚语 (@ekasetiawans)
• 白俄罗斯语 (@superkeka)
• 捷克语 (@morning4coffe-dev)
• 克罗地亚语 (@ZeroMolecule)
• 荷兰语 (@h3x4d3c1m4l)
• 英语
• 法语 (@WinXaito)
• 德语 (@larsb24)
• 希腊语 (@pana-g)
• 希伯来语 (@yehudakremer)
• 印地语 (@alexmercerind)
• 匈牙利语 (@RedyAu)
• 意大利语 (@patricknicolosi)
• 日语 (@chari8)
• 韩语 (@dubh3)
• 马来语 (@jonsaw)
• 尼泊尔语 (@larence-cres)
• 波斯语 (@xmine64)
• Polish (@madik7)
• 葡萄牙语 (@bdlukaa)
• 罗马尼亚语 (@antoniocranga)
• 俄语 (@raitonoberu)
• 简体中文 (@zacksleo, @rk0cc)
• 他加禄语 (@Yivan000)
• 泰米尔语 (@sarankumar-ns)
• 繁体中文 (@zacksleo, @rk0cc)
• 泰语 (@lines-of-codes)
• 土耳其语 (@timurturbil)
• 西班牙语 (@henry2man)
• 乌克兰语 (@vadimbarda)
• 乌尔都语 (@sherazahmad720)
• 乌兹别克语 (@bobobekturdiyev)

如果不支持某种语言，您的应用可能会崩溃。您可以添加对新语言的支持或使用受支持的语言。了解更多

贡献

如果你发现问题，请随时提交问题或发起拉取请求。

所有贡献都非常欢迎 :)

贡献新的本地化内容

在PR#216中，我们在FluentUI小部件中添加了对新本地化的支持。

如果你想贡献新的本地化，请按以下步骤操作：

• 分叉此仓库
• 将 lib/l10n/intl_en.arb 文件复制到 lib/l10n 文件夹中，并使用新的语言代码，参考ISO 859-1 代码列表
• 更新新创建的文件内容。特别是，请将 @locale 的值更新为对应的ISO代码。
• 运行你的项目，将会生成代码，或者运行命令 flutter gen-l10n
• 完成后，发起新的拉取请求

更多关于Flutter 官方文档中的本地化的信息

致谢

不分先后，感谢以下所有对项目有贡献的人。这对我意义重大 :)

• @HrX03，感谢其提供的 Acrylic、FluentIcons 生成器和 _FluentTextSelectionControls 实现。
• @raitonubero 的 ProgressBar 和 ProgressRing 实现
• @alexmercerind，感谢 flutter_acrylic 插件，用于示例应用程序
• @leanflutter，感谢 window_manager 插件，用于示例应用程序
• @henry2man 对于 本地化支持
• @klondikedragon 由于 CommandBar 实现