Doc: Update info about basic and text properties

- Move information around to fit the new sections in the
  Properties view
- Add screenshot
- Describe new fields
- Fix changed field names

Task-number: QDS-4561
Change-Id: Ia4ded8d7f7c6358e050fee8d92c5eebb5ff0d65c
Reviewed-by: Johanna Vanhatapio <johanna.vanhatapio@qt.io>

doc/qtcreator/src/qtquick/creator-only/creator-mobile-app-tutorial.qdoc

@@ -114,7 +114,7 @@
 
             \image qtquick-mobile-app-tutorial-image.png "Image file in different views"
 
-        \li Select the \inlineimage export_unchecked.png
+        \li Select the \inlineimage icons/alias.png
             (\uicontrol Export) button in \uicontrol Navigator to export
             \e mainWindow and \e bubble as properties.
 

doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc

@@ -54,7 +54,7 @@
     {Item} component. Even though it has no visual appearance itself (similarly
     to a mouse area, for example), it defines all the properties that are
     common across visual components, such as position, size, and visibility. For
-    more information, see \l{Specifying Basic Component Properties}.
+    more information, see \l{Basic Component Properties}.
 
     In addition, each component has a set of properties that specify its visual
     appearance and behavior. You can modify the property values to set fill

doc/qtcreator/src/qtquick/library/qtquick-text.qdoc

@@ -32,9 +32,9 @@
 
     You can use several different text components to add read-only or editable
     text to a UI, such as titles or labels and text input fields with
-    placeholder text. The \l Text component adds formatted text, the \l TextEdit
-    component adds a multiline line edit, and the \l TextInput component adds a
-    single editable line field.
+    placeholder text. The \uicontrol Text component adds formatted text, the
+    \uicontrol {Text Edit} component adds a multiline line edit, and the
+    \uicontrol {Text Input} component adds a single editable line field.
 
     You can select the font to use and specify extensive properties for each
     text string, such as size in points or pixels, style name, emphasis,
@@ -44,15 +44,19 @@
 
     \youtube yOUdg1o2KJM
 
-    To create a label with a background, use the \l Label component from the
-    Qt Quick Controls module.
+    To create a label with a background, use the \uicontrol Label
+    component available in \l Library > \uicontrol Components >
+    \uicontrol {Qt Quick Controls}. The module also contains components
+    for creating \uicontrol {Text Field} and \uicontrol {Text Area} controls.
+    They differ from the basic components in that a common style is applied
+    to them and that you can specify placeholder text for them.
 
     \section1 Using Rich Text
 
-    You can use rich text in the \l Text and \l TextInput components. To
-    open the rich text editor, select the \inlineimage icons/edit.png
-    (\uicontrol Edit) button next to the \uicontrol Text field in
-    \uicontrol Properties.
+    You can use rich text in the \uicontrol Text and \uicontrol {Text Input}
+    components. To open the rich text editor, select the \inlineimage icons/edit.png
+    (\uicontrol Edit) button in \uicontrol Properties > \uicontrol Character
+    > \uicontrol Text.
 
     \image qtquick-text-rtf.gif "Editing text in the rich text editor"
 
@@ -71,15 +75,48 @@
 
     \image qtquick-rtf-editor.png "Text formatted as rich text in the editor"
 
-    \section1 Typography
+    \section1 Marking Strings for Translation
 
-    For each string that you enter in the \uicontrol Text field, you can
-    select the font to use in the \uicontrol Font field and specify the
-    size, emphasis, aligment, and spacing of the text. Specify the font
-    size in either points or pixels in the \uicontrol Size field.
+    To support translators, mark the strings that should be translated.
+    In \uicontrol Properties > \uicontrol Character > \uicontrol Text, select
+    \uicontrol tr.
 
