WPF 开发调试比较:Visual Studio 原生和Snoop调试控制台

文章目录

  • 前言
  • 运行环境
  • 简单的WPF代码
    • 实现一个简单的ListBox
    • Visual Studio自带代码调试
      • 热重置功能测试
      • 实时可视化树
        • 查找窗口元素
        • 显示属性
    • Snoop调试使用
    • Snoop简单使用
      • 调试控制台
      • 元素追踪
      • 结构树
        • Visual/可视化结构树
        • Logical/本地代码可视化树
        • AutoMation/自动识别结构树
      • WPF元素控制台
  • 结论

前言

WPF虽然自己本身自带调试工具,但是那个调试工具相对来说功能有点少,我这里会对Visual Studio 原生的调试工具和第三方调试工具Snoop进行比较

运行环境

  • window10
  • visual studio 2022
  • .net core 8.0

简单的WPF代码

我这里用了CommunityToolkit.MVVM
在这里插入图片描述

实现一个简单的ListBox

ViewModel

 public class TestViewModel{public record Person(int Id,string Name,string Descirption);public List<Person> People => new List<Person>(){new Person(1,"小王","王哥"),new Person(2,"小帅","大帅比"),new Person(3,"小美","美美的")};public TestViewModel() { }}
<UserControl x:Class="WpfSnoopDemo.Views.TestView"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:WpfSnoopDemo.Views"mc:Ignorable="d" xmlns:viewModels="clr-namespace:WpfSnoopDemo.ViewModels"d:DesignHeight="450" d:DesignWidth="800"><UserControl.DataContext><viewModels:TestViewModel /></UserControl.DataContext><Grid><ListBox ItemsSource="{Binding People}"><ListBox.ItemTemplate><DataTemplate><StackPanel Orientation="Vertical"><!--这个是一种仿CSS的写法--><StackPanel.Resources><Style TargetType="StackPanel"><Setter Property="Orientation"Value="Horizontal" /></Style></StackPanel.Resources><StackPanel><TextBlock Text="Id:" /><TextBlock Text="{Binding Id}" /></StackPanel><StackPanel><TextBlock Text="Name:" /><TextBlock Text="{Binding Name}" /></StackPanel><StackPanel><TextBlock Text="Descirption:" /><TextBlock Text="{Binding Descirption}" /></StackPanel></StackPanel></DataTemplate></ListBox.ItemTemplate></ListBox></Grid>
</UserControl>

在这里插入图片描述

Visual Studio自带代码调试

在这里插入图片描述
在这里插入图片描述

热重置功能测试

热重置的意思是编译运行之后修改源代码,能通过重载而不用重新编译就能看到新修改的效果。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

实时可视化树

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

序号用途
1显示WPF Debug运行调试工具
2选择元素
3显示装饰器,就是个十字坐标定位,显示盒子模型
4跟踪具有焦点的元素,暂时不知道有啥用
5显示绑定问题
6辅助扫描,没啥用
7预览选定项,不知道有啥用
8活动文档查找元素。就是你鼠标选择了哪个,点这个可以跳转到鼠标选中的对应结构
9显示对应元素属性
10展开树结构
11压缩树结构
12只显示自己的代码

WPF Debug窗口是部分工具展示,这里就不展开说明了。
在这里插入图片描述

查找窗口元素

在这里插入图片描述

显示属性

在这里插入图片描述
在这里插入图片描述
这里面会显示所有对应的属性

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
也可以看DataContext
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

Snoop调试使用

WPF Snoop Github地址

在这里插入图片描述

Snoop下载地址

在这里插入图片描述
下载好了直接安装

在这里插入图片描述

双击运行之后出现这个界面
在这里插入图片描述

Snoop简单使用

关于Snoop的用法

在这里插入图片描述
打开Snoop我们可以看到这几个按钮

序号含义使用情况
1选择正在运行的WPF窗口一般不用
2刷新找到的WPF窗口一般不用
3在【1】选择好对象后,创建一个Snoop克隆一般不用
4拖动准星,选择WPF窗口,实现【3】效果一般不用
5创建一个Snoop可克隆对象并添加【调试控制台】常用
6在【4】的基础上面创建【调试控制台】常用
7设置一般默认即可
8缩小
9关闭

调试控制台

我们在使用【5】/【6】的时候,会生成如下的调试窗口

在这里插入图片描述
在这里插入图片描述

序号功能
1结构树
2配置文件
3设置
4窗口元素追踪,快捷键:Ctrl+Shift+鼠标移动
5断点调试
6版本
7主题,有黑色和白色

元素追踪

在这里插入图片描述

