WPF Aero 标题栏

• 下载源代码 – 253 KB

引言

本文介绍了一个 Aero 主题的标题栏组件。

自定义标题栏并非什么新事物。 已经有很多实现，但大多数尝试创建新的主题，而不是扩展现有的主题。

开发这个而不是使用现有实现的主要原因是，你无法在标题栏上放置任何 WPF 控件，所以如果你想在那里放置一个 TabControl（就像 Google Chrome 一样），你就会无能为力。

它支持以下功能

• 尽可能地模拟行为，例如
  • Aero 风格的发光按钮
  • 窗口未激活时透明
  • 双击标题栏将恢复/最大化窗口
  • 8 向调整大小手柄，当全屏时消失
• 自定义标题内容

如何使用？

该控件有两个属性

• Title – 用于保存标题内容
• Content – 用于保存客户端区域

<uc:TitlebarContainer Background="Transparent" Margin="0" >
    <uc:TitlebarContainer.Title>
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="[=_=]"  />
            <TextBlock Text="TITLE" Margin="5,0" />
        </StackPanel>
    </uc:TitlebarContainer.Title>
    <TextBlock Text="A Quick Fox Jump Over The Lazy Dog" />
</uc:TitlebarContainer>

内部设计

该组件非常简单，它包含 TitlebarContainer、Titlebar 和 TitlebarControlButton(s)。

TitlebarContainer 表示 Titlebar 的一个实现，它包含 Titlebar 控件，以及调整大小手柄。调整大小手柄的实现基于 Kirupa 的代码，该代码使用了一些 WINAPI。

Titlebar 表示 titlebar 的顶部部分，它包含实际的标题内容（通过 Content 属性），以及四个 TitlebarControlButtons（Minimize、Maximize、Restore 和 Close）。 如果您有自定义实现，您可能希望使用此控件而不是 TitlebarContainer。

TitlebarControlButton 表示按钮，这些按钮在鼠标悬停时发光，按钮实际上是向外发光。 我使用了 DropShadowEffect 代替 OuterGlowBitmapEffect，因为它在 .NET 4.0 中已被弃用。

按钮的路径是使用 Expression Blend 绘制的，而不是从位图绘制的。 使用 Blend 减少了我的工作量。 我是 Expression Blend 的新手，我做了以下事情

• 捕获按钮的图片，将其粘贴到画布上
• 将其分组到一个网格中（Group Into \ Grid）
• 使用粘贴的图形作为基础，用矩形或笔绘制
• 为了避免使用边距属性，在按钮图形的边缘绘制一个矩形
• 将它们组合并转换为路径（Path \ Make CompoundPath）
• 复制路径值并删除不需要的矩形

参考文献

• 调整大小的自定义/透明窗口（再次！）(kirupa)
• WPF 示例系列 – 解决过时的 BitmapEffect 属性并渲染 OuterGlowBitmapEffect (Karl On WPF)

本文已发布在 CodeProject 上。 你可以在 这里 找到我的文章列表。