采用WPF开发截图程序,so easy!

前言 QQ、微信截图功能已很强大了,似乎没必要在开发一个截图程序了。但是有时QQ热键就是被占用,不能快速的开启截屏;有时,天天挂着QQ,领导也不乐意。既然是程序员,就要自己开发截屏工具,功能随心所欲,岂不快哉。

再强调一点:工具就是生产力!没有掌握WPF之前,我是不会开发这么一个程序的,如果采用MFC、winform框架,工作量是相当的大,开发出来的效果肯定也比较low。本人用WPF,花了一天多的功夫,开发了这个小程序。程序的定位就功能简单,平时工作不碍事,用着的时候,一键截图!

为了不影响视觉, 程序主界面非常小。程序会在所有界面最前端展示。

有两个按钮1)“快捷截图”:截图后,立即将截图复制到剪切板。2)“截图+编辑”:截图后,可以在图上标注箭头和文字。

正在截图时,效果:

截图后,可编辑:

新增保留历史记录功能,选中历史记录,复制到剪切板。

看似简单,对开发技巧要求很高。内行看门道!

开发思路

常言道:看到的不一定是真实的。开发也要这样。程序叫截屏,你不要一股劲想着怎么截取别的窗口图案,肯定很费劲!思虑就是掩人耳目:先将整个屏幕复制,放到自己程序窗体中,窗体最大化,覆盖整个屏幕!用户看到还是整个屏幕,但是整个屏幕已被偷梁换柱!此后,你所有的操作都是在自己窗体上处理,当然可以随心所欲了!

截取整个屏幕

       public Bitmap GetScreenSnapshot()
        {
            System.Drawing.Rectangle rc = SystemInformation.VirtualScreen;
            var bitmap = new Bitmap(rc.Width, rc.Height, System.Drawing.Imaging.PixelFormat.Format32bppArgb);

            using (Graphics memoryGrahics = Graphics.FromImage(bitmap))
            {
                memoryGrahics.CopyFromScreen(rc.X, rc.Y, 0, 0, rc.Size, CopyPixelOperation.SourceCopy);
            }

            return bitmap;
        }

创建全屏窗体

注意窗体属性,这样才能全面覆盖整个屏幕。

图层布局

这个很有技巧!为了实现非截图区域阴影效果,费了一番心机!即使这样,感觉也比winform用起来得心应手!

注:我不是一直贬低winform,但是要承认,这两个东西不是一个时代产物。wpf设计思路比winform先进很多。只是wpf新概念多,用的人少,开发起来常常蒙圈!经过一段迷茫期,前途就会光明了!

窗口的布局,不多说了!直接上代码。我对代码做了注释!

<Window.Resources>
        <ControlTemplate x:Key="templatePushButton" TargetType="RadioButton">
            <Border x:Name="Part_Border" BorderThickness="1" BorderBrush="Gray" 
                                        Background="{TemplateBinding Background}"
                                        Margin="{TemplateBinding Margin}"
                                        Padding="{TemplateBinding Padding}">
                <ContentPresenter></ContentPresenter>
            </Border>

            <ControlTemplate.Triggers >
                <Trigger Property="IsChecked" Value="True">
                    <Setter  TargetName="Part_Border"  Property="BorderBrush" Value="Blue"></Setter>
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter  TargetName="Part_Border"  Property="Background" Value="#FFb2dff9"></Setter>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>

        <Style x:Key="stylePushButton" TargetType="RadioButton">
            <Setter Property="VerticalAlignment" Value="Center"></Setter>
            <Setter Property="Padding" Value="8,5,8,5"></Setter>
            <Setter Property="Template" Value="{StaticResource templatePushButton}"></Setter>
</Style>

    </Window.Resources>
    <Grid Background="Green" >
        <!-- 整个屏幕图像 -->
        <Image x:Name="imgScreen"
               MouseDown="ImgScreen_MouseDown"
               MouseUp="ImgScreen_MouseUp"
               Stretch="None"           
               MouseMove="ImgScreen_MouseMove">
        </Image>

        <!-- 覆盖一层黑色,半透明状 -->
        <Grid x:Name="gridCover" Visibility="Collapsed" Background="Black" Opacity="0.5">
        </Grid>

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"></RowDefinition>
                <RowDefinition Height="auto"></RowDefinition>
            </Grid.RowDefinitions>
            <!-- 前面覆盖了一层黑色,但是截取的图像不能覆盖,只能在这里再显示截取图像 -->
            <Grid x:Name="gridCutImg"  
                  MouseDown="ImgCut_MouseDown" 
                  MouseMove="ImgCut_MouseMove"
                   MouseUp="ImgCut_MouseUp">
                <Image x:Name="imgCut" Grid.RowSpan="3" Stretch="None"                                                                    
                   HorizontalAlignment="Left" VerticalAlignment="Top"></Image>
                <!--用来画箭头和文字-->
                <Canvas x:Name="canvasEdit"  HorizontalAlignment='Left'
                        VerticalAlignment="Top"  Background="Transparent">
                    
                </Canvas>
            </Grid>

            <!--显示提示信息-->
            <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center"
                           FontSize="22" Foreground="Yellow"
                          Opacity="0.8" >滑动鼠标开始截屏 截图保存到剪切板 按ESC键退出</TextBlock>

            <StackPanel  Grid.RowSpan="3">
                <Grid >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                </Grid>
                <!--截图指示框-->
                <Border x:Name="borderSelect" 
                HorizontalAlignment="Left" VerticalAlignment="Top"
                BorderThickness="1" BorderBrush="Red"></Border>
                <!--宽和高指示-->
                <Grid  HorizontalAlignment="Stretch" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"></ColumnDefinition>
                        <ColumnDefinition Width="auto"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <TextBlock x:Name="txtCutInfo"  Padding="8,5,8,5" 
                               HorizontalAlignment="Left"
                              Background="White" VerticalAlignment="Center">1</TextBlock>
                    <StackPanel x:Name="stackEdit" Orientation="Horizontal" HorizontalAlignment="Right" Grid.Column="1" Margin="2">
                        <RadioButton x:Name="radioArrow" GroupName="editType" Click="RadioArrow_Click" Foreground="Black" Padding="10,5,10,5" Style="{StaticResource stylePushButton}">↑</RadioButton>
                        <RadioButton  x:Name="radioText"  GroupName="editType" Click="RadioText_Click" Foreground="Black" Style="{StaticResource stylePushButton}">文</RadioButton>
                        <RadioButton  x:Name="radioClose" Click="RadioClose_Click" Foreground="Red" Style="{StaticResource stylePushButton}">X</RadioButton>
                    </StackPanel>
                </Grid>

            </StackPanel>

        </Grid>
    </Grid>