使用Ctrl+Shift选中元素,由于我GIF录屏会有窗口遮挡,所以有点不连贯。
在这里插入图片描述
有时候选择多了会出现这个Bug,我们点击清空即可
在这里插入图片描述

结构树

在这里插入图片描述

我们先选中一个元素

在这里插入图片描述
鼠标停留在对应的树节点上面,会显示对应的可视化元素值
在这里插入图片描述

Visual/可视化结构树

可视化结构树就是里面所有的基础控件元素,和我们F12跳出来的Html控制台的结果差不多

在这里插入图片描述

Logical/本地代码可视化树

在这里插入图片描述

AutoMation/自动识别结构树

自动识别处于两种之间,自动识别我们自己本地的代码

在这里插入图片描述

WPF元素控制台

在这里插入图片描述

序号用处
1元素属性
2元素上下文
3元素Event事件,一般是鼠标事件
4元素触发器
5元素行为
6元素方法
7Debug监听器

这里用法太多了,我们就不展开说明了
在这里插入图片描述

我们也可以实时修改对应的元素,但是感觉用处不是很大,因为WPF已经支持热重载了。
在这里插入图片描述
在这里插入图片描述

结论

Snoop算是Visual Studio的补充,Visual Studio本身的代码调试就已经是非常的惊艳了。其它的玩法我也在摸索当中。Snoop算是浏览器的F12,你是用来查看元素的,不是直接改Html结果的。这个是一个很好的代码调试的作用和对元素Visual Studio的补充。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/696937.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于springboot+vue的房屋租赁管理系统(前后端分离)

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战&#xff0c;欢迎高校老师\讲师\同行交流合作 ​主要内容&#xff1a;毕业设计(Javaweb项目|小程序|Pyt…

【OpenAI官方课程】第四课:ChatGPT文本推断Summarizing

欢迎来到ChatGPT 开发人员提示工程课程&#xff08;ChatGPT Prompt Engineering for Developers&#xff09;&#xff01;本课程将教您如何通过OpenAI API有效地利用大型语言模型&#xff08;LLM&#xff09;来创建强大的应用程序。 本课程由OpenAI 的Isa Fulford和 DeepLearn…

手拉手Vite+Vue3+TinyVue+Echarts+TailwindCSS

技术栈springboot3hutool-alloshi-coreVue3viteTinyVueEchartsTailwindCSS软件版本IDEAIntelliJ IDEA 2022.2.1JDK17Spring Boot3.1hutool-all5.8.18oshi-core6.4.1Vue35.0.10vite5.0.10axios1.6.7echarts5.4.3 ECharts是一个使用 JavaScript 实现的开源可视化库&#xff0c;可…

快速搭建ARM64实验平台(QEMU虚拟机+Debian)

文章目录 前言一、实验平台介绍二、安装步骤2.1 安装工具2.2 下载仓库2.3 编译内核并制作根文件系统2.4 运行刚才编译好的ARM64版本的Debian系统2.5 在线安装软件包2.6 在QEMU虚拟机和主机之间共享文件 三、单步调试ARM64 Linux内核参考资料 前言 最近翻阅笨叔的《奔跑吧Linux…

go-zero微服务入门教程

go-zero微服务入门教程 本教程主要模拟实现用户注册和用户信息查询两个接口。 准备工作 安装基础环境 安装etcd&#xff0c; mysql&#xff0c;redis&#xff0c;建议采用docker安装。 MySQL安装好之后&#xff0c;新建数据库dsms_admin&#xff0c;并新建表sys_user&#…

【Git】 删除远程分支

Git 删除远程分支有以下几种方法 服务端UI工具 Git 的服务端图形化工具主要是 web 端。常用的有 GitHub、Gitea、Gutlab 等。 这些工具都提供了分支管理&#xff0c;可以直接在各服务端找到相关功能&#xff0c;谨慎删除。 客户端UI工具 Git 拥有诸多客户端 UI 工具&#x…

详细分析Python中的unittest测试框架

目录 1. 基本知识2. API2.1 断言2.2 setUp() 和 tearDown() 3. Demo 1. 基本知识 unittest 是 Python 标准库中的一个单元测试框架&#xff0c;用于编写和执行测试用例以验证代码的正确性 提供了一种结构化的方法来编写测试&#xff0c;使得测试代码更加模块化和易于维护 以…

【ACW 服务端】页面操作Java增删改查代码生成

版本: 1.2.2-JDK17-SNAPSHOT 项目地址&#xff1a;wu-smart-acw 演示地址&#xff1a;演示地址 admin/admin Java增删改查代码生成 找到对应菜单 选择你需要的数据实例 选择数据库 选择数据库表 选择客户端&#xff08;如果是本地ACW服务代码启动默认注册上的客户端ID是…

腾讯云主机Ubuntu22.04安装Odoo17

