事件可视化跟踪执行在线视频

今天，我们的主要内容是事件的可视化调试

在上周的课程中，我们采用Python在线学习助手来调试程序

而本周呢，我们将使用PyCharm的调试功能

这个主要是有两方面的原因

一个是Python在线学习助手暂时还不支持SimpleGUITK这个模块

而本周的项目中我们已经使用了按钮，输入框等

他们的是用都必须导入SimpleGUITK这个模块

另外的一个原因是PyCharm的调试功能也非常的强大

我们在开发项目的过程中一边写程序，一边调试是非常方便的

所以我们有必要的去了解下PyCharm的调试功能，现在开始我们的课程

这个例子，是实现了一个简单的计算器

在前面的课程中，我们已经学过了，相信大家一定都不陌生

那我先运行一下，看一下，运行，我显示一下

我发现，有两个数，一个是10 一个是5，是吧?

然后呢，我进行下交换，他们两个就交换了位置Store变成了5，Operand变成了10

进行了加法之后呢他们俩是进行了5和10的相加，存储到了Store里面去

原来的5，Operand的也是，还是10，这没有问题

那我今天，主要是要用调试的方法来理解下计算器的程序

在我们PyCharm里面，想要打开调试功能

一个呢就是在PyCharm的右侧，大家把鼠标放在

这个绿色的小甲虫的按钮上面，就会出现，调试这个程序，调试

然后呢，还有一个就是点击运行，点击运行之后呢

下面就有一个还是像这样的第二个菜单，调试

这个，我计算器的程序，下面还有一个Debug

大家可以去试，也是进行调试的

好，那我还有一种方式就是，右键，点击调试

也可以进行程序调试，程序运行之前呢必须加上断点

而断点呢是程序执行到某个点停下来，等着你去一步一步去执行

而不是立即执行完之后出结果

嗯…比如说我前面，我点击了，交换的这个按钮之后

交换函数就已经全部执行完了，结果也输出在我的控制台

还比如说我点击了加法的按钮，然后呢

加法的操作就已经执行结束了，然后呢结果会显示在我的控制台上来

如果加了断点，程序就会停下来，不会执行完

而是等着我一步一步的执行，我们到时候会给大家演示啊

加断点的方式也很简单啦，就是我们的代码行

如果我要在这一行加断点，就在这个地方左键点击一下

就有一个红色的圆出现了，对吧

表明这是一个断点，然后在这一行代码同时也红色高亮显示了

这是一种方式，还有一种方式

就是，比如说我要在这加，光标点击在行的开头，点击我的运行

点击运行，有一个设置行断点，第二种方式

我还要在这个地方，减法这个地方加一个断点

然后我就采用右键点击的方式吧，调试我的计算器程序

你看它现在控制台显示呢，调试器已经启动了，是吧

Pydev就是我们的调试器，已经启动了，我点击调试器

大家看调试的时候呢，下面的窗口就分成了几个部分

左侧是一个菜单栏，这里是我的框架，指的是我的程序

主要的一些执行流程，这是我的一些程序在执行过程中

一些局部变量值的显示区域，这是我监视区域，主要是全局变量的监视

比如说这个里面大家已经知道，我的Store是一个全局变量

把它放在这，还有我的Operand也是一个全局变量，是吧

把它放在这，好，我点击调试之后呢？大家看，状态是这样的这些菜单呢

还不可用，对吧，好，我先来进行一下交换，点击交换

大家发现什么问题没有，我的19行代码高亮显示

是吧，蓝色的高亮显示，表明程序正要执行这一行

但是，还没有执行，对不对，而我的Store它还是初始值

Store是10 ，Operand是5 ，它还没有进行swap这个函数的功能

在我的框架这一侧，大家看到，这一行同样也告诉我是swap函数

然后呢是这个文件的第19行代码，跟它是同步的啊

那程序呢流程就已经到这个地方去了，对不对

然后还有在介绍下这个上面的这几个菜单，第一个显示执行点

我现在有三个断点对吧，执行点就是断点，我点击一下

它立马就给我显示出了我三个断点对不对，然后呢这个是单步执行

单步跳过，相当于我键盘上的F8按钮，单步跳过的意思是

我执行完19行继续执行第20行，再继续

如果下面还有的话就执行21行，往下执行，在这个函数里面

然后这一个单步执行，这个是单步跳过对吧，这个是单步执行

单步执行的意思到时候会给大家演示下，就是output是另外的一个函数

如果我点击单步执行的话，它会进入到这个函数里面

如果我点击单步跳过的话，它不会进入到这个函数的里面

而是一次性把这个函数给执行完，显示结果

这个是强制进入，强制单步执行，这个是步出

就是我正在执行这个函数的时候，比如说，执行到这

突然间，我不想继续往下走了，我要跳出这个函数

我就会点击步出，这个呢是运行到光标处

比如说我的鼠标在这，当我点击，鼠标放在这