-    \image qtquick-designer-text-properties.png "Text component general properties"
-    \image qtquick-designer-properties-font.png "Text component font properties"
+    \image qmldesigner-text-property-tr.png "tr button in Character section"
+
+    By default, the text string is enclosed in a \c qsTr() call.
+
+    \image qml-translate.png "Text marked for translation"
+
+    If you use text IDs instead of plain text, change the default call to
+    \c qsTrId(). Select \uicontrol Tools > \uicontrol Options >
+    \uicontrol {Qt Quick} > \uicontrol {Qt Quick Designer}, and then select the
+    \uicontrol {qsTrId()} radio button in the \uicontrol Internationalization
+    group. For more information about text ID based translations, see
+    \l {Qt Linguist Manual: Text ID Based Translations}.
+
+    To preserve the context when editing the text or to change the context
+    by setting a binding on the text property, change the default call to
+    \c qsTranslate() by selecting the \uicontrol {qsTranslate()} radio button.
+
+    For more information, see
+    \l {Internationalization and Localization with Qt Quick}.
+
+    \if defined(qtcreator)
+    When you \l{Creating Qt Quick Projects}{create a new project}, you can
+    automatically generate a translation source file (TS) for one language.
+    You can add other languages later by editing the project file.
+    \endif
+
+    \section1 Character Properties
+
+    You can set font properties in the \uicontrol Character section
+    in \uicontrol Properties. For each string that you enter in the
+    \uicontrol Text field, you can select the font to use in the
+    \uicontrol Font field and specify the size, emphasis, aligment,
+    and spacing of the text. Specify the font size in either points
+    or pixels in the \uicontrol Size field.
+
+    \image qtquick-designer-text-properties.png "Character properties"
 
     To display custom fonts in the list of available fonts in the
     \uicontrol Font field, you need to first add them to \l Library:
@@ -94,23 +131,27 @@
         \li Select \uicontrol OK.
     \endlist
 
-    You can use the buttons in the \uicontrol {Font style} group to emphasize
+    In the \uicontrol Weight field, you can select the font weight from a
+    list of predefined values that range between extra-light and extra-bold.
+    You can also use the buttons in the \uicontrol Emphasis group to format
     text by making it bold, italic, underlined, or strikethrough.
 
-    Alternatively, select a font variant to use in the \uicontrol {Style name}
-    field, such as \uicontrol Regular or \uicontrol Bold.
+    If you set a style name in the \uicontrol {Style name} field, the font is
+    matched against the style name instead of the values set in the
+    \uicontrol Weight and \uicontrol Emphasis fields.
 
-    The value of the \uicontrol Word field in the \uicontrol Spacing group
-    changes the default spacing between individual words, whereas the value
-    of the \uicontrol Letter field changes the spacing between individual
+    The value of the \uicontrol {Word spacing} field changes the default
+    spacing between individual words, whereas the value of the
+    \uicontrol {Letter spacing} field changes the spacing between individual
     letters in a word. A positive value increases the spacing by a
     corresponding amount of pixels, while a negative value decreases it.
 
     The value of the \uicontrol {Line height} field sets the line height
-    for the text. In the \uicontrol {Line height mode} field, select
-    \uicontrol FixedHeight to set the line height in pixels or
-    \uicontrol ProportionalHeight (default) to set the spacing proportionally
-    to the line (as a multiplier). For example, set to 2 for double spacing.
+    for the text. In the \uicontrol {Line height mode} field in the
+    \uicontrol {Text Extras} section, select \uicontrol FixedHeight to set
+    the line height in pixels or \uicontrol ProportionalHeight (default)
+    to set the spacing proportionally to the line (as a multiplier).
+    For example, set to 2 for double spacing.
 
     \section1 Text Alignment
 
@@ -134,16 +175,14 @@
     You can set the color of the text itself and a secondary color used by
     text styles.
 
-    The color that you pick in the \uicontrol {Style color} field is used as
-    the outline color for outlined text, and as the shadow color for raised
-    or sunken text. You set the font style in the \uicontrol Style field of
-    the \uicontrol Font section.
-
     For the \uicontrol {Text Edit} and \uicontrol {Text Input} components, you
     can also set the color of selected text and the text highlight color
     that is used behind selections in the \uicontrol {Selected text color}
     and \uicontrol {Selection color} fields.
 
+    For the \uicontrol {Text Field} and \uicontrol {Text Area} controls, you
+    can also set the color of the \l{Placeholder Text}{placeholder text}.
+
     For more information about selecting colors, see \l{Picking Colors}. You
     can only set solid colors for text components.
 
@@ -152,18 +191,25 @@
     The height and width of a text component are determined automatically depending
     on the values of the properties you set, to accommodate the length of the
     string that you specify in the \uicontrol Text field and the font size, for
