Doc: Describe zooming in Form Editor

Fixes: QDS-3627
Change-Id: I6f5b59ee3c8d287a8342c4ffb7f47f10c4013b8c
Reviewed-by: Alessandro Portale <alessandro.portale@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

6 files changed, 30 insertions, 1 deletions

diff --git a/doc/qtcreator/images/icons/zoomAll.png b/doc/qtcreator/images/icons/zoomAll.png
new file mode 100644
index 00000000000..006012384dd
--- /dev/null
+++ b/doc/qtcreator/images/icons/zoomAll.png
diff --git a/doc/qtcreator/images/icons/zoomIn.png b/doc/qtcreator/images/icons/zoomIn.png
new file mode 100644
index 00000000000..8ffdf73f52a
--- /dev/null
+++ b/doc/qtcreator/images/icons/zoomIn.png
diff --git a/doc/qtcreator/images/icons/zoomOut.png b/doc/qtcreator/images/icons/zoomOut.png
new file mode 100644
index 00000000000..6d351071869
--- /dev/null
+++ b/doc/qtcreator/images/icons/zoomOut.png
diff --git a/doc/qtcreator/images/icons/zoomSelection.png b/doc/qtcreator/images/icons/zoomSelection.png
new file mode 100644
index 00000000000..06cf260833d
--- /dev/null
+++ b/doc/qtcreator/images/icons/zoomSelection.png
diff --git a/doc/qtcreator/images/qmldesigner-zooming.gif b/doc/qtcreator/images/qmldesigner-zooming.gif
new file mode 100644
index 00000000000..d8d5beb6b3a
--- /dev/null
+++ b/doc/qtcreator/images/qmldesigner-zooming.gif
diff --git a/doc/qtcreator/src/qtquick/qtquick-form-editor.qdoc b/doc/qtcreator/src/qtquick/qtquick-form-editor.qdoc
index c7efa1ef8ef..16ba6e830d9 100644
--- a/doc/qtcreator/src/qtquick/qtquick-form-editor.qdoc
+++ b/doc/qtcreator/src/qtquick/qtquick-form-editor.qdoc
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2020 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the Qt Creator documentation.
@@ -76,6 +76,35 @@
     \uicontrol Properties view. There, you can also enter the value
     of the \uicontrol Rotation property in degrees.
 
+    \section1 Zooming
+
+    You can use the zoom buttons on the toolbar to zoom into and out of
+    \uicontrol {Form Editor} or select the zoom level as a percentage
+    from a list. More buttons are availabe for zooming to fit all content
+    in the view or zooming to fit the currently selected components.
+
+    \image qmldesigner-zooming.gif "Zooming in Form Editor"
+
+    The following table lists the zoom buttons:
+
+    \table
+    \header
+        \li Icon
+        \li Tooltip
+    \row
+        \li \inlineimage icons/zoomIn.png
+        \li Zoom in
+    \row
+        \li \inlineimage icons/zoomOut.png
+        \li Zoom out
+    \row
+        \li \inlineimage icons/zoomAll.png
+        \li Zoom to fit all content
+    \row
+        \li \inlineimage icons/zoomSelection.png
+        \li Zoom to fit the current selection
+    \endtable
+
     \section1 Snapping to Parent and Sibling Items
 
     When you are working on a design, you can use snapping to align