前言
本文主要分享 9
款开源、免费、实用、美观的 Blazor UI
框架,提供给广大 C#/.NET
开发者们学习和使用(注意:排名不分先后,都是十分优秀的开源框架和项目💖)。这些框架都已收录到 C#/.NET/.NET Core
优秀项目和框架精选中,关注优秀项目和框架精选能让你及时了解 C#、.NET
和 .NET Core
领域的最新动态和最佳实践,提高开发效率和质量。坑已挖,欢迎大家踊跃提交 PR
,自荐(让优秀的项目和框架不被埋没🤞)。
GitHub 项目仓库收集地址
- https://github.com/YSGStudyHards/DotNetGuide/blob/main/docs/DotNet/DotNetProjectPicks.md
Ant Design Blazor
- 使用文档:https://antblazor.com/zh-CN/docs/introduce
- GitHub 项目地址:https://github.com/ant-design-blazor/ant-design-blazor
项目介绍
Ant Design Blazor
是一套基于 Ant Design
和 Blazor
的企业级组件库(喜欢 Ant Design
风格的同学推荐使用)。
项目特点
- 🌈 提炼自企业级中后台产品的交互语言和视觉风格。
- 📦 开箱即用的高质量 Blazor 组件,可在多种托管方式共享。
- 💕 支持基于 WebAssembly 的前端和基于 SignalR 的服务端 UI 即时交互。
- 🎨 支持渐进式 Web 应用(PWA)
- 🛡 使用 C# 构建,多范式静态语言带来高效的开发体验。
- ⚙️ 支持 .NET Core 3.1 以上所有版本,可直接引用丰富的 .NET 类库。
- 🌍 数十个国际化语言支持。
- 💴 基于 MIT 开源协议,.NET 基金会项目,商业应用免费。
项目截图
BootstrapBlazor
- 使用文档:https://www.blazor.zone/introduction
- Gitee 项目地址:https://gitee.com/LongbowEnterprise/BootstrapBlazor
项目介绍
BootstrapBlazor
是一套基于 Bootstrap
和 Blazor
的企业级组件库,可以认为是 Bootstrap
项目的 Blazor
版实现。基于 Bootstrap
样式库精心打造,并且额外增加了 100
多种常用的组件,为您快速开发项目带来非一般的感觉(喜欢 Bootstrap
风格的同学推荐使用)。
项目截图
MudBlazor
- 使用文档:https://mudblazor.com/docs/overview
- GitHub 项目地址:https://github.com/MudBlazor/MudBlazor
项目介绍
MudBlazor
是一个基于 Material Design
的 Blazor
组件框架,注重易用性和清晰的结构。它非常适合想要快速构建Web应用程序的 .NET
开发人员,无需费力地处理 CSS
和 JavaScript
。由于 MudBlazor
完全使用 C#
编写,因此您可以自由地调整、修复或扩展该框架。文档中有大量示例代码,使理解和学习 MudBlazor
非常容易。
项目特点
基于 Material Design
的清晰美观的图形设计。
- 易于理解的结构。
- 良好的文档和许多示例和源代码片段。
- 所有组件全部使用
C#
编写,不允许使用JavaScript
(除非绝对必要)。 - 用户可以创建漂亮的应用程序,而无需使用
CSS
(当然也可以使用CSS
)。 - 不依赖其他组件库,完全控制组件和功能。
- 稳定性!我们努力实现完整的测试覆盖率。
- 频繁发布版本,以便开发人员及时获得其
Pull Request
和修复。
项目截图
MatBlazor
- 使用文档:https://www.matblazor.com/
GitHub
项目地址:https://github.com/SamProf/MatBlazor
项目介绍
MatBlazor
是一套基于 Material Design
规范实现的 Blazor
和 Razor
通用组件库。
项目截图
Blazorise
- 使用文档:https://blazorise.com/docs
GitHub
项目地址:https://github.com/Megabit/Blazorise
项目介绍
Blazorise
是用于 Blazor
的 UI
组件库,支持使用 Bootstrap、Tailwind、Bulma、Ant Design
和 Material
等 CSS
框架,可用于构建响应式的单页 Web
应用程序。
项目截图
Microsoft Fluent UI Blazor
- 使用文档:https://www.fluentui-blazor.net/
GitHub
项目地址:https://github.com/microsoft/fluentui-blazor
项目介绍
Microsoft Fluent UI Blazor
是一个基于 Blazor
的组件库,提供了一系列的UI组件以及 Fluent UI
的设计系统。该库可以帮助开发人员快速构建现代化的 Web
应用程序,并且与 Blazor
技术相结合,可以实现高效而灵活的单页应用程序开发。
项目截图
Radzen Blazor
- 使用文档:https://blazor.radzen.com/
GitHub
项目地址:https://github.com/radzenhq/radzen-blazor
项目介绍
Radzen Blazor
是一个包含 70
多个免费的原生 Blazor UI
组件的集合,其中包括 DataGrid、Scheduler、Charts
等功能强大的组件,并提供了丰富的主题样式,包括 Material Design
和 FluentUI
。可以将 Radzen Blazor
视为一个用于构建 Blazor
应用程序的 UI
框架,它提供了一系列预构建的组件和工具,帮助开发人员快速搭建和定制自己的应用程序界面。
项目截图
Radzen Blazor Studio
,https://www.radzen.com/blazor-studio/download/#windows
MASA.Blazor
- 使用文档:https://docs.masastack.com/blazor/getting-started/installation
GitHub
项目地址:https://github.com/masastack/MASA.Blazor
项目介绍
基于 Material
设计规范和 BlazorComponent
的交互能力提供标准的基础组件库。提供如布局、弹框标准、Loading
、全局异常处理等标准场景的预置组件。从更多实际场景出发,满足更多用户和场景的需求,最大的减少开发者的时间成本。缩短开发周期提高开发效率。
项目特点
- 丰富组件:包含
Vuetify 1:1
还原的基础组件,以及很多实用的预置组件和.Net
深度集成功能,包括Url
、面包屑、导航三联动,高级搜索,i18n
等。 - UI设计语言:设计风格现代,
UI
多端体验设计优秀。 - 专业示例:
MASA Blazor Pro
提供多种常见场景的预设布局。 - 简易上手:丰富详细的上手文档,免费的视频教程(制作中)。
- 社区活跃鼓励:用户参与实时互动,做出贡献加入我们,构建最开放的开源社区。
- 长期支持:全职团队维护,长期提供支持,并提供企业级支持。
- 知名企业选择:该技术框架被多家知名企业选择使用,未来
MASA Stack
产品线也将一直使用,持续增加新功能。
项目截图
BlazorStrap
- 使用文档:https://getbootstrap.com/docs/5.1/getting-started/introduction/
GitHub
项目地址:https://github.com/chanan/BlazorStrap
项目介绍
BlazorStrap
是一个基于 Bootstrap
的 Blazor
的 UI
组件库,BlazorStrap
的组件也支持响应式布局、主题定制以及多语言支持等功能,可以帮助开发者快速搭建出美观、易用的 Web
应用程序。
项目截图
转载声明
- 原文地址:https://mp.weixin.qq.com/s/Fgr_5QpjDKiJO7nw2SCXIw