feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

Doc: move debugger mode topics to a separate folder

Browse Source 
Change-Id: I3cef398cabb8d8961507a6208076991c7f407ac6
Reviewed-on: http://codereview.qt-project.org/5607
Reviewed-by: Qt Sanity Bot <qt_sanity_bot@ovi.com>
Reviewed-by: Eike Ziller <eike.ziller@nokia.com>
Reviewed-by: Casper van Donderen <casper.vandonderen@nokia.com>
This commit is contained in:
Leena Miettinen
2011-09-27 11:52:34 +02:00
parent 5d1aad6991
commit 13818e22da
2 changed files with 1747 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1537
doc/src/debugger/creator-debugger.qdoc Normal file
View File

File diff suppressed because it is too large Load Diff

210
doc/src/debugger/qtquick-debugging.qdoc Normal file
View File

@@ -0,0 +1,210 @@
/****************************************************************************
**
** This file is part of Qt Creator
**
** Copyright (c) 2011 Nokia Corporation and/or its subsidiary(-ies).
**
** Contact: Nokia Corporation (info@qt.nokia.com)
**
**
** GNU Free Documentation License
**
** Alternatively, this file may be used under the terms of the GNU Free
** Documentation License version 1.3 as published by the Free Software
** Foundation and appearing in the file included in the packaging of this
** file.
**
** If you have questions regarding the use of this file, please contact
** Nokia at info@qt.nokia.com.
**
****************************************************************************/
// **********************************************************************
// NOTE: the sections are not ordered by their logical order to avoid
// reshuffling the file each time the index order changes (i.e., often).
// Run the fixnavi.pl script to adjust the links to the index order.
// **********************************************************************
/*!
\contentspage index.html
\previouspage creator-debugging-helpers.html
\page creator-debugging-qml.html
\nextpage creator-troubleshooting-debugging.html
\title Debugging Qt Quick Projects
\note You need Qt 4.7.1 or later to debug Qt Quick projects. Debugging
projects not created with the Qt Quick wizards is only supported with
Qt 4.8, or later.
To debug Qt Quick applications running on devices, you must install
Qt 4.7.4, or later, libraries on devices. To debug applications on Symbian
devices, you must install also QML Viewer on them.
\section1 Setting Up QML Debugging
The process of setting up debugging for Qt Quick projects depends on the
type of the project: Qt Quick UI or Qt Quick Application.
To debug Qt Quick UI projects:
\list 1
\o Select \gui Projects, and then select the \gui QML check box in the
\gui {Run Settings}, to enable QML debugging.
\o Compile the QML Inspector debugging helper. For more information,
see \l{Debugging Helpers for QML}.
\endlist
To debug Qt Quick Applications:
\list 1
\o Select \gui Projects, and then select the \gui {Link QML debugging
library} check box in \gui {Build Steps}.
You might have to compile the library first, by selecting the
\gui Compile link.
\image qml-link-debugging-library.png "Build Steps"
\note Debugging requires opening a socket at a well-known port,
which presents a security risk. Anyone on the Internet could connect
to the application that you are debugging and execute any JavaScript
functions. Therefore, you must make sure that the port is properly
protected by a firewall.
\o In the \gui {Run Settings}, select the \gui QML check box to enable
QML debugging.
\o Select \gui {Build > Rebuild Project} to clean and rebuild the
project.
\endlist
To debug Qt Quick Applications on devices, install Qt 4.7.4, or later,
libraries on devices. Then select the device as the target before you
start debugging.
\section1 Mixed C++/QML Debugging
To debug both the C++ and QML parts of your application at the same time,
select the checkboxes for both languages in the \gui{Run Settings}. However,
C++ breakpoints are be ignored until the debugger attaches also to the
QML engine.
\section1 Starting QML Debugging
To start the application, choose \gui {Debug > Start Debugging >
Start Debugging} or press \key F5. Once the application starts running, it
behaves and performs as usual. You can then perform the following tasks:
\list
\o Debug JavaScript functions
\o Preview QML changes at runtime
\o Inspect QML at runtime
\endlist
\section1 Debugging JavaScript Functions
You can use the \QC \gui Debug mode to inspect the state of your
application while debugging. You can interact with the debugger in several
ways, as described in the following sections:
\list
\o \l{Setting Breakpoints}
\o \l{Viewing Call Stack Trace}
\o \l{Locals and Expressions}
\endlist
\section1 Executing JavaScript Expressions
When the application is interrupted by a breakpoint, you can use the
\gui {QML Script Console} to execute JavaScript expressions in the current
context. To open it, choose \gui {Window > View > QML Script Console}.
\image qml-script-console.png "QML Script Console view"
You can type JavaScript expressions and use them to get information about
the state or your application. For example, property values.
You can see the current value of a property by hovering over it in the code
editor.
\section1 Applying QML Changes at Runtime
If you change property values or add properties in the code editor, the
changes are updated in the running application when you save them. If live
preview is not supported for an element, a message appears. Click
\gui Reload to preview the changes.
Reloading is enabled by default. To disable it, click
\inlineimage qml-observer-bar-reload.png "Apply Changes on Save button"
on the toolbar.
\section1 Inspecting QML at Runtime
While the application is running, you can use the \gui {QML Inspector} view
to explore the object structure, debug animations, and inspect colors.
To open the \gui {QML Inspector} view, choose \gui {Window > View >
QML Inspector}. The view shows the properties of the currently selected QML
element.
\image qml-observer-view.png "QML Inspector view"
When you debug complex applications, you can use the inspection
mode to jump to the position in code where an element is defined. You are
switched to the inspection mode, when you click the \gui Select, \gui Zoom,
or \gui {Color Picker} button
on the toolbar.
\image qml-observer-buttons.png "QML Inspector toolbar"
When the \gui Select tool is enabled, you can click elements in the running
application to jump to their definitions in the code. The properties of the
selected element are displayed in the \gui {QML Inspector} view. The element
hierarchy is displayed as a bread crumb path.
You can also right-click an element in the running application to view the
element hierarchy as a context menu.
\image qml-observer-context-menu.png "QML Inspector"
To switch to the zoom mode, click the \gui Zoom button. Click in the
running application to zoom in. Right-click to open a context menu that
contains zoom controls.
To inspect colors, click the \gui {Color Picker} button. You can also click
\inlineimage qml-observer-bar-copy-color.png "Copy Color button"
to copy the color definition to the clipboard.
To switch out of the inspection mode, deselect the \gui Select, \gui Zoom,
and \gui {Color Picker} button.
To move the application running in \QQV to the front, select the
\gui {Show Application on Top} button.
\section1 Debugging Animations
\image qml-observer.png
To play and pause animations in the running application, select the
\gui {Play/Pause Animations} button on the toolbar or \gui {Debugging >
Animations > Pause}, or press
\key {Ctrl+.}.
To change the speed at which animations are played, select a value in
\gui {Debugging > Animations} or click and hold down the
\gui {Play/Pause Animations} button to select a value.
*/