wpfui:一个开源免费具有现代化设计趋势的WPF控件库

wpfui介绍

wpfui是一款开源免费(MIT协议)具有现代化设计趋势的WPF界面库。wpfui为wpf的界面开发提供了流畅的体验,提供了一个简单的方法,让使用WPF编写的应用程序跟上现代设计趋势。截止写这篇文章,该项目获得了6.7k starts。

image-20240613090119353

最近我也在使用wpfui,整体使用下来感觉非常不错,因此想写一篇文章介绍一下wpfui。

image-20240613090330237

wpfui项目概览

将该项目fork一份,克隆到本地,打开之后,项目的结构如下所示:

image-20240613091519362

带有Demo的,我们可以运行看一看,非常适合学习。

Wpf.Ui.Demo.Console

项目结构:

image-20240613091952546

运行效果:

image-20240613091913748

Wpf.Ui.Demo.Mvvm

可以根据这个Demo学习与理解Mvvm模式。

项目结构:

image-20240613092113970

运行效果如下:

image-20240613092437380

Wpf.Ui.Demo.Simple

如果觉得mvvm模式太麻烦了,或者不想使用mvvm,那么可以看这个demo。

项目结构:

image-20240613092659135

运行效果:

image-20240613092722052

Wpf.Ui.Gallery

Wpf.Ui.Gallery是wpfui中控件的集合示例,可以在上面查看不同控件的使用方式,以个人经验来看,配合这个使用wpfui体验感还是很不错的。

项目结构:

image-20240613093319767

运行效果:

image-20240613093337369

官方还在Microsoft Store中提供了WPF UI Gallery,可以使用它测试所有功能。

image-20240613094308263

下载地址:https://apps.microsoft.com/store/detail/wpf-ui/9N9LKV8R9VGM?cid=windows-lp-hero

下载安装之后,可以直接打开这个应用,学习控件的使用。

实践

前面的只是对这个项目一个简单的介绍,重点还是我们如何在自己的WPF项目中使用它。

添加字典

XAML和WPF都对资源字典进行操作。这些类似HTML的文件描述控件的外观和各个方面。

WPF UI添加了自己的这些文件集,以告知应用程序控件的外观。

在我们的应用程序中应该有一个名为 App.xaml 的文件。使用WPF UI ControlsDictionaryThemesDictionary 类向其添加新字典:

<Application...xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"><Application.Resources><ResourceDictionary><ResourceDictionary.MergedDictionaries><ui:ThemesDictionary Theme="Light" /><ui:ControlsDictionary /></ResourceDictionary.MergedDictionaries></ResourceDictionary></Application.Resources>
</Application>

你可以在这里选择一个颜色主题, LightDark

添加命名空间

在窗口中添加一个新的名称空间,以告知解释器您将使用来自某个地方的控件,例如WPF UI库。

<Window...xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml" />

添加控件

从WPF UI库添加新控件,您只需输入其类名,并使用 ui: 前缀作为前缀:

<Window x:Class="WpfApp1.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"xmlns:local="clr-namespace:WpfApp1"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid><ui:SymbolIcon Symbol="Fluent24"/></Grid>
</Window>

效果如下:

image-20240613095440244

比如我现在想要使用一个带图标的Button该怎么做呢?

可以打开WPF UI Gallery,搜索Button,找到想要使用的样式,点击Source code,如下所示:

image-20240613095750998

直接复制到xaml如下所示:

  <ui:Button Content="WPF UI button" Icon="Fluent24"/>

效果如下:

image-20240613100246310

发现并没有显示图标。

可能是我们的使用方式错了,这时候就可以点击上方的Xaml soure code 与 C# source code了,代码不会骗人。

image-20240613100841539

先来看一下C# source code:

image-20240613100646018

没找到我们想要的。

再来看看Xaml soure code:

image-20240613100940209

在这个地方找到了原因,复制过来,如下所示:

<ui:Button Content="WPF UI button"  Icon="{ui:SymbolIcon Fluent24}"/>

现在就有图标了,如下所示:

image-20240613101059957

如果想换图标,只需搜索Icons,找到一个图标,替换图标的名字即可,如下所示:

