【WPF】WindowChrome 自定义窗口完美实现

news2024/11/15 11:07:32

WindowChrome 自定义窗口完美实现

  • 简介
  • 效果图
  • 自定义最小化、最大化、关闭按钮
  • 布局实现
  • 结语

简介

Microsoft官网关于 WindowChome 的介绍

截取Microsoft文章的一段话:
  若要在保留其标准功能时自定义窗口,可以使用该 WindowChrome 类。 该 WindowChrome 类将窗口框架的功能与视觉对象分开,并允许你控制应用程序窗口的客户端和非客户端区域之间的边界。 通过 WindowChrome 该类,可以通过扩展工作区来覆盖非工作区,将 WPF 内容置于窗口框架中。 同时,它通过两个不可见区域保留系统行为: 调整边框 和 标题 区域的大小

效果图

标准窗口
最大化窗口

自定义最小化、最大化、关闭按钮

  • 最小化按钮
<Style
    x:Key="SystemCloseButtonStyle"
    BasedOn="{StaticResource SystemButtonStyleBase}"
    TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid Background="{TemplateBinding Background}">
                    <Viewbox Width="12" Height="12">
                        <Path Data="M550.848 502.496l308.64-308.896a31.968 31.968 0 1 0-45.248-45.248l-308.608 308.896-308.64-308.928a31.968 31.968 0 1 0-45.248 45.248l308.64 308.896-308.64 308.896a31.968 31.968 0 1 0 45.248 45.248l308.64-308.896 308.608 308.896a31.968 31.968 0 1 0 45.248-45.248l-308.64-308.864z" Fill="{TemplateBinding BorderBrush}" />
                    </Viewbox>
                    <ContentPresenter
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Content="{TemplateBinding Content}" />
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{StaticResource CloseColor}" />
                        <Setter Property="BorderBrush" Value="{StaticResource DominantColor}" />
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
  • 最大化按钮
<Style
    x:Key="SystemMaxButtonStyle"
    BasedOn="{StaticResource SystemButtonStyleBase}"
    TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid Background="{TemplateBinding Background}">
                    <Viewbox Width="12" Height="12">
                        <Path Data="M959.72 0H294.216a63.96 63.96 0 0 0-63.96 63.96v127.92H64.28A63.96 63.96 0 0 0 0.32 255.84V959.4a63.96 63.96 0 0 0 63.96 63.96h703.56a63.96 63.96 0 0 0 63.96-63.96V792.465h127.92a63.96 63.96 0 0 0 63.96-63.96V63.96A63.96 63.96 0 0 0 959.72 0zM767.84 728.505V959.4H64.28V255.84h703.56z m189.322 0H831.8V255.84a63.96 63.96 0 0 0-63.96-63.96H294.216V63.96H959.72z" Fill="{TemplateBinding BorderBrush}" />
                    </Viewbox>
                    <ContentPresenter
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Content="{TemplateBinding Content}" />
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{StaticResource SuspensionColor}" />
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
  • 关闭按钮
<Style
    x:Key="SystemMinButtonStyle"
    BasedOn="{StaticResource SystemButtonStyleBase}"
    TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid Background="{TemplateBinding Background}">
                    <Viewbox Width="12" Height="10">
                        <Path Data="M928.2 548h-832c-17.7 0-32-14.3-32-32s14.3-32 32-32h832c17.7 0 32 14.3 32 32s-14.3 32-32 32z" Fill="{TemplateBinding BorderBrush}" />
                    </Viewbox>
                    <ContentPresenter
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Content="{TemplateBinding Content}" />
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{StaticResource SuspensionColor}" />
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
/// <summary>
/// 窗口移动
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Move_Click(object sender, System.Windows.Input.MouseButtonEventArgs e) => this.DragMove();

/// <summary>
/// 最小化
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void BtnMin_Click(object sender, RoutedEventArgs e) => WindowState = WindowState.Minimized;

/// <summary>
/// 最大化/还原
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void BtnMax_Click(object sender, RoutedEventArgs e) => WindowState = WindowState is WindowState.Normal ? WindowState.Maximized : WindowState.Normal;