然后点击这个按钮的时候呢就会执行到这步去

这个是什么？计算表达式，我给大家先演示一下

如果我的表达式，我要是，因为我的加法不是Store加Operand是吧

好，开始计算，它说结果是15，虽然我这一行还没有执行

但是当我计算表达式的时候，因为Store和Operand已经有值了

所以它会把我表达式的值给计算出来，如果大家遇到比较复杂的数学计算公式

你就可以把它写到这个地方来

可以直接看到它的结果，检查它的结果对还是不对

当然这个你可以点，点击片段显示的时候，他就告诉你执行的是这一行

然后结果是它，这个是非常非常有用的啊

尤其是大家在做一些复杂的计算的时候，非常有用

好，我先把它给关掉

左侧的按钮这些按钮我给大家解释一下吧

重新运行，重新运行调试器，就是在你运行的过程想再次运行

这个呢，是继续执行，就执行到下一个执行点或者是断点处

这个是停止调试，这个是查看断点

点击，查看断点，你看他就反显示什么呀

是这个，对不对，然后点击19

它19行就可以看到你的断点是放在什么地方的啊，把它也关掉

这个按钮，就是查看断点这个按钮，就比较适合断点比较多的情况下

你看，这个是其它文件里面的，它也显示出来了

它就是把工程文件里面所有的断点都会显示出来

那当你在断点比较多的情况下，你就可以看一下

你到底在什么地方都加了断点，下面就不给大家介绍了

我们在后面大家自己学习的时候可以去尝试一下每个按钮的具体功能

尝试过了之后，如果你有什么问题，可以在我们的论坛上进行提问

好，那我就点击下一步了，刚才我说过单步跳过，就是要执行第20 步

我点击，因为我刚才是点击了这个按钮，大家再看，回到这边

回到这边，发现我交换这个呢是高亮显示了，对不对

就是交换按钮对应的事件处理函数

刚才点击了执行下一步之后呢，它们两个的值发生了交换

Store变成了5，Operand是10，这跟我们初始情况是不一样

说明它俩已经发生了变化，现在呢

我刚才讲过output是一个函数，如果我点击进入的话

它就会跳到这个函数里面去，那我点击一下

我先看下控制台，没有任何输出啊

好，我点击进入，跳进去了没有，它已经到了第11行

就是我output这个函数的第一行代码

我执行下一步，控制台肯定已经输出了Store等于几了？

看Store等于5，再回来，回来，当然我也可以进到这个里面去

单步执行进到我print函数里面去啊，现在我就不进了

然后我再单步跳过，这个函数是不就执行完了

执行完了，然后我点击这个，点击它之后呢

控制台已经输出了交换后的数据了，是吧

这个其实我们把它叫做按钮事件吧

就是你点击按钮之后，它就会执行到按钮对应的事件处理函数

好现在，一个是10（一个是5），一个是10

我再点下加法，好，到调试器，你看一个是5 ，一个是10

下一步，这次我直接就点这个按钮执行

看，没有进到这个函数里面去吧

因为，我没有点击直接进入，那我的加法，看到没有？

Store呢是15，就是5和10 加完之后的值放在Store里面去

而我的Operand呢？仍然是10

在来尝试一个吧，点击减法，它肯定会跳到我减法的事件处理函数处

点击减法，15-10的结果因该是5 ，对吧？

好，调试器，看它是10

下一步，Store变成了5，我再点击这个按钮

看是不是Operand还是10 ？

Store已经是5了，调试器回来，这个呢

就是我们通过调试的方式可以去看一下它的处理流程是什么样的

当然呢大家一步一步调试程序的时候，也是非常清楚的啊

然后在这个计算器的程序里面呢，这节课给它加了一个输入框

下面我们会介绍到先给它加上，我输入一个5

敲回车键，我按Enter键了

敲回车键之后，大家发现，看一下我们的控制台会有什么情况呢？

看来是Store还是5，但我的Operand是变成了5了，对吧？

说明，输入5 ，在敲回车键的时候

调用了这个输入框的一个事件处理函数，使得这个操作数变成了5

对不对？我下面看一下，我这个，看一下，我再点击回车

给它加了一个断点，你的断点是随时可以加入的

比如说你现在不想调试它了，你可以把它去掉

然后你想调试它，你就可以把它加上

在到这边调试器来，因为我Store是5，我下一步

看我的Operand现在变成了5 是吧？

我不进去，我直接输出，好，我再进行一个加法

加法运算，当前它们俩都是5是吧，下一步

一个是10 ，一个是5了，对吧

因为5+5是10 嘛，好我再继续执行完

那这个呢？调试的方法就给大家讲到这里

通过调试，我们可以动态的查看变量的值和它到底是怎样变化的？

然后我们还可以在这个框架窗口看程序的执行流程是什么样的

当然我把它先停掉了

好了，那我们今天的课程就上到这里，我们下次课再见