image-20240613104927600

 <ui:Button Content="WPF UI button"  Icon="{ui:SymbolIcon AirPlane20}"/>

现在效果如下:

image-20240613105043700

剩下的控件可以在使用过程中进行探索。

参考

1、lepoco/wpfui: WPF UI provides the Fluent experience in your known and loved WPF framework. Intuitive design, themes, navigation and new immersive controls. All natively and effortlessly. (github.com)

2、WPF UI Docs | WPF UI (lepo.co)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/857519.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

YYU-5/80-260mm型钢筋残余变形测试仪 电子引伸计

YYU-5/80-260mm型钢筋接头专用引伸计&#xff0c;是按照《JGJ 107 2010 钢筋技术连接技术规程》的技术要求设计的&#xff0c;专门用于测试钢筋接头残余变形的双向平均引伸计&#xff0c;其标距可以根据钢筋直径要求进行调整。 完全符合《JGJ 107 2010 钢筋技术连接技术规程》…

信创适配评测

概叙 信创科普参考&#xff1a;全面国产化之路-信创-CSDN博客 有必要再解释一下两个名词“28N”&#xff0c;“79号文件”&#xff0c;因为“28N”指定了由政府牵头从各领域开启国产化的基调&#xff0c;而“79号文件”则指定了国产化的截止日期2027年。 信创的本质是实现中国信…

EOS black灵魂回响黑色无法联机/联机报错/联机失败怎么办

灵魂回响黑色EOS black中的职业系统&#xff0c;自由度非常高。从人物属性的精细调整&#xff0c;到装备属性的独特搭配&#xff0c;再到技能的个性化组合&#xff0c;每一步都充满了无限可能。更为惊喜的是&#xff0c;游戏中的角色职业不是一成不变的&#xff0c;而是随着手中…

Springboot3.3 整合Cassandra 4.1.5

一、数据库搭建 -- 创建Keyspace CREATE KEYSPACE school WITH replication {class:SimpleStrategy, replication_factor : 1};-- 创建表 CREATE TABLE student(id int PRIMARY KEY, name text, age int, genders int, address text ,interest set<text>,phone lis…

【C++】关于代码编译自动更新版本的问题

在写代码的时候&#xff0c;总是需要添加一个版本号&#xff0c;用于后续的版本管理 我常遇到的一个问题是&#xff0c;开发过程中&#xff0c;不一定会记得这件事情&#xff0c;导致有时候会出现同样的版本 于是希望有一个方式&#xff0c;能在编译代码的时候自动生成一个版…

【Proteus仿真】【Arduino单片机】汽车倒车报警系统设计

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduinno单片机控制器&#xff0c;使用LCD1602液晶、按键、继电器电机模块、DS18B20温度传感器、蜂鸣器LED、HCSR04超声波等。 主要功能&#xff1a; 系统运行后&#xff0c;LCD16…

【网络安全学习】漏洞扫描:-04- ZAP漏洞扫描工具

**ZAP(Zed Attack Proxy)**是一款由OWASP组织开发的免费且开源的安全测试工具。 ZAP支持认证、AJAX爬取、自动化扫描、强制浏览和动态SSL证书等功能。 1️⃣ 安装zap工具 现在的kali版本不一定会预装zap&#xff0c;我们可以自行安装&#xff0c;安装也十分简单。 apt-get …

mybatis查询PostgreSQL报错:无法确定参数 $1 的数据类型

错误信息 ### Cause: org.postgresql.util.PSQLException: 错误: 无法确定参数 $1 的数据类型 ; bad SQL grammar []; nested exception is org.postgresql.util.PSQLException: 错误: 无法确定参数 $1 的数据类型] with root cause org.postgresql.util.PSQLException: 错误: …

转让中字头无区域农业公司变更快包迁全国

国家局名称的公司不仅可以提升企业形象&#xff0c;还能展现公司的实力。由于国家总局核名的审核标准相对严格&#xff0c;能够通过核名的企业一般都具备一定的实力和资质。因此&#xff0c;选择国家局核名的企业往往能够在市场中获得更多信任和认可。详情致电咨询我或者来公司…

C# 实现draw一个简单的温度计

运行结果 概述&#xff1a; 代码分析 该控件主要包含以下几个部分&#xff1a; 属性定义&#xff1a; MinValue&#xff1a;最低温度值。 MaxValue&#xff1a;最高温度值。 CurrentValue&#xff1a;当前温度值。 构造函数&#xff1a; 设置了一些控件样式来提升绘制效果…

【计算机网络体系结构】计算机网络体系结构实验-DHCP实验

服务器ip地址 2. 服务器地址池 3. 客户端ip 4. ping Ipconfig

【计算机网络仿真】b站湖科大教书匠思科Packet Tracer——实验7 虚拟局域网VLAN

一、实验目的 1.学习如何划分VLAN&#xff1b; 2.验证划分VLAN的作用&#xff1b; 3.学习如何用命令行创建VLAN&#xff0c;将端口划分到VLAN&#xff0c;设置端口类型。 二、实验要求 1.使用Cisco Packet Tracer仿真平台&#xff1b; 2.观看B站湖科大教书匠仿真实验视频&am…

3d中模型显示黑色给不了材质---模大狮模型网

如果3D模型显示黑色&#xff0c;而且无法给它添加材质&#xff0c;可能有以下几种原因&#xff1a; 一&#xff1a;模型没有UV贴图 UV贴图是3D模型表面纹理的一种方式&#xff0c;如果模型没有正确的UV贴图&#xff0c;渲染时可能会显示黑色。在大多数3D建模软件中&#xff0c…

qml:一个基础的界面设计

文章目录 1、文章说明2、效果图3、重要代码说明3.1 组件切换开关下拉框矩形卡片 3.2 窗口最大化后组件全部居中3.3 菜单栏3.4 Repeater实现重复8行3.5 图片加载直接加载图片文本转图片FluentUI中可供选择的图标 1、文章说明 qt6.5.3 qml写的一个界面配置设计软件&#xff0c;目…

算法设计与分析:动态规划法求扔鸡蛋问题 C++

目录 一、实验目的 二、问题描述 三、实验要求 四、算法思想和实验结果 1、动态规划法原理&#xff1a; 2、解决方法&#xff1a; 2.1 方法一&#xff1a;常规动态规划 2.1.1 算法思想&#xff1a; 2.1.2 时间复杂度分析 2.1.3 时间效率分析 2.2 方法二&#xff1a;动态规划加…

python数据分析-糖尿病数据集数据分析预测

一、研究背景和意义 糖尿病是美国最普遍的慢性病之一&#xff0c;每年影响数百万美国人&#xff0c;并对经济造成重大的经济负担。糖尿病是一种严重的慢性疾病&#xff0c;其中个体失去有效调节血液中葡萄糖水平的能力&#xff0c;并可能导致生活质量和预期寿命下降。。。。 …

若依框架集成微信支付

1. 添加微信支付相关依赖 <!-- 微信支付 --> <dependency><groupId>com.github.wxpay</groupId><artifactId>wxpay-sdk</artifactId><version>0.0.3</version> </dependency> <dependency><groupId>com.gi…

微信小程序开发---自定义底部tabBar

自定义tabBar注意事项&#xff1a; 在自定义 tabBar 模式下 &#xff0c;为了保证低版本兼容以及区分哪些页面是 tab 页&#xff0c;app.json文件中 tabBar 的相关配置项需完整声明&#xff0c;但这些字段不会作用于自定义 tabBar 的渲染。所有 tabBar 的样式都由该自定义组件…

Linux学习笔记:前言与操作系统的初识【1】

前言 为什么学习Linux 作为当下最流行的操作系统之一&#xff0c;学会如何使用和操作Linux操作系统也就是每位计算机学者的看家必备技能了。其次呢&#xff0c;本人受Linux的创始人林纳斯的影响太深了&#xff0c;觉得这个人太了不起了&#xff0c;而且人家大学里就自研开发出…

【Gradio】构建自定义多模态聊天机器人

这是我们构建自定义多模态聊天机器人组件两部分系列的第一部分。在第一部分中&#xff0c;我们将修改 Gradio 聊天机器人组件&#xff0c;使其能够在同一消息中显示文本和媒体文件&#xff08;视频、音频、图片&#xff09;。在第二部分中&#xff0c;我们将构建一个自定义的文…