使用SPY++查看窗口信息去排查客户端UI软件问题

1、使用SPY++查看窗口的信息

2、使用SPY++查看某些软件UI窗口用什么UI组件实现的

2.1、查看海康视频监控客户端安装包程序

2.2、查看华为协同办公软件WeLink

2.3、查看字节协同办公软件飞书

2.4、查看最新版本的Chrome浏览器

2.5、查看小鱼易连视频会议客户端软件

2.6、常用的UI界面库

3、查看窗口最小化时的窗口位置

4、查看主流软件的窗口风格，猜测其UI界面是如何实现的

5、将所有窗口的信息导出到文件中

6、最后

VC++常用功能开发汇总（专栏文章列表，欢迎订阅，持续更新...）https://blog.csdn.net/chenlycly/article/details/124272585C++软件异常排查从入门到精通系列教程（专栏文章列表，欢迎订阅，持续更新...）https://blog.csdn.net/chenlycly/article/details/125529931C++软件分析工具从入门到精通案例集锦（专栏文章正在更新中...）https://blog.csdn.net/chenlycly/article/details/131405795C/C++基础与进阶（专栏文章，持续更新中...）https://blog.csdn.net/chenlycly/category_11931267.html SPY++是微软Visual Studio自带的一个用来查看窗口属性、窗口消息、进程与线程的工具，在日常工作中处理UI窗口事务用的比较多，今天就来给大家讲一下这个工具的用途。使用该工具去查看窗口属性，可以去辅助分析C++客户端UI程序的问题。

1、使用SPY++查看窗口的信息

SPY++工具打开后，会显示当前系统中所有打开的窗口信息，如下所示：

如果系统有窗口发生改变，比如新增或销毁窗口，则需要点击工具栏中的刷新按钮手动刷新一下。

可以点击工具栏中的望远镜按钮：

在打开的窗口搜索窗口中可以按窗口句柄、窗口标题或者窗口类名去搜索目标窗口，以企业微信窗口标题为例，如下所示：

这样就搜索到了企业微信的主窗口，右键点击，就可以查看企业微信主窗口的信息，比如窗口坐标：

点击样式标签页，可以查看到窗口的基本样式和扩展样式，如下：

如果窗口风格中有WS_CHILD，表示该窗口是子窗口；窗口是否处于显示状态（非掩藏状态），看窗口是否WS_VISIBLE风格。关于窗口风格的详细说明，可以查看我之前写的文章：
VC++ Win32界面编程中的窗口风格要点总结（附源码）https://blog.csdn.net/chenlycly/article/details/121572701此外还可以点击类标签页，查看窗口类名；点击进程标签页，查看窗口所属进程和线程信息。

2、使用SPY++查看某些软件UI窗口用什么UI组件实现的

点击工具栏中的查看窗口按钮，弹出如下窗口：

左键点击图中按钮，一直按着不放，然后将光标移动到目标程序窗口上，这样就能查看到窗口的类名，通过类名我们大概就能猜出对应如软件的UI界面是使用何种UI组件实现的。

2.1、查看海康视频监控客户端安装包程序

使用上面的方法探测海康视频监控客户端安装包程序的主窗口，探测到的窗口类如下所示：

看到安装包主窗口用的是对话框。也可以探测安装包窗口中的编辑框和按钮的窗口类，分别是Edit和Button，所以估计该安装包是用MFC实现的。

2.2、查看华为协同办公软件WeLink

使用上面的方法探测WeLink的登陆窗口，探测到的窗口类如下所示：

可以看到类名为Chrome_WidgetWin_1，包含Chrome字样，所以估计WeLink UI界面是用Chrom浏览器UI组件实现的。也可以探测登陆后的主窗口，主窗口的类名也是Chrome_WidgetWin_1。

2.3、查看字节协同办公软件飞书

使用上面的方法探测到飞书的窗口中均包含Chrome字样，如下所示：

从上图可以看出窗口类类名为Chrome_RenderWidgetHostHWND，说明飞书软件的UI界面也是用Chrome浏览器UI组件实现的。

2.4、查看最新版本的Chrome浏览器

使用上面的方法探测Chrome浏览器窗口，如下所示：

窗口类名为Intermediate D3D Window，好像并不包含Chrome字样，是不是和上面讲的不一致？最新版本的Chrome浏览器不再使用自己开源的UI界面组件了？其实这个和GPU加速有关，如果将GPU加速关闭掉，窗口的类名中就会包含Chrome字样了。如果想搞清楚具体原因，可以去查看开源项目Chromium源码，去一探究竟！

