C# wpf使用DockPanel实现制作截屏框

更新时间：2023年09月07日 08:44:41 作者：CodeOfCC

做桌面客户端的时候有时需要实现截屏功能,能够在界面上框选截屏,本文就来为大家介绍一下wpf如何使用DockPanel制作截屏框吧,感兴趣的可以了解下

前言

做桌面客户端的时候有时需要实现截屏功能，能够在界面上框选截屏，做一个蒙版然后中间选框透明可以移动和改变大小。这个功能是不太好实现的，需要一定的方法，其中使用DockPanel是相对简单直接的实现。

一、如何实现

我们按照如下步骤即可实现一个截屏窗口

1、设置透明窗口

首先窗口必须是无边框的透明窗口，我们这里不使用Transparency，因为对性能影响比较大。我们使用WindowChrome实现无边框透明窗口。

<Window x:Class="WpfApp4.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:local="clr-namespace:WpfApp4"
        mc:Ignorable="d"
        Title="MainWindow" Height="720" Width="1280"
        Background="{x:Null}"
        ResizeMode="NoResize"
        WindowStyle="None"
        WindowState="Maximized"
        >
    <WindowChrome.WindowChrome>
        <WindowChrome GlassFrameThickness="-1"   CaptionHeight="0"   />
    </WindowChrome.WindowChrome>
</Window>

2、使用DockPanel

在窗口中定义一个DockPanel控件作为父级，定义4个方位填充控件以及中间截屏框。

<DockPanel>
    <Grid x:Name="leftPanel"     Width="400"   DockPanel.Dock="Left" Background="#80000000"></Grid>
    <Grid x:Name="topPanel"      Height="200"  DockPanel.Dock="Top" Background="#80000000"></Grid>
    <Grid x:Name="rightPanel"    Width="400"   DockPanel.Dock="Right" Background="#80000000"></Grid>
    <Grid x:Name="bottomPanel"   Height="200" DockPanel.Dock="Bottom" Background="#80000000"></Grid>
    <Grid x:Name="clipRect"  MouseDown="Button_MouseDown"  MouseMove="Button_MouseMove"   MouseUp="Button_MouseUp" Background="Transparent">
        <Grid.Resources>
            <Style TargetType="Thumb">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Thumb">
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Grid.Resources>
        <!--左-->
        <Thumb  Margin="-8,0,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Center" Cursor="SizeWE"   DragDelta  ="Thumb_DragDelta"/>
        <!--上-->
        <Thumb  Margin="0,-8,0,0" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Top" Cursor="SizeNS" DragDelta  ="Thumb_DragDelta"/>
        <!--右-->
        <Thumb  Margin="0,0,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Center" Cursor="SizeWE" DragDelta  ="Thumb_DragDelta"/>
        <!--下-->
        <Thumb  Margin="0,0,0,-8" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Bottom" Cursor="SizeNS" DragDelta  ="Thumb_DragDelta"/>
        <!--左上-->
        <Thumb  Margin="-8,-8,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Top" Cursor="SizeNWSE" DragDelta  ="Thumb_DragDelta"/>
        <!--右上-->
        <Thumb  Margin="0,-8,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Top"  Cursor="SizeNESW" DragDelta  ="Thumb_DragDelta"/>
        <!--右下-->
        <Thumb  Margin="0,0,-8,-8" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Bottom"  Cursor="SizeNWSE"  DragDelta  ="Thumb_DragDelta"/>
        <!--左下-->
        <Thumb  Margin="-8,0,0,-8" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Bottom" Cursor="SizeNESW" DragDelta  ="Thumb_DragDelta"/>
    </Grid>
</DockPanel>

效果预览

3、实现拖动逻辑

（1）注册事件

与Grid的拖动实现非常类似，4个方位的控件可以当成margin使用，上一步的截屏框注册3个鼠标事件

 <Grid x:Name="clipRect"  MouseDown="Button_MouseDown"  MouseMove="Button_MouseMove"   MouseUp="Button_MouseUp" Background="Transparent">

（2）拖动逻辑