-    example.
+    example. You can specify additional properties for formatting text in the
+    \uicontrol {Text Extras} section.
+
+    \image qtquick-properties-text-extras.png "Text Extras section"
+
+    The value of the \uicontrol {Size mode} field specifies how the font
+    size of the displayed text is determined. Select \uicontrol FixedSize
+    to use the size specified in the \uicontrol Size field in the
+    \uicontrol Character section in pixels or points.
 
-    The value of the \uicontrol {Font size mode} field specifies how the font
-    size of the displayed text is determined. Select \uicontrol FixedSize to
-    use the size specified in the \uicontrol Size field in pixels or points.
     Select \uicontrol HorizontalFit or \uicontrol VerticalFit to use the largest
     size up to the size specified that fits the width or height of the component.
     Select \uicontrol Fit to use the largest size up to the size specified that
     fits within the width and height of the component. The font size of fitted text
-    has a minimum bound specified by the \uicontrol {Minimum size} field and
+    has a minimum bound specified by the \uicontrol {Min size} field and
     maximum bound specified by the \uicontrol Size field.
 
+    \section3 Wrapping and Eliding Text
+
     In the \uicontrol {Wrap mode} field, you can wrap the text to the text
     component's width. The text will only wrap if you set an explicit width for
     the text component. By default, text is not wrapped. Select \uicontrol WordWrap
@@ -174,7 +220,7 @@
 
     You can use the \uicontrol Elide property with the \uicontrol Wrap
     option to fit a single line of plain text to a set width. Select
-    \uicontrol ElideRight, and set the \uicontrol {Maximum line count}
+    \uicontrol ElideRight, and set the \uicontrol {Max line count}
     or the text component height (in the \uicontrol H field). If you set both,
     the maximum line count will apply unless the lines do not fit in the
     height allowed.
@@ -186,18 +232,7 @@
     Multi-length strings are ordered from longest to shortest, separated by the
     Unicode \e {String Terminator} character \c U009C.
 
-    \section1 Advanced Font Properties
-
-    In the \uicontrol {Font weight} field, you can select the font weight from
-    list predefined values that range between extra-light and extra-bold.
-
-    In the \uicontrol {Font capitalization} field, select \uicontrol MixedCase
-    for normal text rendering where no capitalization changes are applied. You
-    can also set the text in all upper or lower case, or use small caps. The
-    \uicontrol Capitalize option renders the first character of each word as an
-    uppercase character.
-
-    \section1 Developer Text Properties
+    \section3 Formatting Text
 
     Text can be either in plain text or rich text format, depending on the
     value you set in the \uicontrol Format field. If you select
@@ -206,6 +241,8 @@
     described on the \l {Supported HTML Subset}. Note that plain text offers
     better performance than rich text.
 
+    \section3 Rendering Text
+
     In the \uicontrol {Render type} field, you can override the default
     rendering type for a text component. Select \uicontrol NativeRendering if
     you prefer text to look native on the target platform and do not
@@ -213,20 +250,69 @@
     {transformation} of the text. Using rotation or scaling in combination
     with native rendering leads to poor and sometimes pixelated results.
 
+    If you select \uicontrol NativeRendering, you can set the hinting preference
+    in the \uicontrol Hinting field in the \uicontrol {Font Extras} section:
+
+    \list
+        \li \uicontrol PreferDefaultHinting uses the default hinting level for
+            the target platform.
+        \li \uicontrol PreferNoHinting renders text without hinting the outlines
+            of the glyphs, if possible.
+        \li \uicontrol PreferVerticalHinting renders text with no horizontal
+            hinting, but aligns glyphs to the pixel grid in the vertical
+            direction, if possible.
+        \li \uicontrol PreferFullHinting renders text with hinting in both
+            horizontal and vertical directions.
+    \endlist
+
+    \note This property only describes a preference, as the full range of
+    hinting levels are not supported on all of Qt's supported platforms.
+
+    \section1 Advanced Font Properties
+
+    You can specify additional properties for fonts in the
+    \uicontrol {Font Extras} section.
+
+    \image qtquick-properties-font-extras.png "Font Extras section"
+
+    In the \uicontrol Capitalization field, select \uicontrol MixedCase
+    for normal text rendering where no capitalization changes are applied. You
+    can also set the text in all upper or lower case, or use small caps. The
+    \uicontrol Capitalize option renders the first character of each word as an
+    uppercase character.
+
+    You can set the font style in the \uicontrol Style field to
+    \uicontrol Outline, \uicontrol Raised, or \uicontrol Sunken.
+    The color that you pick in the \uicontrol {Style color}
+    field is used as the outline color for outlined text, and as
+    the shadow color for raised or sunken text.
+
+    To use kerning when drawing text with the selected font, select the
+    \uicontrol {Auto kerning} check box.
+
+    Sometimes, a font will apply complex rules to a set of characters in order
+    to display them correctly. In some writing systems, such as Brahmic scripts,
+    this is required in order for the text to be legible but in others, such
+    as Latin script, it is merely a cosmetic feature. Such features are disabled
+    by default to improve performance. If they are required, select the
+    \uicontrol {Prefer shaping} check box.
+
     \target text-edit
     \section1 Text Input
 
     You can use the \uicontrol {Text Edit} and \uicontrol {Text Input}
     components to add text fields where users can enter text.
 
