// 
//     Licensed to the Apache Software Foundation (ASF) under one
//     or more contributor license agreements.  See the NOTICE file
//     distributed with this work for additional information
//     regarding copyright ownership.  The ASF licenses this file
//     to you under the Apache License, Version 2.0 (the
//     "License"); you may not use this file except in compliance
//     with the License.  You may obtain a copy of the License at
// 
//       http://www.apache.org/licenses/LICENSE-2.0
// 
//     Unless required by applicable law or agreed to in writing,
//     software distributed under the License is distributed on an
//     "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
//     KIND, either express or implied.  See the License for the
//     specific language governing permissions and limitations
//     under the License.
//

= 使用 NetBeans IDE 中的可视调试器
:jbake-type: tutorial
:jbake-tags: tutorials 
:jbake-status: published
:icons: font
:syntax: true
:source-highlighter: pygments
:toc: left
:toc-title:
:description: 使用 NetBeans IDE 中的可视调试器 - Apache NetBeans
:keywords: Apache NetBeans, Tutorials, 使用 NetBeans IDE 中的可视调试器

本文档介绍了如何使用可视调试器来帮助您在 GUI 应用程序中找到并调试可视元素的代码。您可以在 Java 和 JavaFX GUI 应用程序中使用可视调试器。

在本文档中，您将使用可视调试器浏览 Anagram Game 样例项目。本文档将说明如何先生成应用程序的 GUI 快照，然后使用该快照找到源代码，将监听程序添加到事件中并查看 GUI 组件的事件日志。


image::images/netbeans-stamp-80-74-73.png[title="此页上的内容适用于 NetBeans IDE 7.2、7.3、7.4 和 8.0"]


*要学习本教程，您需要具备以下软件和资源。*

|===
|软件或资源 |要求的版本 

|link:https://netbeans.org/downloads/index.html[+NetBeans IDE+] |7.2, 7.3, 7.4, 8.0 

|link:http://www.oracle.com/technetwork/java/javase/downloads/index.html[+Java 开发工具包 (JDK)+] |版本 7 或 8 
|===

*JUnit 说明*。如果在安装 IDE 时未安装 JUnit 库，则当您尝试调试应用程序时，系统将提示您解决缺少资源问题并安装 JUnit。


== 生成 GUI 快照

在本教程中，您将使用 Anagram Game 样例应用程序，这是一种在新建项目向导中以样例形式提供的 Java 桌面应用程序，带有简单的 GUI。创建了项目后，可以启动调试会话，并生成应用程序的 GUI 快照。

1. 从主菜单中选择“文件”>“新建项目”（Ctrl-Shift-N 组合键；在 Mac 上为 ⌘-Shift-N 组合键）以打开新建项目向导。
2. 在“样例”> "Java" 类别中选择 "Anagram Game"。单击 "Next"（下一步）。
3. 指定项目的位置。单击 "Finish"（完成）。

单击 "Finish"（完成），此时 IDE 将创建项目并在 "Projects"（项目）窗口中打开该项目。


. 单击工具栏中的“调试”按钮（Ctrl-F5 组合键；在 Mac 上为 ⌘-F5 组合键）以启动调试会话。

或者，在“项目”窗口中右键单击项目节点，然后选择“调试”。

启动该会话时，IDE 将启动 Anagram Game 应用程序，并打开“调试”窗口。

有关运行调试器的更多信息，请参见_使用 NetBeans IDE 开发应用程序_中的link:http://www.oracle.com/pls/topic/lookup?ctx=nb8000&id=NBDAG798[+关于运行和调试 Java 应用程序项目+]。


. 从主菜单中选择“调试”>“生成 GUI 快照”。

选择“生成 GUI 快照”时，IDE 将生成 GUI 的快照，并在主窗口中打开该快照。

[.feature]
--
image::images/debug-fullscreen.png[role="left", link="images/debug-fullscreen.png"]
--

在本可视调试器指南中，您不会用到“调试”窗口。


== 使用可视调试器

GUI 快照是一种可帮助您找到 GUI 组件的源代码的可视调试工具。GUI 组件的源代码有时可能很难找到，不过快照可以让您根据 GUI 找到代码，而不用搜索代码。您可以在快照中选择组件并从弹出式菜单中调用任务，以便查看组件的源代码、显示监听程序，并在组件上设置断点。


=== 找到组件的源代码

本练习将说明如何使用 GUI 快照导航至源代码中声明并定义组件的行。在 GUI 快照中选择组件时，可以使用弹出式菜单调用各种命令。

命令还可以通过“导航器”窗口调用，方法是右键单击组件，然后在弹出式菜单中选择命令。

1. 在 GUI 快照中，选择 "Guess" 按钮。

在快照中选择组件时，IDE 会在 "Properties"（属性）窗口中显示有关选定组件的详细信息。如果 "Properties"（属性）窗口不可见，您可以从主菜单中选择 "Window"（窗口）> "Properties"（属性）以打开该窗口。

image::images/debug-snapshot.png[title="GUI 快照"]

IDE 还会在 "Navigator"（导航器）窗口的窗体分层结构中显示组件的位置。

image::images/debug-navigator.png[title="GUI 快照"]


. 在快照中右键单击 "Guess" 按钮，然后从弹出式菜单中选择“转至组件声明”。