2.5、查看小鱼易连视频会议客户端软件

使用上面的方法探测小鱼易连视频会议客户端软件的主窗口，如下所示：

窗口类名为Qt5152QWindowIcon，所以该软件的UI界面使用QT库实现的。

2.6、常用的UI界面库

这个地方顺便说一下Windows平台上C++软件常用的UI界面库，主要有MFC、duilib、QT和开源的Chrome UI组件库。

其中，MFC库是微软的一套很古老的界面库，实现酷炫的界面比较麻烦，大型商业软件基本都不用了，但有个行业除外，很多炒股软件客户端还是使用。

duilib库是开源的，很多软件都在使用，比如百度云管家、爱奇艺PPS视频客户端、华为手机助手PC客户端等。

QT库最近几年比较好，国产化进程被提到了一个很高的高度，基本所有国产化系统上的软件客户端都使用QT，有些软件为了实现跨平台，Windows和Linux平台均使用QT跨平台库，比如很多安防厂商的视频监控客户端软件都使用QT库，比如海康威视和浙江大华的客户端软件。

Chrome浏览器的UI界面组件，最近几年也比较火，很多厂商的客户端软件都在使用，比如华为的WeLink、字节飞书、阿里钉钉、有道字典、有道云笔记等。

3、查看窗口最小化时的窗口位置

以企业微信主窗口为例，点击工具栏中的按钮，然后将探测按钮拖到企业微信的主窗口上，然后探测到：

点击确定按钮，就会弹出窗口的属性窗口，在常规标签页中可以看到企业微信主窗口处于正常显示状态时窗口坐标，如下所示：

然后将企业微信主窗口最小化，然后在上述页面中点击刷新按钮，刷新一下窗口的信息，看到窗口坐标变成如下的值：

窗口的宽高不变，但窗口left、top、right、bottom坐标值变成了很大的负值，所以将窗口最小化时系统将窗口移动到一个远离桌面可见区域的一个地方了，窗口还处于显示状态，是和掩藏状态有区别的。

4、查看主流软件的窗口风格，猜测其UI界面是如何实现的

现在主流的视频会议软件都支持发送共享图像，比如桌面共享，其中两个厂商不仅支持桌面共享，还支持在桌面上框出某个区域进行共享。我们在某个定制项目中客户要求也要支持区域共享，应该是这两个厂商参与项目竞标，向客户宣导了这个功能，所以客户也想实现这个功能。

于是我们就研究了支持该功能的友商的软件，看看是什么样的交互，模仿着他们的效果实现一下。区域共享的效果如下：

框选共享区域的选择是客户拖动的，拖标题栏可以移动整个选择框窗口；拖动窗口边界区域，可以调整选择框的大小。此外，选择框中间区域是透明的，边框比较简单，这个透明区域是怎么实现的呢？猜测可能是用Layered分层窗口实现的。于是使用SPY++查看区域选择框窗口的属性，查看窗口风格，果然设置了WM_EX_LAYERED属性，如下所示：

选择区域窗口，边界不透明，中间区域透明，应该是调用系统API函数UpdateLayeredWindow实现的。具体的细节，之前已经写成了一篇详细的文章，想了解的，可以去查看这篇文章：
使用Layered分层窗口实现会议中的桌面区域共享功能https://blog.csdn.net/chenlycly/article/details/120756341

5、将所有窗口的信息导出到文件中

可以将某个时刻系统中打开的所有窗口信息保存到文件中，如果要保存最新的，需要点击工具栏中的刷新按钮，将窗口信息刷成最新的，然后再保存。点击菜单栏中的目录树->将目录树保存到文件中，即可导出到一个后缀名为.sxt文件中，该文件可以直接用记事本或者Notepad++查看，比如：

这个导出到文件中的功能在排查软件因为窗口问题导致崩溃的问题时可能有用，比如崩溃在某个窗口代码中，但调用堆栈都是系统框架的代码，我们只能看到句柄值，我们搞不清楚到底是哪个窗口，如果我们事先将窗口信息保存到文件中，我们使用窗口句柄到文件中搜索就能看到窗口的类名等信息，这样可能就能确定发生崩溃的窗口是哪个了，我们在实际的项目中就使用过保存到文件的功能。