-    The Text Input component displays a single line of editable plain text,
-    whereas the Text Edit component displays a block of editable, formatted
-    text. Both components are used to accept text input.
+    The \uicontrol {Text Input} component displays a single line of editable
+    plain text, whereas the \uicontrol {Text Edit} component displays a block
+    of editable, formatted text. Both components are used to accept text input.
 
     \image qtquick-designer-text-input-properties.png "Text input field properties"
 
-    In the \uicontrol {Mouse selection mode} field, you can specify whether
-    individual characters or whole words are selected when selecting text.
+    \section2 Entering Passwords
+
+    You can set properties for \uicontrol {Text Input} components that make
+    them suitable for entering passwords.
 
     In the \uicontrol {Input mask} field, you can create an input mask that
     contains mask and meta characters and separators between them. When created
@@ -241,14 +327,18 @@
     platform-dependent password mask characters instead of the actual characters
     that users enter. Select \uicontrol PasswordEchoOnEdit to display characters
     as users enter them. The mask character is displayed in the
-    \uicontrol {Pass. char} field.
+    \uicontrol {Password character} field.
+
+    \section2 Entering Text
+
+    You can specify how users can enter text into text edit or input fields.
 
     In the \uicontrol {Maximum length} field, set the maximum number of
     characters that users can enter.
 
     The value of the \uicontrol {Auto scroll} check box determines whether the
     text edit or input should scroll when the text is longer than the width of
-    the input field.
+    the field.
 
     If the \uicontrol {Overwrite mode} check box is selected, existing text is
     overwritten, character-for-character by new text. Otherwise, new text is
@@ -258,7 +348,27 @@
     To prevent users from changing the text, select the \uicontrol {Read only}
     check box.
 
-    The value of the \uicontrol {Set active focus on press} check box determines
+    \section2 Selecting Text
+
+    In the \uicontrol {Selection mode} field, you can specify whether
+    individual characters or whole words are selected when selecting text
+    with a pointer device.
+
+    Select the \uicontrol {Select by mouse} check box to enable users to
+    use the mouse to select text in some platform-specific way. For some
+    platforms this may not be an appropriate interaction because it may
+    conflict with how the text needs to behave inside a \uicontrol Flickable
+    component, for example.
+
+    For a \uicontrol {Text Edit} component, you can select the
+    \uicontrol {Select by keyboard} check box to enable users to
+    use the keyboard to select text even if the edit field is
+    read-only. If this property is set to \c false, users cannot
+    use the keyboard to select text even if it is editable.
+
+    \section2 Focus
+
+    The value of the \uicontrol {Focus on press} check box determines
     whether the text edit or input should gain active focus on a mouse press.
 
     By default, the cursor becomes visible when the text edit or input gains
@@ -270,20 +380,44 @@
     If the \uicontrol {Persistent selection} check box is selected, a text edit
     or input keeps its selection when active focus moves to another component.
 
-    To use a pointer device for selecting text, select the
-    \uicontrol {Select by mouse} check box.
+    \section2 Tabs and Margins
+
+    You can specify additional properties for formatting a block of text in
+    a \uicontrol {Text Edit} component.
+
+    \image qtquick-designer-text-edit-properties.png "Text edit properties"
+
+    In the \uicontrol {Tab stop distance} field, set the default distance, in
+    device units, between tab stops.
+
+    In the \uicontrol {Text margin} field, set the margin around the text in
+    pixels.
 
     \section1 Padding
 
     The values of the properties in the \uicontrol Padding section specify the
     padding around the content. The individual padding properties adopt the