选择 "Go to Component Declaration"（转至组件声明）时，IDE 将在编辑器中打开源文件，然后将光标移至代码中声明  ``guessButton``  的行。

image::images/debug-gotodeclaration.png[title="声明组件的代码行"]


. 在快照中再次右键单击 "Guess" 按钮，然后选择 "Go to Component Source"（转至组件源文件）。

选择 "Go to Component Source"（转至组件源文件）时，IDE 将在编辑器中打开源文件，然后将光标移至 JButton 组件源代码中的相应行。

image::images/debug-gotosource.png[title="组件的源代码行"]

可以使用 GUI 快照中的 "Go to Hierarchy Addition"（转至分层结构其他源文件）命令查找源代码中将组件添加到其容器的行。默认情况下禁用 "Go to Hierarchy Addition"（转至分层结构其他源文件）命令。您可以在 "Options"（选项）窗口中启用此命令。

1. 打开 "Options"（选项）窗口。
2. 单击 "Options"（选项）窗口中的 "Java" 类别下的 "Java Debugger"（Java 调试器）标签。

*注：*在 NetBeans IDE 7.1 中，"Java Debugger"（Java 调试器）标签位于 "Options"（选项）窗口中的 "Miscellaneous"（其他）类别下。


. 在类别列表中选择“可视调试”，然后选择*跟踪组件分层结构更改的位置*。单击 "OK"（确定）。


. 停止调试会话（如果正在运行）。

*注：*在 "Options"（选项）窗口中启用此命令后，需要重新启动调试会话并生成新的 GUI 快照，然后才能使用 "Go to Hierarchy Addition"（转至分层结构其他源文件）命令。


. 启动新的调试会话并生成 GUI 快照。


. 在 GUI 快照中右键单击组件，然后选择“转至分层结构其他源文件”。

IDE 将在编辑器中添加组件的行上打开源代码。

image::images/debug-hierarchy.png[title="将组件添加到容器中的源代码行"]


=== 浏览组件事件

本练习将演示如何使用 GUI 快照和 "Events"（事件）窗口浏览组件事件，便于您找到组件监听程序以及由组件触发的事件。

1. 在快照中右键单击 "Guess" 按钮，然后从弹出式菜单中选择 "Show Listeners"（显示监听程序）。

选择 "Show Listeners"（显示监听程序）时，IDE 将会打开 "Events"（事件）窗口。您可以看到 "Custom Listeners"（定制监听程序）节点已展开。

image::images/debug-customlisteners.png[title="将组件添加到容器中的源代码行"]


. 右键单击 "Custom Listeners"（定制监听程序）节点下方的 *com.toy.anagrams.ui.Anagrams$3*，然后在弹出式菜单中选择“转至组件源文件”。

源代码在编辑器中定义监听程序的行上打开。


. 在快照中选择空文本字段。

此外，也可以在“导航器”窗口中选择  ``guessedWord``  文本字段。

选择文本字段时，“事件”窗口中的项将会自动更改，以显示选定组件的监听程序。


. 在“事件”窗口中，双击 "Event Log"（事件日志）节点打开 "Select Listener"（选择监听程序）窗口。

此外，也可以右键单击 "Event Log"（事件日志）节点，然后从弹出式菜单中选择 "Set Logging Events"（设置日志记录事件）。


. 从对话框中选择  ``java.awt.event.KeyListener``  监听程序。单击 "OK"（确定）。
image::images/debug-select-listener.png[title="将组件添加到容器中的源代码行"]

此监听程序现在正在监听文本字段中的键盘事件。


. 在 Anagram Game 应用程序的文本字段中，键入一些字符。

在文本字段中键入字符时，将在事件日志中记录事件。如果展开 "Event Log"（事件日志）节点，您可以看到现在记录了每个击键。每次在 Anagram Game 应用程序文本字段中键入时，都会显示新事件。如果展开单个事件，例如  ``keyPressed`` ，日志中会显示该事件的属性。

image::images/debug-eventlog.png[title="将组件添加到容器中的源代码行"]

如果针对事件展开“调用自...”节点，您可以看到该事件的堆栈跟踪。

本教程简单介绍了 IDE 中的可视调试器。通过可视调试器，可以轻松找到 GUI 组件的源代码和日志事件。这在调试 GUI 应用程序时极其有用。


link:https://netbeans.org/about/contact_form.html?to=3&subject=Feedback:%20Using%20the%20Visual%20Debugger[+发送有关此教程的反馈意见+]


== 另请参见

有关在 NetBeans IDE 中开发和测试 Java 应用程序的更多信息，请参见以下资源：

* link:gui-functionality.html[+构建 Java GUI 应用程序简介+]
* 演示：link:debug-visual-screencast.html[+使用可视调试器+]
* 演示：link:debug-multithreaded-screencast.html[+调试多线程应用程序+]
* 演示：link:debug-stepinto-screencast.html[+NetBeans 调试器中的可视“步入”操作+]
* 演示：link:debug-deadlock-screencast.html[+使用 NetBeans 调试器进行死锁检测+]
* 演示：link:debug-evaluator-screencast.html[+在 NetBeans 调试器中使用代码片段计算器+]
* link:../../trails/java-se.html[+基本 IDE 和 Java 编程学习资源+]