1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
/****************************************************************************
**
** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies).
** All rights reserved.
** Contact: Nokia Corporation (qt-info@nokia.com)
**
** This file is part of the documentation of the Qt Toolkit.
**
** $QT_BEGIN_LICENSE:LGPL$
** No Commercial Usage
** This file contains pre-release code and may not be distributed.
** You may use this file in accordance with the terms and conditions
** contained in the Technology Preview License Agreement accompanying
** this package.
**
** GNU Lesser General Public License Usage
** Alternatively, this file may be used under the terms of the GNU Lesser
** General Public License version 2.1 as published by the Free Software
** Foundation and appearing in the file LICENSE.LGPL included in the
** packaging of this file. Please review the following information to
** ensure the GNU Lesser General Public License version 2.1 requirements
** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
**
** In addition, as a special exception, Nokia gives you certain additional
** rights. These rights are described in the Nokia Qt LGPL Exception
** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
**
** If you have questions regarding the use of this file, please contact
** Nokia at qt-info@nokia.com.
**
**
**
**
**
**
**
**
** $QT_END_LICENSE$
**
****************************************************************************/
/*!
\page qmldebugging.html
\title Debugging QML
\section1 Logging
\c console.log can be used to print debugging information to the console. For example:
\qml
Rectangle {
width: 200; height: 200
MouseArea {
anchors.fill: parent
onClicked: console.log("clicked")
}
}
\endqml
\section1 Debugging Transitions
When a transition doesn't look quite right, it can be helpful to view it in slow
motion to see what is happening more clearly. \l {qmlviewer} provides a
"Slow Down Animations" menu option to facilitate this.
\section1 The QML Inspector
The \c qmldebugger tool provides an experimental inspector to aid with debugging.
It can be run as a Qt Creator plugin or as a standalone application.
\section2 Qt Creator plugin
The Qt Creator plugin currently builds against Qt Creator 1.3.
To build the Qt Creator plugin:
\list
\o Set an environment variable \c CREATOR_SRC_DIR that points to the Qt Creator
source directory
\o Set an environment variable \c CREATOR_BUILD_DIR that points to the Qt Creator
build directory
\o Run \c qmake on \c $QTDIR/tools/qmldebugger/qmldebugger.pro
\endlist
This builds the plugin into your Qt Creator installation.
The plugin adds a "QML Inspect" mode into Qt Creator that provides:
\list
\o An object tree showing all objects and their children
\o The current property values for the object selected in the object tree
(this table is dynamically updated for all properties that have property changed
notifications)
\o An expression evaluator for querying and setting values dynamically
\o A table of watched properties (double-click on a property in the property
table to add it to the watch table)
\o A graph that shows the frame rate of your application
\endlist
To start the debugger, open a QML project and click the "QML Inspect" mode, then click the green
"play" button in the toolbar of the bottom-right debugger window.
\image qmldebugger-creator.png
\section2 Standalone qmldebugger tool
To run the standalone \c qmldebugger tool, set an environment variable \c QML_DEBUG_SERVER_PORT
to an available port number and run the \c qmlviewer. For example:
\code
QML_DEBUG_SERVER_PORT=3768 qmlviewer myqmlfile.qml
\endcode
Then in another process, start the \c qmldebugger tool, enter the port number into the corresponding spinbox
in the top right hand corner, and press the "Connect" button.
*/
|