-    value of the \uicontrol Padding field, unless you set them explicitly.
+    value of the \uicontrol Global field, unless you set them explicitly.
+
+    \image qtquick-properties-text-padding.png "Padding section"
 
     \note If you explicitly set the width or height of a text edit or input,
     ensure that it is large enough to accommodate the padding values. If the
     text does not have enough vertical or horizontal space in which to be
     rendered, it will appear clipped.
 
+    \section1 Placeholder Text
+
+    For \uicontrol {Text Field} and \uicontrol {Text Area} controls, you can
+    specify text to display in a field before users enter text into it.
+    Specify the text in the \uicontrol {Placeholder text} field and its color
+    in the \uicontrol {Placeholder color} field.
+
+    \image qtquick-properties-text-field.png "Placeholder text settings"
+
+    Select the \uicontrol Hover check box to enable the text field to accept
+    hover events.
+
     \section1 Summary of Text Components
 
     The following table lists the components that you can use to add text to

doc/qtcreator/src/qtquick/library/qtquick-user-interaction-methods.qdoc

@@ -96,7 +96,7 @@
     is ignored.
 
     A component has focus when the \uicontrol Focus property in the
-    \uicontrol Advanced tab is set to \c true. However, for reusable
+    \uicontrol Advanced section is set to \c true. However, for reusable
     or imported components, this is not sufficient, and you should use
     a \uicontrol {Focus Scope} component.
 

doc/qtcreator/src/qtquick/qtquick-annotations.qdoc

@@ -63,11 +63,13 @@
     \list 1
         \li Select the component to annotate in \uicontrol Navigator or in
             \uicontrol {Form Editor}.
-        \li In \uicontrol Properties, select \uicontrol {Add Annotation}.
+        \li In \uicontrol Properties, select \uicontrol {Add Annotation} to
+            open \uicontrol {Annotation Editor}.
             \image qtquick-annotation-editor.png "Annotation Editor"
         \li The \uicontrol {Selected Item} field displays the ID of the
-            component. Enter a name for the annotation in the
-            \uicontrol {Custom ID} field.
+            component.
+        \li In the the \uicontrol Name field, enter a free-form text that
+            describes the component.
         \li In the \uicontrol Title field, enter the text to display in
             the tab for this comment.
         \li In the \uicontrol Author field, enter the author's name.
@@ -82,6 +84,8 @@
     (\uicontrol {Remove Comment}) button. To remove the annotation, right-click
     the annotation icon, and then select \uicontrol {Remove Annotation}.
 
+    To view the annotations in table format, select \uicontrol {Table view}.
+
     To edit annotations, select \uicontrol {Edit Annotation} in the context
     menu of the component.
 */

doc/qtcreator/src/qtquick/qtquick-buttons.qdoc

@@ -250,7 +250,7 @@
             \image qmldesigner-borderimage-bindings.png "Active state when condition"
         \li Select the text component in \uicontrol Navigator to specify that the
             text size is scaled up when the button is pressed down.
-        \li In \uicontrol Properties, select the \uicontrol Advanced tab, and
+        \li In \uicontrol Properties, select the \uicontrol Advanced section, and
             increase the value of the \uicontrol Scale property.
         \li Select \e inactiveButton in \uicontrol Navigator to hide
             it in the \e active state by changing the value of its

doc/qtcreator/src/qtquick/qtquick-navigator.qdoc

@@ -90,7 +90,7 @@
         \li Shows and hides invisible components in \uicontrol Navigator.
         \li \l{Showing and Hiding Components}
     \row
-        \li \inlineimage export_unchecked.png
+        \li \inlineimage icons/alias.png
         \li Adds a property alias that you can use from outside of the
             component.
         \li \l{Adding Property Aliases}
@@ -227,7 +227,7 @@
             below the third level.
     \endlist
 
-    You can use the \inlineimage export_unchecked.png
+    You can use the \inlineimage icons/alias.png
     (\uicontrol Export) button in \uicontrol Navigator to export
     a component as a property alias with a valid alias reference.
 

doc/qtcreator/src/qtquick/qtquick-properties-view.qdoc

@@ -33,7 +33,7 @@
     The \uicontrol Properties view displays all the properties of the selected
     \l{glossary-component}{component}. The properties are grouped by type. The
     top part of the view displays properties that are common to all components,
-    such as type name, ID, position, size, and visibility.
+    such as component type, ID, name, geometry, and visibility.
 
     \image qtquick-item-properties-common.png "Basic component properties"
 
