WPF UI工具Snoop的用法

转自：https://blog.csdn.net/muzizongheng/article/details/9364293

snoop是开发wpf应用程序的利器。用它可以观察WPF的可视树，监听事件，更改元素属性等。

下面我介绍下snoop一些用法。

1.获取指定应用程序的UI

  打开snoop，选择“Drag and Drop this crosshairs over wpf window inorder to snoop it” 按钮， 拖动它到你要观察的wpf窗体上。

  你会发现 十字准线 会标出 窗体的名字及进程号。

2.选择窗体后，snoop会创建一个包含此窗体可视树的一个界面。

  此UI左边是窗体的可视树，右边是每个可视元素的属性，DataContext（数据上下午）， 发生的Events，以及保护的公共方法。

3.在Snoop创建出来的可视树找到自己想要观察的元素， 有2种办法：

（1）根据元素层次关系， 层层展开，找到对应元素。

（2）在被观察的窗体上， 按住快捷键shift+ctrl， 然后用鼠标左键直接选择对应元素。

4.Properties选项卡的用法

  此页显示了左边选中的可视元素的属性。 通过Properties可以看到运行时的属性值（ 比如Width，Height，以及此属性值如果Binding则其BindingPath）

  大部分控件的属性是可更改的， 则我们可以在Properties中更改某些属性值， 来实时看到被观察窗体上的UI变化。 （比如，我们更改元素的Visibility，可以        实时看到元素的隐藏或显示；更改高宽来实时查看变化等等） 这样对于调试很方便，当我们通过snoop确定效果时，再在代码中更改。

5.Data Context选项卡的用法

 

 此页显示了左边选中的可视元素的DataContext(数据上下文） ， 通过此功能看到运行时我们Binding的值是否正确。

6.Events选项卡的用法

  此页显示了被观察窗体所发生的路由事件。通过此功能我们可以查看用户操作时的Routed Event是否按照我们想象的方式正确运行。

 点击Common Events下拉框， 可以选择想要监视的event类型。

7.Methods选项卡的用法

 

 此页可以动态调用左边被选中元素所公开的函数方法， 或者元素的DataContext所公开的方法。 通过此方法我们可以调试一些方法调用后对于UI的影响。

8.右下角Preview区域的用法

 snoop右下角可以对被观察窗体进行放大， 实时预览，以及截图保存。尤其是Preview功能，对应实时调试样式效果很有用。打开实时预览功能后， 我们可以在预览区域进行拖动，放大缩小等操作，能尽可能最大化的看到效果。

9.状态栏

 snoop的状态栏显示了当前focus的元素， 对于我们调试wpf的焦点问题也很有用法，配合Events监视情况会更好。