/// <summary>
/// 关闭
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void BtnClose_Click(object sender, RoutedEventArgs e) => Application.Current.Shutdown();

布局实现

首先我们需要在 MainWindow 也就是我们的主窗口中的 Window.Resources 中实现 WindowChrome 的基本样式:
WindowChrome.ResizeBorderThickness 设置不可见边框宽度
WindowChrome.CaptionHeight> 设置属于标题栏的范围——高度
WindowChrome.UseAeroCaptionButtons 是否启用默认系统按钮功能——三大金刚键
WindowChrome.NonClientFrameEdges 设置客户区域,使用 bottom 可以实现加载时空白窗口而不显示默认窗口,提升用户体验

<Window
    x:Class="SignalRClient.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:local="clr-namespace:SignalRClient"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title=""
    Width="880"
    Height="620"
    MinWidth="700"
    MinHeight="500"
    Style="{StaticResource mainWindow}"
    WindowChrome.WindowChrome="{DynamicResource WindowChromeKey}"
    WindowStartupLocation="CenterScreen"
    mc:Ignorable="d">

    <Window.Resources>
        <WindowChrome x:Key="WindowChromeKey">
            <WindowChrome.ResizeBorderThickness>
                <Thickness>5</Thickness>
            </WindowChrome.ResizeBorderThickness>
            <WindowChrome.CaptionHeight>60</WindowChrome.CaptionHeight>
            <WindowChrome.UseAeroCaptionButtons>false</WindowChrome.UseAeroCaptionButtons>
            <WindowChrome.NonClientFrameEdges>bottom</WindowChrome.NonClientFrameEdges>
        </WindowChrome>
    </Window.Resources>
</Window>

重写窗口,实现最大化窗口下,标题栏及客户区域偏移问题的修正。
通过代码获取当前窗口的工作区域,及任务栏以外的其他区域
System.Windows.SystemParameters.WorkArea.Width 获取工作区域的宽
System.Windows.SystemParameters.WorkArea.Height 获取工作区域的高
为什么要使用 ValueConverter 主要是因为 WorkArea 返回的类型无法直接 binding xaml

<ValueConverters:WorkAreaWidth x:Key="workAreaWidth" />
<ValueConverters:WorkAreaHeight x:Key="workAreaHeight" />

<Style x:Key="mainWindow" TargetType="{x:Type Window}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Window">

                <ContentControl x:Name="window" Content="{TemplateBinding Content}" />

                <ControlTemplate.Triggers>
                    <Trigger Property="WindowState" Value="Maximized">
                        <Setter TargetName="window" Property="MaxHeight" Value="{Binding Converter={StaticResource workAreaHeight}}" />
                        <Setter TargetName="window" Property="MaxWidth" Value="{Binding Converter={StaticResource workAreaWidth}}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
using System;
using System.Globalization;
using System.Windows.Data;

namespace SignalRClient.ValueConverters
{
    internal class WorkAreaWidth : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return System.Windows.SystemParameters.WorkArea.Width;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}
using System;
using System.Globalization;
using System.Windows.Data;

