Commit 384d6661 authored by Leena Miettinen's avatar Leena Miettinen Committed by Riitta-Leena Miettinen

Doc: Update info about Qt Quick debugging

Update, add, and remove screenshots.

Change-Id: Id5e77b1ebba4306f28e2d6d20e6ed5ffac0d2e52
Reviewed-by: Ulf Hermann's avatarUlf Hermann <ulf.hermann@qt.io>
parent 18e1dbed
doc/images/qml-observer-view.png

25.8 KB | W: | H:

doc/images/qml-observer-view.png

10.8 KB | W: | H:

doc/images/qml-observer-view.png
doc/images/qml-observer-view.png
doc/images/qml-observer-view.png
doc/images/qml-observer-view.png
  • 2-up
  • Swipe
  • Onion skin
doc/images/qtquick-example-stack.png

83.5 KB | W: | H:

doc/images/qtquick-example-stack.png

29.3 KB | W: | H:

doc/images/qtquick-example-stack.png
doc/images/qtquick-example-stack.png
doc/images/qtquick-example-stack.png
doc/images/qtquick-example-stack.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -63,8 +63,10 @@
\li Select \uicontrol {Debug > Start Debugging > Start Debugging} or press
\key{F5}.
\li Once the Same Game application starts, click the \uicontrol {New Game}
button to start a new game.
\li Once the Same Game application starts, select \uicontrol {1 Player}
to start a new game.
\image samegame.png
\li When the debugger hits the breakpoint, it interrupts the
application. \QC displays the nested function calls leading to the
......@@ -93,10 +95,7 @@
\li To execute JavaScript commands in the current context, open the
\uicontrol {Debugger Console} output pane.
\li To change the score to 1000, enter \c{gameCanvas.score = 1000}
in the console.
\image qtquick-example-script-console.png
\image qml-script-console.png
\li To remove a breakpoint, right-click it and select
\uicontrol {Delete Breakpoint}.
......@@ -106,25 +105,16 @@
\image qtquick-example-qml-inspector.png
\li Click
\inlineimage qml-inspector-app-on-top.png
(\uicontrol {Show Application on Top}) to keep the application visible
while you interact with the debugger.
\li Click
\inlineimage qml-inspector-select-button.png
(\uicontrol Select) to activate selection mode and then click the
\uicontrol {Quit} button to move into the \uicontrol ButtonLabel component
in the \uicontrol {Locals and Expressions} and the code editor.
\li In the \uicontrol {Locals and Expressions} view, double-click the value of
the \c text property to change it temporarily from \uicontrol {Quit} to
\uicontrol {End Game}.
\li Select \uicontrol Debug > \uicontrol {Show Application on Top} to
keep the application visible while you interact with the debugger.
\image qtquick-example-property-values.png
\li Select \uicontrol Debug > \uicontrol Select to activate selection
mode and then click the \uicontrol Menu button to move into the
\uicontrol menuButton component in the
\uicontrol {Locals and Expressions} view and the code editor.
When you select an element, the cursor moves to it in the code
editor, where you can change the value permanently.
\li In the \uicontrol {Locals and Expressions} view, double-click the
value of a property to change it.
\endlist
......
......@@ -186,9 +186,8 @@
\image qml-observer-view.png "QML item tree"
To keep the application visible while you interact with the debugger, click
\inlineimage qml-inspector-app-on-top.png
(\uicontrol {Show Application on Top}).
To keep the application visible while you interact with the debugger, select
\uicontrol Debug > \uicontrol {Show Application on Top}.
You can view a QML item in \uicontrol {Locals and Expressions} in the following
ways:
......@@ -199,10 +198,8 @@
\li Select the item in the code editor.
\li Click
\inlineimage qml-inspector-select-button.png
(\uicontrol Select) to activate selection mode and then click an item
in the running application.
\li Select \uicontrol Debug > \uicontrol Select to activate selection
mode and then click an item in the running application.
\endlist
......@@ -215,7 +212,7 @@
When you debug complex applications, you can jump to the position in code
where an item is defined or you can zoom into the user interface.
When the \uicontrol Select tool is enabled, you can click items in the running
In the selection mode, you can click items in the running
application to jump to their definitions in the code. The properties of the
selected item are displayed in the \uicontrol {Locals and Expressions} view.
......@@ -234,14 +231,9 @@
\endlist
To switch to the zoom mode, click the \uicontrol Zoom button. Click in the
running application to zoom in. Right-click to open a context menu that
contains zoom controls.
To switch out of the selection mode, toggle the \uicontrol Select menu item.
To switch out of the selection or zoom mode, deselect the \uicontrol Select or
\uicontrol Zoom button.
To move the application running in \QQV to the front, select the
\uicontrol {Show Application on Top} button.
To move the application running in \QQV to the front, select
\uicontrol Debug > \uicontrol {Show Application on Top}.
*/
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment