Doc: make grabToImage example snippet more useful

The example doesn't work as is (when run with the qml binary) because
by the time Component.onCompleted is called, there might not be a window
yet.

Use a key press handler instead (which then needs focus to be set).

Fixes: QTBUG-113312
Change-Id: I2986334aca4ca670e206ceadf1093a87aa304e8e
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
Reviewed-by: Oliver Eftevaag <oliver.eftevaag@qt.io>

1 files changed, 3 insertions, 2 deletions

diff --git a/src/quick/doc/snippets/qml/item/itemGrab.qml b/src/quick/doc/snippets/qml/item/itemGrab.qml
index ef4430175a..f4a5b0ba15 100644
--- a/src/quick/doc/snippets/qml/item/itemGrab.qml
+++ b/src/quick/doc/snippets/qml/item/itemGrab.qml
@@ -12,12 +12,13 @@ Rectangle {
     id: sourceRectangle
     width: 100
     height: 100
+    focus: true
     gradient: Gradient {
         GradientStop { position: 0; color: "steelblue" }
         GradientStop { position: 1; color: "black" }
     }
 
-    Component.onCompleted: {
+    Keys.onSpacePressed: {
         sourceRectangle.grabToImage(function(result) {
            result.saveToFile("something.png")
         })
@@ -30,7 +31,7 @@ Image {
     id: image
 }
 
-Component.onCompleted: {
+Keys.onSpacePressed: {
     sourceRectangle.grabToImage(function(result) {
         image.source = result.url
     }, Qt.size(50, 50))