namespace SignalRClient.ValueConverters
{
    internal class WorkAreaHeight : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return System.Windows.SystemParameters.WorkArea.Height;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

结语

一开始,确实很难搞,Microsoft 的文档,里面也并没有,详细介绍窗口内容溢出的问题,但是只要仔细研究过 WPF 的同学都知道,很多东西是可以通过 Trigger 来实现的。Get 到这一点很多问题就迎刃而解了。欢迎大家留言通过探讨 😃😃😃

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

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

相关文章

多元回归分析 | CNN-BiLSTM卷积双向长短期记忆神经网络多输入单输出预测(Matlab完整程序)

多元回归分析 | CNN-BiLSTM卷积双向长短期记忆神经网络多输入单输出预测(Matlab完整程序) 目录 多元回归分析 | CNN-BiLSTM卷积双向长短期记忆神经网络多输入单输出预测(Matlab完整程序)预测结果评价指标基本介绍程序设计参考资料预测结果 评价指标 训练结束: 已完成最大轮…

新建一个完整的react项目和完善初始项目

一&#xff1a;新建一个完整的react项目 1.环境准备 目前我的环境是 node&#xff1a;16.17.1 npm&#xff1a; 8.15.0 查看环境&#xff1a;1)&#xff1a;打开命令提示符工具&#xff0c;利用node -v和npm -v 查看一下自己的环境&#xff0c;如果觉得重新卸载、安装node比较…

用记事本实现“HelloWorld”输出

一、在任意文件夹中创建一个新的文本文档文件并写入以下代码 public class Hello{public static void main (String[] args){System.out.print("Hello,World!");} } 二、修改文件名称及文件类型为 Hello.java 特别注意&#xff1a;文件命名必须与代码中类的名称相同…

为什么伟大的产品只专注做一件事

uber 不允许你预订出租车。亚马逊一开始只是卖书。谷歌只是一个搜索引擎。麦当劳没有餐具。不知为什么&#xff0c;我们仍然相信一个产品要想成功&#xff0c;它必须做很多事情。这通常发生在两种情况下&#xff1a;当新产品试图让市场相信它们是值得的&#xff0c;或者当公司提…

儿童蜡笔出口美国CPC认证CPSIA+ASTM963测试

蜡笔是将颜料掺在蜡里制成的笔&#xff0c;可有数十种颜色&#xff0c;画画用。蜡笔没有渗透性&#xff0c;是靠附着力固定在画面上&#xff0c;不适宜用过于光滑的纸、板&#xff0c;亦不能通过色彩的反复叠加求得复合色。它是儿童学习色彩画的理想工具&#xff0c;一些画家用…

【Spark分布式内存计算框架——Spark SQL】5. DataFrame(下)

3.3 Row DataFrame中每条数据封装在Row中&#xff0c;Row表示每行数据&#xff0c;具体哪些字段位置&#xff0c;获取DataFrame中第一条数据。 如何构建Row对象&#xff1a;要么是传递value&#xff0c;要么传递Seq&#xff0c;官方实例代码&#xff1a; import org.apache.…

百分点科技宣布接入百度文心一言能力

2月16日&#xff0c; 百分点科技宣布成为百度文心一言&#xff08;英文名&#xff1a;ERNIE Bot&#xff09;首批生态合作伙伴。后续&#xff0c;百分点科技将全面体验并接入文心一言的能力。百分点科技专注于数据科学理论和技术的创新实践&#xff0c;长期坚持基础技术和行业应…

初始QML

Qt Quick的介绍 &#xff1a; Qt Quick是QML的标准类型和功能库。它包括视觉类型&#xff0c;交互类型&#xff0c;动画&#xff0c;模型和视图&#xff0c;粒子效果和着色器效果。QML 应用程序开发人员可以通过单个导入语句访问所有这些功能&#xff0c;简单来说Qt Quick是一…

使用 Hashnode API、Typescript 和 GraphQL 将博客文章添加到您的 React 站点

在本文中&#xff0c;我们将&#xff1a;使用 Next.js 引导一个 React.js Typescript 项目。设置 Apollo GraphQL 客户端并将其集成到我们的项目中。设置 GraphQL Codegen 以生成我们可以在整个应用程序中使用的类型、类型安全查询和自定义挂钩。创建一个索引页面&#xff0c;其…

Failed at the node-sass@4.14.1 postinstall script

vue项目启动&#xff0c;安装node14.18.0版本&#xff0c;构建时报错&#xff1a; Failed at the node-sass4.14.1 postinstall script 其实在构建过程中&#xff0c;还出现了其他组件的各种报错&#xff0c;最后反思了一下&#xff0c;觉得是nodeJs的版本问题&#xff0c;最…

BIM技巧 | Revit中如何给房间填充颜色?就5步

大家在Revit平面创建好房间后&#xff0c;有没有觉得各房间因为没有着色而区分不明显、视觉效果一般呢&#xff1f; 一、今天就教给大家如何给房间填充上颜色。 01 第一步 首先&#xff0c;将各个房间创建好&#xff1b; 02 第二步 在【建筑】-【房间和面积】单击下拉菜单…

深入理解vue2.x中Object.defineproperty()和vue3.x中Proxy

前言 vue2.x中数据的双向绑定主要通过Object.defineproperty()方法实现&#xff0c;data中的数据改变通过Object.defineProperty()对属性设置set属性&#xff0c;获取通过get属性&#xff0c;Object.defineProperty的作用就是劫持一个对象的属性,通常我们对属性的getter和sett…

魔兽世界私服架设教程——如何搭建魔兽世界私服

TrinityCore是一个魔兽世界服务端模拟器&#xff0c;我们可以通过TrinityCore来学习大型网络游戏服务端的编写&#xff0c;从中汲取营养来编写我们自己的游戏。一、前期准备工作CPU需要支持SSE2指令集Boost版本大于等于1.59.0MySQL数据库版本大于等于5.1.0OpenSSL版本为1.0.xCM…

基于机器学习LSTM的古代汉语切分标注算法及语料库研究 完整代码+数据+论文

完整代码&#xff1a;https://download.csdn.net/download/qq_38735017/87382302摘 要近年来&#xff0c;深度学习的浪潮渗透在科研和生活领域的方方面面&#xff0c;本文主要研究深度学习在自然语言处理&#xff0c;尤其是古汉语自然语言处理方面的应用。本文旨在利用计算机帮…

C#中GDI+的矩形功能扩展

原文出处&#xff1a;https://haigear.blog.csdn.net/article/details/129060020 GDI发展到GDI绘制函数中的参数往往都有矩形这个参数&#xff08;除绘制直线和路径&#xff09;&#xff0c;所以我们用好了矩形绘图就容易多了。 一、中心定位绘制图形 但当我们绘制一个图形时…

Towards Adversarial Attack on Vision-Language Pre-training Models

摘要虽然视觉-语言预训练模型(VLP)在各种视觉-语言(VL)任务上表现出革命性的改进&#xff0c;但关于其对抗鲁棒性的研究在很大程度上仍未被探索。本文研究了常用VLP模型和VL任务的对抗性攻击。首先&#xff0c;我们分析了不同设置下对抗性攻击的性能。通过研究不同扰动对象和攻…

HHDESK图片管理——批量重命名及递归搜索

HHDESK作为一款国产桌面软件&#xff0c;考虑到国人的操作及阅读习惯。因此我们开发了一些有意义的新功能&#xff0c;比如今天要介绍的图片批量重命名及递归搜索功能 1.图片批量重命名功能 网上下载的图片名称大多杂乱无章&#xff0c;一眼望去毫无头绪。 而windows自带的…

第41天|LeetCode198. 打家劫舍、LeetCode213. 打家劫舍II、LeetCode337. 打家劫舍III

1.题目链接&#xff1a;198. 打家劫舍 题目描述&#xff1a; 你是一个专业的小偷&#xff0c;计划偷窃沿街的房屋。每间房内都藏有一定的现金&#xff0c;影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统&#xff0c;如果两间相邻的房屋在同一晚上被小偷闯入&a…

Ubuntu中利用aircrack-ng和Wireshark抓空口包

系统&#xff1a;Ubuntu20.04网卡&#xff1a;RTL8188CUS USB网卡工具安装sudo apt-get install aircrack-ngsudo add-apt-repository ppa:wireshark-dev/stable sudo apt update sudo apt install -y wireshark网卡确认网卡是否支持monitor模式&#xff0c;输入iw list命令&am…

Java最全八股文(2023最新整理)

本文已经收录到Github仓库&#xff0c;该仓库包含计算机基础、Java基础、多线程、JVM、数据库、Redis、Spring、Mybatis、SpringMVC、SpringBoot、分布式、微服务、设计模式、架构、校招社招分享等核心知识点&#xff0c;欢迎star~ Github地址&#xff1a;https://github.com/…