@@ -54,7 +54,7 @@
         \li Tooltip
         \li Read More
     \row
-        \li \inlineimage export_unchecked.png
+        \li \inlineimage icons/alias.png
         \li Adds a property alias that you can use from outside of the
             component for the root component. You can use a menu item
             in the actions menu to add property aliases for property
@@ -99,7 +99,7 @@
     the current state and which values are derived from the base state.
 
     The following images illustrate this. In the base state, the
-    \uicontrol Position (1) and \uicontrol Size (2) values are explicitly set
+    \uicontrol Position and \uicontrol Size values are explicitly set
     and highlighted.
 
     \image qmldesigner-properties-explicit-base.png "Explicitly set properties"
@@ -141,7 +141,8 @@
     \section1 Multiselection
 
     To modify the values of common properties of multiple components
-    simultaneously, select the components in \l Navigator or \l {Form Editor}:
+    simultaneously, select the components in \l Navigator, \l {Form Editor}
+    or \uicontrol {3D Editor}:
 
     \list
         \li On Windows, press and hold \key Ctrl and \key Shift, and then click
@@ -158,7 +159,7 @@
     \list
         \li For information about setting common component properties, see
             \l{Specifying Component Properties}.
-        \li For more information on the properties available for a
+        \li For more information about the properties available for a
             component, press \key {F1} or see \l{Component Types}
             and \l{Scalable Layouts}.
     \endlist

doc/qtcreator/src/qtquick/qtquick-properties.qdoc

@@ -34,7 +34,7 @@
     \l{glossary-component}{component}.
 
     \target basic-item
-    \section1 Specifying Basic Component Properties
+    \section1 Basic Component Properties
 
     All components share a set of properties that you can specify in the
     \uicontrol Properties view.
@@ -43,7 +43,7 @@
 
     \section2 Type
 
-    When you create a component using a \l{Component Types}{preset component},
+    When you create an instance of a \l{Component Types}{preset component},
     it has all the properties of the preset you used. If you realize later that
     another preset component with another set of default properties would be
     more suitable for your purposes, you can change the component type by
@@ -68,10 +68,23 @@
 
     For more technical information about IDs, see \l{The id Attribute}.
 
-    The value of the \uicontrol {Custom ID} field specifies the name of an
-    \l{Annotating Designs}{annotation}.
+    To add a \l{Adding Property Aliases}{property alias} that you can use
+    from  outside of the component, select \inlineimage icons/alias.png
+    . You can use a menu item in the \uicontrol Actions menu to add property
+    aliases for property values of child components.
 
-    \section2 2D Geometry
+    \section2 Name
+
+    The value of the \uicontrol {Name} field specifies the component name
+    used in an \l{Annotating Designs}{annotation}. It is a free-form text
+    that descibes the component.
+
+    \section1 2D Geometry
+
+    Set the properties in the \uicontrol {Geometry - 2D} section to determine
+    the position and size of a component.
+
+    \image qtquick-properties-2d-geometry.png "2D Geometry properties"
 
     In the \uicontrol Position group, you can set the position of a component on
     the x and y axis. The position of a component in the UI can be either
@@ -80,7 +93,7 @@
 
     In the 2D space, the z position of a component determines its position in
     relation to its sibling components in the component hierarchy. You can set
-    it in the \uicontrol Z field in the \uicontrol Advanced tab.
+    the z position in the \uicontrol {Z stack} field.
 
     In the \uicontrol Size group, you can set the width and height of a
     component. You can also use the resize cursor to \l{Resizing 2D Components}
@@ -96,7 +109,7 @@
     if its final size is determined by property bindings. For more
     information, see \l {Previewing Component Size}.
 
-    \section3 Resetting Component Position and Size
+    \section2 Resetting Component Position and Size
 
     To return a component to its default position after moving it,
     select the \inlineimage qtcreator-reset-position-icon.png
@@ -105,20 +118,44 @@
     \inlineimage qtcreator-reset-size-icon.png
     (\uicontrol {Reset Size}) button.
 
-    \section2 Visibility
+    \section2 Managing 2D Transformations
 
-    You can use the properties in the \uicontrol Visibility group to show and
+    You can assign any number of transformations, such as rotation and scaling,
+    to a component. Each transformation is applied in order, one at a time.
+
+    In the \uicontrol Origin field, select the origin point for scaling and
+    rotation.
+
+    Set the scale factor in the \uicontrol Scale field. A value of less than
+    1.0 makes the component smaller, whereas a value greater than 1.0 makes
+    it larger. A negative value causes the component to be mirrored in
+    \uicontrol {Form Editor}.
+
+    In the \uicontrol Rotation field, specify the rotation of the component
+    in degrees clockwise around the origin point.
+
+    Alternatively, you can move, resize, or rotate components by dragging them
+    in \l{Form Editor}.
+
+    For more information about transforming 3D components, see
+    \l{Managing 3D Transformations} and \l{3D Editor}.
+
+    \section1 Visibility
+
+    Set the properties in the \uicontrol Visibility section to show and
     hide components.
 
-    Deselect the \uicontrol {Is visible} check box to hide a component and all
+    \image qtquick-properties-visibility.png "Visibility properties"
+
+    Deselect the \uicontrol Visible check box to hide a component and all
     its child components, unless they have explicitly been set to be visible.
     This might have surprise effects when using property bindings. In such
     cases, it may be better to use the \uicontrol Opacity property instead.
 
     If this property is disabled, the component will no longer receive
-    \l{Mouse Area}{mouse events} but will continue to receive key events
-    and will retain the keyboard focus events, if it has been set by
-    selecting the \uicontrol Enabled check box in the \uicontrol Advanced tab.
+    \l{Mouse Area}{mouse events}. However, it will continue to receive key
+    events and will retain the keyboard focus events if the \uicontrol Enabled
+    check box in the \uicontrol Advanced section is selected.
 
     The visibility value is only affected by changes to this property or the
     parent's visible property. It does not change, for example, if this
@@ -138,30 +175,8 @@
     If the \uicontrol Clip check box is selected, the component and its children
     are clipped to the bounding rectangle of the component.
 
-    \section1 Managing 2D Transformations
-
-    You can assign any number of transformations, such as rotation and scaling,
-    to a component in the \uicontrol Advanced tab of the \uicontrol Properties
-    view. Each transformation is applied in order, one at a time.
-
-    \image qtquick-item-properties-advanced.png "Advanced component properties"
-
-    In the \uicontrol Origin field, select the origin point for scaling and
-    rotation.
-
-    Set the scale factor in the \uicontrol Scale field. A value of less than
-    1.0 makes the component smaller, whereas a value greater than 1.0 makes
-    it larger. A negative value causes the component to be mirrored in
-    \uicontrol {Form Editor}.
-
-    In the \uicontrol Rotation field, specify the rotation of the component
-    in degrees clockwise around the origin point.
-
-    Alternatively, you can move, resize, or rotate components by dragging them
-    in \l{Form Editor}.
-
-    For more information about transforming 3D components, see
-    \l{Managing 3D Transformations} and \l{3D Editor}.
+    in the \uicontrol State field, select the \l{Adding States}{state} to
+    change the value of a property in that state.
 
     \section1 Picking Colors
 
@@ -261,48 +276,23 @@
     By default, a linear gradient (4) is used, but you can select another
     supported gradient type in the \uicontrol Properties view.
 
-    \section1 Marking Text Components for Translation
-
-    To support translators, mark each text component that should be translated.
-    In the \uicontrol Properties view, \uicontrol Text field, select \uicontrol tr (1).
-
-    \image qmldesigner-text-property-tr.png "Text properties"
-
-    By default, the text string is enclosed in a \c qsTr() call.
-
-    \image qml-translate.png "Text marked for translation"
-
-    If you use text IDs instead of plain text, change the default call to
-    \c qsTrId(). Select \uicontrol Tools > \uicontrol Options >
-    \uicontrol {Qt Quick} > \uicontrol {Qt Quick Designer}, and then select the
-    \uicontrol {qsTrId()} radio button in the \uicontrol Internationalization
-    group. For more information about text ID based translations, see
-    \l {Qt Linguist Manual: Text ID Based Translations}.
-
-    To preserve the context when editing the text or to change the context
-    by setting a binding on the text property, change the default call to
-    \c qsTranslate() by selecting the \uicontrol {qsTranslate()} radio button.
-
-    For more information, see
-    \l {Internationalization and Localization with Qt Quick}.
-
-    \if defined(qtcreator)
-    When you \l{Creating Qt Quick Projects}{create a new project}, you can
-    automatically generate a translation source file (TS) for one language.
-    You can add other languages later by editing the project file.
-    \endif
-
     \section1 Specifying Developer Properties
 
-    In the \uicontrol Advanced tab of the \uicontrol Properties view, you can
-    manage the more advanced properties of components that are based on the
-    \l Item component and that are mostly used by application developers.
+    In the \uicontrol Advanced and \uicontrol Layer sections of the
+    \uicontrol Properties view, you can manage the more advanced
+    properties of components that are inherited from the \l Item
+    component and that are mostly used by application developers.
+
+    \image qtquick-properties-advanced.png "Advanced section in Properties"
 
     Select the \uicontrol Smooth check box to activate smooth sampling. Smooth
     sampling is performed using linear interpolation, while non-smooth sampling
     is performed using the nearest neighbor. Because smooth sampling has minimal
     impact on performance, it is activated by default.
 
+    Antialiasing is used to make curved lines smoother on the screen. Select
+    the \uicontrol Antialising check box to turn on antialiasing.
+
     The value of the \uicontrol {Baseline offset} specifies the position of the
     component's baseline in local coordinates. The baseline of a \l Text
     component is the imaginary line on which the text sits. Controls containing
@@ -316,7 +306,7 @@
     behavior, unless you explicitly set this value for them.
 
     You can enable the \uicontrol Focus check box to specify that the component
-    has active focus and the \uicontrol {Active focus on tab} check box to add
+    has active focus and the \uicontrol {Focus on tab} check box to add
     the component to the \e {tab focus chain}. The tab focus chain traverses
     components by first visiting the parent, and then its children in the order
     they are defined. Pressing \key Tab on a component in the tab focus chain
@@ -351,7 +341,7 @@
 
     Components are normally rendered directly into the window they belong to.
     However, by selecting the \uicontrol Enabled check box in the
-    \uicontrol Layer group, you can delegate the component and its entire subtree
+    \uicontrol Layer section, you can delegate the component and its entire subtree
     into an offscreen surface. Only the offscreen surface, a texture, will
     then be drawn into the window. For more information, see \l{Item Layers}.
 
@@ -397,9 +387,9 @@
     The component will use linear interpolation for scaling if the
     \uicontrol Smooth check box is selected. To use a mipmap for downsampling,
     select the \uicontrol Mipmap check box. Mipmapping may improve the visual
-    quality of downscaled components. For mipmapping of single Image components,
-    select the \uicontrol Mipmap check box in the \l{Images}{image properties},
-    instead.
+    quality of downscaled components. For mipmapping of single \uicontrol Image
+    components, select the \uicontrol Mipmap check box in the \l{Images}
+    {image properties}, instead.
 
     To use a texture with a size different from that of the component, specify
     the width and height of the texture in the \uicontrol {Texture size} field.

doc/qtcreator/src/qtquick/qtquick-ui-forms.qdoc

@@ -184,7 +184,7 @@
     \endcode
 
     The property alias exports the button to the code that uses the form.
-    You can use the \inlineimage export_unchecked.png
+    You can use the \inlineimage icons/alias.png
     (\uicontrol Export) button in \l Navigator to export a component
     as a property:
 

doc/qtdesignstudio/src/qtdesignstudio-app-flows.qdoc

@@ -151,7 +151,7 @@
     In the \uicontrol Layout tab, you can use \l{Setting Anchors and Margins}
     {anchors} to position the component.
 
-    In the \uicontrol Advanced tab, you can manage the more
+    In the \uicontrol Advanced section, you can manage the more
     \l{Specifying Developer Properties}{advanced properties}
     of components.
 */
@@ -233,7 +233,7 @@
     In the \uicontrol Layout tab, you can use \l{Setting Anchors and Margins}
     {anchors} to position the component.
 
-    In the \uicontrol Advanced tab, you can manage the more
+    In the \uicontrol Advanced section, you can manage the more
     \l{Specifying Developer Properties}{advanced properties} of components.
 */
 
@@ -305,7 +305,7 @@
     In the \uicontrol Layout tab, you can use \l{Setting Anchors and Margins}
     {anchors} to position the component.
 
-    In the \uicontrol Advanced tab, you can manage the more
+    In the \uicontrol Advanced section, you can manage the more
     \l{Specifying Developer Properties}{advanced properties} of components.
 
     \section1 Flow Action Area Properties