一、安装PostgreSQL16 参见之前的文章 Ubuntu22.04安装PostgreSQL-CSDN博客 二、安装Odoo17 本方案使用的nightly版的odoo&#xff0c;安装的都是最新版odoo wget -O - https://nightly.odoo.com/odoo.key | apt-key add - echo "deb http://nightly.odoo.com/17.0/n…

Maven【1】(命令行操作)

文章目录 一丶创建maven工程二、理解pom.xml三、maven的构建命令1.编译操作2.清理操作3.测试操作4.打包操作5.安装操作 一丶创建maven工程 首先创建这样一个目录&#xff0c;然后从命令行里进入这个目录&#xff1a; 然后接下来就在这个命令行里进行操作了。 这个命令是&…

Python学习笔记——PySide6设计GUI应用之UI与逻辑分离

1、打开PySide6的UI设计工具pyside6-designer&#xff0c;设计一个主窗口&#xff0c;保存文件名为testwindow.ui 2、使用PySide6的RCC工具把testwindow.ui文件转换为testwindow_rc.py文件&#xff0c;此文件中有一个类Ui_MainWindow&#xff08;包含各种控件对象&#xff09;…

设计模式浅析(八) ·外观模式

设计模式浅析(八) 外观模式 日常叨逼叨 java设计模式浅析&#xff0c;如果觉得对你有帮助&#xff0c;记得一键三连&#xff0c;谢谢各位观众老爷&#x1f601;&#x1f601; 外观模式 概念 外观模式&#xff08;Facade Pattern&#xff09;是一种设计模式&#xff0c;它为…

深度学习发展里程碑事件2006-2024

2006-2024年&#xff0c;深度学习发展经历众多的里程碑事件&#xff0c;一次次地刺激着人们的神经&#xff0c;带来巨大的兴奋。电影还在继续&#xff0c;好戏在后面&#xff0c;期待…… 2006年 深度信念网络&#xff08;DBNs&#xff09;&#xff1a;Geoffrey Hinton与他的学…

备战蓝桥杯 Day10(背包dp)

01背包问题 1267&#xff1a;【例9.11】01背包问题 【题目描述】 一个旅行者有一个最多能装 M&#xfffd; 公斤的背包&#xff0c;现在有 n&#xfffd; 件物品&#xff0c;它们的重量分别是W1&#xff0c;W2&#xff0c;...,Wn&#xfffd;1&#xff0c;&#xfffd;2&#…

蓝桥杯刷题--python-10(2023填空题3)

0工作时长 - 蓝桥云课 (lanqiao.cn) import datetime time_str_list=[] while(True):tmp=input()if not tmp: breaktime_str_list.append(tmp)# time_list=[datetime.datetime.strptime(t,"%Y-%m-%d %H:%M:%S")for t in time_str_list] time_list.sort() sum=0 for i…

【代码随想录算法训练营Day25】● 216.组合总和III ● 17.电话号码的字母组合

文章目录 Day 25 第七章 回溯算法part02216.组合总和III自己的思路&#xff08;✅通过&#xff09; 17.电话号码的字母组合思路代码 Day 25 第七章 回溯算法part02 今日内容&#xff1a; ● 216.组合总和III● 17.电话号码的字母组合 216.组合总和III 如果把 组合问题理解了…

计算机组成原理(9)----硬布线控制器

控制单元CU若想发出对应的控制信号&#xff0c;则需要以下信息&#xff1a;指令操作码&#xff0c;目前的机器周期&#xff0c;节拍信号&#xff0c;机器状态条件&#xff0c;根据这些信息&#xff0c;CU就能确定在这个节拍下应该发出哪些"微命令"&#xff0c;也就是…

SQL注入:使用预编译防御SQL注入时产生的问题

目录 前言 模拟预编译 真正的预编译 预编译中存在的SQL注入 宽字节 没有进行参数绑定 无法预编译的位置 前言 相信学习过SQL注入的小伙伴都知道防御SQL注入最好的方法&#xff0c;就是使用预编译也就是PDO是可以非常好的防御SQL注入的&#xff0c;但是如果错误的设置了…

计算机设计大赛 深度学习动物识别 - 卷积神经网络 机器视觉 图像识别

文章目录 0 前言1 背景2 算法原理2.1 动物识别方法概况2.2 常用的网络模型2.2.1 B-CNN2.2.2 SSD 3 SSD动物目标检测流程4 实现效果5 部分相关代码5.1 数据预处理5.2 构建卷积神经网络5.3 tensorflow计算图可视化5.4 网络模型训练5.5 对猫狗图像进行2分类 6 最后 0 前言 &#…

从零学算法238

238.给你一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O(n) 时间复…