刚刚做完的一个屏幕截图程序,分享一下
刚刚做完的一个屏幕截图程序,分享一下
周银辉
好长时间没有更新博客了啊,把绝大多数时间花在了那个开源的WPFToolkit 和 《深入理解操作系统》上, 然后见缝插针地做了这个截图程序。
你可以在这里下载DEMO程序试试效果(我感觉还行~)
拖拽的效果和Windows7自带的snipping tool 差不多,拖拽区域之外是半透明遮罩,拖拽区域之内被镂空的,但其拖拽完成后并不立即截图,你可拖拽手柄来重新调节截图区域,然后双击截图区域,完成截图
1, 选用C++,WinForm还是WPF来完成该程序
选用C++来做的话,我们可以很方便地用bitblt函数来进行屏幕图像的拷贝,似乎大多数截图程序都是这么干的
选用WinForm的话,可以采用Graphics对象的CopyFromScreen函数来屏幕图像的拷贝,这也很方便,不过其相对于WPF更大的好处在于,GDI+是实时绘图的,在你绘制上图中的那个蓝色框时不会有明显的滞后感,特别是对应高分辨率多显示器这样的环境下,WPF的OnRender函数的滞后感是很严重的
选用WPF嘛,从程序本身看,没什么好处,并且WPF貌似没有截图的API吧~~ 况且还有上面所说的滞后感呢。
但我还是选择了WPF,原因是,需要和其他WPF应用集成,我希望是清一色的WPF。洁癖??不是啦,主要的原因还是想偷懒,因为以前做过一个ImageEditor控件,其中的拖拽控件(就是上图的蓝色框)是可以重用的,至于刚才所说的弊端嘛,有办法可以绕过去。
2, 基本思路
截图前,先拷贝整个屏幕图像到一个Image中,我们称之为ScreenSnapshot, 然后用户通过鼠标操作,确定一个矩形区域Rect,将Rect传递给函数BitmapSource Clip(Rect r) , Clip函数在ScreenSnapshot上截取Rect对于的那一部分图像,并返回。
3, 如何截取屏幕图像
WPF没有内置的函数,但可以借用WinForm的Graphics来完成,其将图像截取并保存在一个System.Drawing.Bitmap上,然后我们使用一个辅助函数将System.Drawing.Bitmap转化为WPF版本的System.Media.Imaging.BitmapSource对象就可以了
{
Rectangle rc = SystemInformation.VirtualScreen;
var bitmap = new Bitmap(rc.Width, rc.Height, PixelFormat.Format32bppArgb);
using (Graphics g = Graphics.FromImage(bitmap))
{
g.CopyFromScreen(rc.X, rc.Y, 0, 0, rc.Size, CopyPixelOperation.SourceCopy);
}
return bitmap;
}
public static BitmapSource ToBitmapSource(this Bitmap bmp)
{
BitmapSource returnSource;
try
{
returnSource = Imaging.CreateBitmapSourceFromHBitmap(bmp.GetHbitmap(),IntPtr.Zero, Int32Rect.Empty, BitmapSizeOptions.FromEmptyOptions());
}
catch
{
returnSource = null;
}
return returnSource;
}
4,如何绘制选择框
所谓选择框,就是用户拖拽鼠标时显示的那个框选线框,专业一点的术语叫rubber band
我最开始的做法是在OnRender函数中drawingContext.DrawingRectangle(....) ,对于单屏显示器而言,效果还不错,但在双屏(1920x1200x2)上效果很差,明显的滞后感,另外一位帅哥在“OnRender is not as cheap as OnPaint”中也说到了该问题,总结了下面一段话,让人看了很伤心:
It is ok to use OnRender for things that won’t change, but what you render changes on MouseOver or SizeChanged, you’ll may be causing a layout perf problem for your app.
The way to avoid the OnRender tax is to predefine your UI in a template, then for the bits that change, use triggers within the template to change it.
不过,这个问题可以轻松绕过去:不就想画一个框吗?给你一个框(System.Windows.Shapes.Rectangle)便是。也就是这个框不是靠我们先前的DrawingContext绘制出来的,而是作为一个子控件添加进去的
至于何时去刷新选择框的大小和位置嘛,你可以再用户鼠标拖拽时立即更新,也可以定时更新,我选择的后者,当然,不是自己写定时器,而是才用了CompositionTarget.Rendering事件, 这是一个帧回调,这里的帧就是FPS(frame per second)中的F,所以,这个刷得到多快,就取决于你计算机的FPS了
5, 如何实现遮罩和镂空效果
遮罩很容易实现:在你要遮盖的东西上放置一个半透明控件(比如canvas)就可以了,不过,不要使用让被遮盖物体半透明的方式来实现,比如窗口半透明了,窗口上的子控件也会半透明显示,这不是我们所需要的,我们那个选择框就不是半透的。
镂空嘛,以前会有很学院派的想法,然需要镂空的区域使用OpacityMask或者Xor画刷刷一下不就OK了么?No,太学院派了,费力不讨好。OpacityMask效率很低啦。
实际情况是这样的,如下图, 用四个面板(图中的绿色,橙色,淡蓝,紫色)排列在一起,中间留个洞就可以了,那四个面板共同构成我们的半透明遮罩。
当用户拖拽鼠标时,我们重新排列那四个遮罩面板来改变中间镂空区域的大小和位置,用户就会感觉真的像是在屏幕上画了洞。
6, 如何根据用户拖拽区域截图
这就非常简单了,同样利用Graphics对象在先前的ScreenSnapshot上截取一部分就可以了
{
var sourceRect = region.ToRectangle();
var destRect = new Rectangle(0, 0, sourceRect.Width, sourceRect.Height);
if (screenSnapshot != null)
{
var bitmap = new Bitmap(sourceRect.Width, sourceRect.Height, System.Drawing.Imaging.PixelFormat.Format32bppArgb);
using (Graphics g = Graphics.FromImage(bitmap))
{
g.DrawImage(screenSnapshot, destRect, sourceRect, GraphicsUnit.Pixel);
}
return bitmap.ToBitmapSource();
}
return null;
}
7, 其他的
省着点用CompositionTarget.Rendering事件,也就是说,让其回调函数的效率尽量的高,因为其会被不间断地频繁调用。