当鼠标移动时,不断的计算选中区域,设置borderSelect属性。

 private void ImgScreen_MouseMove(object sender, MouseEventArgs e)
        {
            if (!_isMouseDown)
                return;

            gridCover.Visibility = Visibility.Visible;

            //计算鼠标选中区域
            Point currentPoint = e.GetPosition(imgScreen);
            Point borderPoint = e.GetPosition(borderSelect);

            double xDelta = xDelta_BoderToImgScreen;
            double yDelta = yDelta_BoderToImgScreen;

            _rectImgCut = ImageHelper.ToRect(currentPoint, _startPoint);

            Rect rectBoderCut = ImageHelper.ToRect(new Point(currentPoint.X + xDelta, currentPoint.Y + yDelta),
                new Point(_startPoint.X + xDelta, _startPoint.Y + yDelta));

            //设置方框位置和大小
            Thickness thickness = new Thickness(rectBoderCut.Left, rectBoderCut.Top, 0, 0);
            borderSelect.SetValue(FrameworkElement.MarginProperty, thickness);
            imgCut.SetValue(FrameworkElement.MarginProperty, thickness);

            thickness = new Thickness(rectBoderCut.Left, 3, 0, 0);
            txtCutInfo.SetValue(FrameworkElement.MarginProperty, thickness);

            borderSelect.Width = Math.Abs(_startPoint.X - currentPoint.X);
            borderSelect.Height = Math.Abs(_startPoint.Y - currentPoint.Y);
            borderSelect.Visibility = Visibility.Visible;

            //为了防止整个图 变暗,鼠标选中区域图像抠图,再在上层图像上显示
            imgCut.Source = GetBitmapCut();

            Int32Rect imgDestRect = GetCutRect();
            txtCutInfo.Text = string.Format($"宽:{imgDestRect.Width} 高:{imgDestRect.Height}");
        }

到此,程序主要逻辑处理完毕!

本文分享自微信公众号 - DotNet程序园(dotnetblog)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-10-22

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏林德熙的博客

WPF 控件 Content 的内容不显示下划线字符串

在 WPF 中有一个特性是按下 Alt 键盘选中某个按钮,而这个特性是通过在内容里面的字符串里面添加关键字,让某个字符作为关键字的方法就是在前面加上下划线所以这...

11610
来自专栏谭广健的专栏

死循环的妙用

做开发写程序,最麻烦就是写循环。一个程序功能里面如果多于5个循环的,那么要么这个业务逻辑有问题,要么就是开发的人太Yang。用5个循环去做一个业务逻辑,耗时耗资...

11520
来自专栏Kiba518

C#调用OpenCV开发简易版美图工具

本文主要介绍在WPF项目中使用OpenCVSharp3-AnyCPU开源类库处理图片,下面我们先来做开发前的准备工作。

13530
来自专栏林德熙的博客

dotnet Framework 源代码 · ScrollViewer

本文是分析 .net Framework 源代码的系列,主要告诉大家微软做 ScrollViewer 的思路,分析很简单。 看完本文,可以学会如何写一个 Scr...

6420
来自专栏林德熙的博客

WPF 多个 StylusPlugIn 的事件触发顺序

如果在 WPF 使用 StylusPlugIn 同时在同一个界面用多个元素都加上 StylusPlugIn 那么事件触发的顺序将会很乱 我建议是不要让 Styl...

7730
来自专栏dino.c的专栏

[UWP]使用Win2D的BorderEffect实现图片的平铺功能

在WPF中只要将ImageSource的TileMode属性设置为Tile即可实现图片的平铺,具体可见WPF的这些文档:

8750
来自专栏DotNet程序园

造轮子了!NETCore跨平台UI框架,CPF

CPF(暂时命名)(Cross platform framework),模仿WPF的框架,支持NETCore的跨平台UI框架,暂时不够完善,只用于测试,暂时只支...

6510
来自专栏林德熙的博客

WPF will break when an exception be throw in the StylusPlugIn

We can write a class that inherits the StylusPlugIn. And this class can get the ...

6220
来自专栏林德熙的博客

WPF 运行时迁移 EF Core 数据库

在客户端开发,可以使用 .NET Core 3.0 开发 WPF 程序,可以使用 EF Core 连接数据库。客户端的数据库使用 SQLite 在不同的版本需要...

9940

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励