fluent_ui

<div align="center"> <h1>fluent_ui</h1> <div> <a title="pub.dev" href="https://pub.dartlang.org/packages/fluent_ui" > <img src="https://yellow-cdn.veclightyear.com/0a4dffa0/5f2c3375-4cbb-4606-bb40-65fc7e7f9a9a.svg?style=flat-square&include_prereleases&color=dc143c" /> </a> <a title="GitHub 许可证" href="https://github.com/bdlukaa/fluent_ui/blob/master/LICENSE"> <img src="https://img.shields.io/github/license/bdlukaa/fluent_ui?style=flat-square&color=f12253" /> </a> <a title="使用 Fluent 设计" href="https://github.com/bdlukaa/fluent_ui"> <img src="https://img.shields.io/badge/fluent-design-blue?style=flat-square&color=gray&labelColor=0078D7"> </a> <a title="Web 示例" href="https://bdlukaa.github.io/fluent_ui"> <img src="https://img.shields.io/badge/documentation---?style=flat-square&color=e88d0c" /> </a> </div> <div> <a title="Discord" href="https://discord.gg/674gpDQUVq"> <img src="https://img.shields.io/discord/809528329337962516?style=flat-square&label=discord&color=7289da&logo=discord&logoColor=white" /> </a> <a title="Patreon" href="https://www.patreon.com/bdlukaa"> <img src="https://img.shields.io/badge/sponsor-Patreon-FF424D?style=flat-square" /> </a> </div> <br/> <p> 使用<a href="https://flutter.dev">Flutter</a>设计漂亮的原生 Windows 应用 </p> <p> 非官方的<a href="https://flutter.dev">Flutter</a> Fluent UI 实现。基于<a href="https://docs.microsoft.com/en-us/windows/uwp/design">官方文档</a>编写。 </p> <h3> 阅读<a href="https://bdlukaa.github.io/fluent_ui/">文档</a> </h3> </div> <div align="center"> <a href="https://bdlukaa.github.io/fluent_ui"> <img src="https://yellow-cdn.veclightyear.com/0a4dffa0/9fd2256c-fbbe-4fbe-981b-c5784c48d838.png" /> </a> </div>

---

内容

• 动机和维护
• 安装
  • 徽章
  • 强调色
• 本地化
• 贡献
  • 贡献新的本地化
  • 致谢

动机和维护

由于 Flutter 已经稳定支持 Windows，因此有必要支持其 UI 指南来构建高保真度的应用，就像它支持 Material 和 Cupertino 一样。 有关官方 Fluent UI 支持的更多信息，请参阅此处

另请参阅：

• Flutter 的 Material UI
• Flutter 的 Cupertino UI
• Flutter 的 MacOS UI

---

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

<div align="center"> <a title="Patreon" href="https://www.patreon.com/bdlukaa"> <img src="https://img.shields.io/badge/sponsor-Patreon-FF424D?style=flat-square" /> </a> </div>

安装

将包添加到您的依赖项中：

dependencies:
  fluent_ui: ^4.4.0

<p align="center">或者</p>

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

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

使用此库的项目应该使用 Flutter 的稳定版本

徽章

您是否在您的应用中使用了这个库？您可以使用徽章来告诉其他人：

<a title="使用 Fluent 设计" href="https://github.com/bdlukaa/fluent_ui"> <img src="https://img.shields.io/badge/fluent-design-blue?style=flat-square&color=gray&labelColor=0078D7" > </a>

将以下代码添加到您的 README.md 或网站中：

<a title="使用 Fluent 设计" href="https://github.com/bdlukaa/fluent_ui">
  <img
    src="https://img.shields.io/badge/fluent-design-blue?style=flat-square&color=gray&labelColor=0078D7"
  />
</a>

---

强调色

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

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

FluentThemeData(
  accentColor: Colors.blue,
)

要使用系统的强调色，您可以使用我制作的插件 system_theme。截至2023年1月21日，它支持 Android、Web、MacOS、Windows、Xbox 和 Linux (GTK 3+)。

import 'package:system_theme/system_theme.dart';

FluentThemeData(
  accentColor: SystemTheme.accentColor.accent.toAccentColor(),
)

本地化

FluentUI 小部件目前支持多种语言，包括：

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

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

贡献

如果您发现问题，欢迎提交issue或提交pull request。

欢迎所有形式的贡献 :)

贡献新的本地化

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

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

• Fork仓库
• 将lib/l10n/intl_en.arb文件复制到lib/l10n文件夹中，并使用新的语言代码命名，遵循ISO 859-1代码列表
• 更新新创建的文件中的内容。特别是，请使用相应的ISO代码更新@locale值。
• 运行您的项目，代码生成将自动进行，或运行命令flutter gen-l10n
• 完成后，提交新的pull request

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

致谢

不分先后地感谢以下所有为项目做出贡献的人。这对我来说意义重大 :)

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