将4个方位的控件的宽高组成一个margin，代入《C# wpf 实现Grid内控件拖动》即可，只需要注意边界处理（宽高不能为负数），此处不贴具体代码。下面是Button_MouseDown的部分代码示例，以此类推即可。

_mouseDownMargin = new Thickness(leftPanel.ActualWidth, topPanel.ActualHeight, rightPanel.ActualWidth, bottomPanel.ActualHeight);

4、实现拖动调大小逻辑

（1）注册事件

给界面中的8个Thumb注册同一个Thumb_DragDelta事件。

<Thumb  Margin="-8,0,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Center" Cursor="SizeWE"   DragDelta  ="Thumb_DragDelta"/>

（2）实现逻辑

将4个方位的控件的宽高组成一个margin，代入《C# wpf Grid中实现控件拖动调整大小》的Thumb_DragDelta即可，只需要注意边界处理（宽高不能为负数）。此处不贴具体代码。下面是Thumb_DragDelta的部分代码示例，以此类推即可。

if (thumb.HorizontalAlignment == HorizontalAlignment.Left)
{
    right = rightPanel.ActualWidth;
    left = leftPanel.ActualWidth + e.HorizontalChange;
    width = (double.IsNaN(c.Width) ? c.ActualWidth : c.Width) - e.HorizontalChange;
}

二、效果预览

三、总结

本文简单介绍截屏框的实现，曾经为了事件这个界面功能花了不少精力，尤其是计算控件宽度以及位置关系，需要仔细计算。本文实现的截屏界面效果是可以的，拖动也是流畅的，完全满足一般项目的使用。

到此这篇关于C# wpf使用DockPanel实现制作截屏框的文章就介绍到这了,更多相关C# wpf DockPanel截屏框内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

C#深浅拷贝的深入解析
这篇文章主要给大家介绍了关于C#深浅拷贝的深入解析，文中通过示例代码介绍的非常详细，对大家的学习或者使用C#具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-11-11
C#使用foreach语句搜索数组元素的方法
这篇文章主要介绍了C#使用foreach语句搜索数组元素的方法,涉及C#使用foreach语句遍历数组实现搜索功能的技巧,非常具有实用价值,需要的朋友可以参考下
2015-04-04
C#使用正则表达式实现常见的格式验证
这篇文章主要为大家详细介绍了C#如何使用正则表达式实现常见的格式验证,例如：电话号码、密码、邮编等,感兴趣的小伙伴可以跟随小编一起学习一下
2024-01-01
C#实现获取电脑硬件显卡核心代号信息
这篇文章主要为大家详细介绍了如何利用C#实现获取电脑硬件显卡核心代号信息,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
2024-01-01
Unity通用泛型单例设计模式（普通型和继承自MonoBehaviour）
这篇文章主要介绍了Unity通用泛型单例设计模式，分为普通型和继承MonoBehaviour，帮助大家更好的理解和学习，感兴趣的朋友可以了解下
2020-07-07
C# VB.NET 实现在Word中嵌入多媒体(视频、音频)文件
Word中可将Office、PDF、txt等文件作为OLE对象插入到文档中，双击该对象可直接访问或编辑该文件，除了以上常见的文件格式对象，也可以插入多媒体文件，如视频、音频等。本篇文章介绍了通过C#实现在Word中插入多媒体文件。感兴趣的可以学习一下
2021-12-12
c# 模拟线性回归的示例
这篇文章主要介绍了c# 模拟线性回归的示例，帮助大家利用c#进行机器学习，感兴趣的朋友可以了解下
2020-10-10
C#中应用程序集的装载过程详解
这篇文章主要介绍了C#中应用程序集的装载过程的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-12-12
SuperSocket入门--Telnet服务器和客户端请求处理
本文的控制台项目是根据SuperSocket官方Telnet示例代码进行调试的，官方示例代码：Telnet示例。下面跟着小编一起来看下吧
2017-01-01
基于StreamRead和StreamWriter的使用(实例讲解)
下面小编就为大家分享一篇基于StreamRead和StreamWriter的使用实例讲解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2017-11-11