diff --git a/doc/images/qml-link-debugging-library.png b/doc/images/qml-link-debugging-library.png index cdeb8c7c69a..a6f11db9389 100644 Binary files a/doc/images/qml-link-debugging-library.png and b/doc/images/qml-link-debugging-library.png differ diff --git a/doc/images/qml-observer-view.png b/doc/images/qml-observer-view.png index 923ccf7308d..f75187ecfca 100644 Binary files a/doc/images/qml-observer-view.png and b/doc/images/qml-observer-view.png differ diff --git a/doc/images/qtquick-example-property-values.png b/doc/images/qtquick-example-property-values.png deleted file mode 100644 index dadebbbf412..00000000000 Binary files a/doc/images/qtquick-example-property-values.png and /dev/null differ diff --git a/doc/images/qtquick-example-qml-inspector.png b/doc/images/qtquick-example-qml-inspector.png index e85a0766d6c..1f54b49ffb0 100644 Binary files a/doc/images/qtquick-example-qml-inspector.png and b/doc/images/qtquick-example-qml-inspector.png differ diff --git a/doc/images/qtquick-example-script-console.png b/doc/images/qtquick-example-script-console.png deleted file mode 100644 index 1a43cef9a4e..00000000000 Binary files a/doc/images/qtquick-example-script-console.png and /dev/null differ diff --git a/doc/images/qtquick-example-setting-breakpoint1.png b/doc/images/qtquick-example-setting-breakpoint1.png index cf447f15f2c..ae3a112f4a7 100644 Binary files a/doc/images/qtquick-example-setting-breakpoint1.png and b/doc/images/qtquick-example-setting-breakpoint1.png differ diff --git a/doc/images/qtquick-example-setting-breakpoint2.png b/doc/images/qtquick-example-setting-breakpoint2.png index db174cf5119..0294e01ba10 100644 Binary files a/doc/images/qtquick-example-setting-breakpoint2.png and b/doc/images/qtquick-example-setting-breakpoint2.png differ diff --git a/doc/images/qtquick-example-setting-breakpoint3.png b/doc/images/qtquick-example-setting-breakpoint3.png index 4942554ec21..fbe700f7e2c 100644 Binary files a/doc/images/qtquick-example-setting-breakpoint3.png and b/doc/images/qtquick-example-setting-breakpoint3.png differ diff --git a/doc/images/qtquick-example-stack.png b/doc/images/qtquick-example-stack.png index d57666648e8..366485a951a 100644 Binary files a/doc/images/qtquick-example-stack.png and b/doc/images/qtquick-example-stack.png differ diff --git a/doc/images/samegame.png b/doc/images/samegame.png new file mode 100644 index 00000000000..faebd518deb Binary files /dev/null and b/doc/images/samegame.png differ diff --git a/doc/src/debugger/qtquick-debugger-example.qdoc b/doc/src/debugger/qtquick-debugger-example.qdoc index c133e3445fc..b565a25af5e 100644 --- a/doc/src/debugger/qtquick-debugger-example.qdoc +++ b/doc/src/debugger/qtquick-debugger-example.qdoc @@ -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 Select \uicontrol Debug > \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 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. - \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}. - - \image qtquick-example-property-values.png - - 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 diff --git a/doc/src/debugger/qtquick-debugging.qdoc b/doc/src/debugger/qtquick-debugging.qdoc index 3667582c037..d11f5a439b5 100644 --- a/doc/src/debugger/qtquick-debugging.qdoc +++ b/doc/src/debugger/qtquick-debugging.qdoc @@ -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}. */