我正在参加「掘金·启航计划」
1.前言
对于window窗体一些简单的自定义样式，比如修改最小化，最大化，还原，关闭按钮颜色或者在标题栏上拓展增加一个登录按钮，软件相关状态信息等等，HandyControl包里的window窗体控件可以很好的完成这些需求，而不需要我们自己重写。本篇文章主要介绍HandyControl中的Window窗体控件相对于原生控件扩展了哪些功能。
关于HandyControl安装和使用，可以查看 WPF-HandyControl安装和使用
关于Window窗体的UI元素和行为，可以查看 Window窗体的UI元素及其行为
2.使用
HandyControl中window窗体控件相对于原生window窗体，扩展了如下的属性：
| 属性 | 描述 | 默认值 |
|---|---|---|
| CloseButtonBackground | 关闭按钮背景色 | |
| CloseButtonForeground | 关闭按钮前景色 | |
| CloseButtonHoverBackground | 关闭按钮鼠标悬浮背景色 | |
| CloseButtonHoverForeground | 关闭按钮鼠标悬浮前景色 | |
| OtherButtonBackground | 其它按钮背景色 | |
| OtherButtonForeground | 其它按钮前景色 | |
| OtherButtonHoverBackground | 其它按钮鼠标悬浮背景色 | |
| OtherButtonHoverForeground | 其它按钮鼠标悬浮前景色 |
这个八个属性很好理解，就是直接修改对应的按钮背景和前景色，示例如下：
修改前
<hc:Window x:Class="TestDemo.View.WindowTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:hc="https://handyorg.github.io/handycontrol"
Title="WindowTest" Height="200" Width="300">
</hc:Window>
修改后
<hc:Window x:Class="TestDemo.View.WindowTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:hc="https://handyorg.github.io/handycontrol"
Title="WindowTest" Height="200" Width="300"
CloseButtonBackground="Blue" CloseButtonForeground="White"
CloseButtonHoverBackground="Red" CloseButtonHoverForeground="Black"
OtherButtonBackground="Green" OtherButtonForeground="White"
OtherButtonHoverBackground="Yellow" OtherButtonHoverForeground="Black">
</hc:Window>
| 属性 | 描述 | 默认值 |
|---|---|---|
| NonClientAreaBackground | 非客户端区域背景色 | |
| NonClientAreaForeground | 非客户端区域前景色 | |
| NonClientAreaContent | 非客户端区域内容 | |
| NonClientAreaHeight | 非客户端区域高度 | |
| ShowNonClientArea | 是否显示非客户端区域 | true |
| ShowTitle | 是否显示窗口标题 | true |
| IsFullScreen | 窗口是否处于全屏 | false |
NonClientAreaBackground用来设置了标题栏的背景色。NonClientAreaForeground用来设置标题栏的前景色，不仅仅可以用来设置标题的前景色，也可以设置NonClientAreaContent中控件的默认前景色。NonClientAreaHeight用来设置标题栏的高度。下面看一段代码：
<hc:Window x:Class="TestDemo.View.WindowTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:hc="https://handyorg.github.io/handycontrol"
Title="WindowTest" Height="200" Width="400"
NonClientAreaBackground ="LightBlue" NonClientAreaForeground="Red"
NonClientAreaHeight="100">
<hc:Window.NonClientAreaContent >
<Border BorderThickness="1" BorderBrush="Black">
<StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
<Button Margin="5,0,0,0" Content="登录"/>
<TextBlock Text="服务未连接" VerticalAlignment="Center" Margin="5,0,0,0" />
</StackPanel>
</Border>
</hc:Window.NonClientAreaContent>
</hc:Window>
由NonClientAreaContent里Border可以看到NonClientAreaContent的范围左右紧贴着窗体标题和按钮。NonClientAreaContent里控件默认前景色就是NonClientAreaForeground设置的颜色。奇怪的一点是NonClientAreaHeight没有生效，标题栏的高度还是默认高度。
<hc:Window x:Class="TestDemo.View.WindowTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:hc="https://handyorg.github.io/handycontrol"
Title="WindowTest" Height="200" Width="400"
NonClientAreaBackground ="LightBlue" NonClientAreaForeground="Red"
NonClientAreaHeight="50">
<hc:Window.NonClientAreaContent >
<Border BorderThickness="1" BorderBrush="Black" Height="100" >
<StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
<Button Margin="5,0,0,0" Content="登录" />
<TextBlock Text="服务未连接" VerticalAlignment="Center" Margin="5,0,0,0" Foreground="White"/>
</StackPanel>
</Border>
</hc:Window.NonClientAreaContent>
</hc:Window>
给NonClientAreaContent里的控件设置高度以后，标题栏的高度会自动调整，也可以修改控件前景色。
剩下三个状态属性如表格描述，分别控制标题显示，标题栏显示和全屏模式。全屏模式下会隐藏non-client area，client area区域会填充满屏幕。
3. 结语
保留window窗体功能基础上，HandyControl包里的window窗体控件可以很好的胜任修改标题栏颜色，在标题栏上添加控件的功能，简单好用。对于更加个性化的设计，我们可以修改WindowCharme来实现，接下来的文章我会介绍相关的内容。
作者：靖安1016
出处：HandyControl-Window窗体控件
版权：本文采用 CC BY 4.0 知识共享许可协议进行许可。
