diff --git a/doc/qtcreator/images/studio-iso-icon.png b/doc/qtcreator/images/studio-iso-icon.png new file mode 100644 index 00000000000..d8491d6c438 Binary files /dev/null and b/doc/qtcreator/images/studio-iso-icon.png differ diff --git a/doc/qtcreator/src/qtquick/library/qtquick-data-models.qdoc b/doc/qtcreator/src/qtquick/library/qtquick-data-models.qdoc index 39b0ca22e1c..894ca4ac85f 100644 --- a/doc/qtcreator/src/qtquick/library/qtquick-data-models.qdoc +++ b/doc/qtcreator/src/qtquick/library/qtquick-data-models.qdoc @@ -239,7 +239,7 @@ \row \li \inlineimage icons/item-svg-16px.png \li \l{SVG Path Item} - \li Studio Components + \li Qt Quick Studio Components \li \li An SVG path data string that is used to draw a path as a line. \endif diff --git a/doc/qtcreator/src/qtquick/library/qtquick-images.qdoc b/doc/qtcreator/src/qtquick/library/qtquick-images.qdoc index 07175180e91..c8cec48b890 100644 --- a/doc/qtcreator/src/qtquick/library/qtquick-images.qdoc +++ b/doc/qtcreator/src/qtquick/library/qtquick-images.qdoc @@ -207,6 +207,25 @@ \youtube DVWd_xMMgvg + \if defined(qtdesignstudio) + \section1 Iso Icon + + The IsoIcon component specifies an icon from an ISO 7000 icon library as a + \l [QtQuickExtras] {Picture} component. The icon to use for the type and + its color can be specified. + + To select an icon in the \uicontrol {ISO Icon Browser} in \QDS, select + the ISO icon in \l Navigator or \l {Form Editor}, and then select + \uicontrol {Choose Icon} in the context menu. + + \image studio-iso-icon.png + + You can use the \l{Picking Colors}{color picker} in \l Properties to + set the icon color. + + \image iso-icon-browser.png + \endif + \section1 Summary of Images The following table lists the components that you can use to add images. @@ -244,8 +263,8 @@ \if defined(qtdesignstudio) \row \li \inlineimage icons/iso-icons-16px.png - \li IsoIcon - \li Studio Components + \li \l{Iso Icon} + \li Qt Quick Studio Components \li \li An icon from an ISO 7000 icon library specified as a \l Picture component. You can select the icon to use and its color. diff --git a/doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc b/doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc index 09d97453eba..02e4f8a51e3 100644 --- a/doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc +++ b/doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc @@ -101,9 +101,9 @@ \section2 Studio Rectangle If you want to modify each corner of the rectangle independently - or use a dashed border, select the Rectangle component in the - \uicontrol {Studio Components} tab of \uicontrol Library instead - of the basic rectangle component. + or use a dashed border, create an instance of \uicontrol Library + > \uicontrol Components > \uicontrol {Qt Quick Studio Components} + > \uicontrol Rectangle instead of the basic rectangle component. By setting the values of properties in the \uicontrol {Corner Radiuses} group, you can draw each corner independently. By using radius values @@ -222,12 +222,28 @@ gradient. The fill color property values are set in the same way as for a rectangle. The border property values are described in \l{Strokes}. + \section1 Flipable + + A Flipable component can be visibly \e flipped between its front and back + sides, like a card. The front and back sides are specified by using any + two components inside the Flipable component. The component with the + higher z-order is the front side. The \uicontrol {Opacity front} and + \uicontrol {Opacity back} properties are used to hide and show either the + front or back side of the item at a time. + + \image studio-flipable.png + + The \uicontrol {Flip angle} property is used to animate the angle + of the component to produce the flipping effect. The value of the + \uicontrol {Rotation axis} property determine whether the component + is rotated around the x-axis or the y-axis. + \section1 Summary of Shapes The following table lists the components that you can use to draw shapes. - The \e Location column contains the tab name where you can find the - component in \l Library > \uicontrol Components. The \e MCU column - indicates which components are supported on MCUs. + The \e Location column indicates the location of the component in + \l Library > \uicontrol Components. The \e MCU column indicates which + components are supported on MCUs. \table \header @@ -239,21 +255,28 @@ \row \li \inlineimage icons/item-arc-16px.png \li \l Arc - \li Studio Components + \li Qt Quick Studio Components \li \li An arc that begins and ends at given positions. \row \li \inlineimage icons/custom-border-16px.png \li \l Border - \li Studio Components + \li Qt Quick Studio Components \li \li A line with four segments that you can show and shape individually. \row \li \inlineimage icons/item-pie-16px.png \li \l Pie - \li Studio Components + \li Qt Quick Studio Components \li \li A pie slice or a pie with a slice missing from it. + \row + \li \inlineimage icons/item-flippable-16px.png + \li \l Flipable + \li Qt Quick Studio Components + \li + \li A component that can be visibly \e flipped between its front and + back sides, like a card. \row \li \inlineimage rect-icon16.png \li \l Rectangle @@ -265,7 +288,7 @@ \row \li \inlineimage icons/custom-rectangle-16px.png \li \l{Studio Rectangle}{Rectangle} - \li Studio Components + \li Qt Quick Studio Components \li \li An extended rectangle that is painted with a solid fill color or linear, conical, or radial gradients, and corners that you can @@ -273,7 +296,7 @@ \row \li \inlineimage icons/item-triangle-16px.png \li \l Triangle - \li Studio Components + \li Qt Quick Studio Components \li \li A triangle with different dimensions and shapes that is enclosed in an invisible rectangle. diff --git a/doc/qtcreator/src/qtquick/qtquick-component-context-menu.qdocinc b/doc/qtcreator/src/qtquick/qtquick-component-context-menu.qdocinc index 3132605f1d4..8e813f691d7 100644 --- a/doc/qtcreator/src/qtquick/qtquick-component-context-menu.qdocinc +++ b/doc/qtcreator/src/qtquick/qtquick-component-context-menu.qdocinc @@ -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. @@ -47,7 +47,7 @@ \if defined(qtdesignstudio) \row \li Group - \li \l Group + \li \l{Organizing Components} \endif \row \li Position diff --git a/doc/qtcreator/src/qtquick/qtquick-from-qmlproject-to-pro.qdoc b/doc/qtcreator/src/qtquick/qtquick-from-qmlproject-to-pro.qdoc index 7695af29e01..431d9826ab1 100644 --- a/doc/qtcreator/src/qtquick/qtquick-from-qmlproject-to-pro.qdoc +++ b/doc/qtcreator/src/qtquick/qtquick-from-qmlproject-to-pro.qdoc @@ -67,7 +67,7 @@ show the main QML file when the application starts. The \e {Qt Quick Designer Components} module is delivered with \QDS. If you - use Studio Components or Effects in your project, you have to build the + use Qt Quick Studio Components or Effects in your project, you have to build the module and install it to your Qt to be able to build your project. The \l{Qt Quick Timeline} module is delivered with \QDS and with Qt 5.14, @@ -134,7 +134,7 @@ \section1 Adding Qt Quick Designer Components to Qt Installations - If you use Studio Components or Effects in your project, you have to + If you use Qt Quick Studio Components or Effects in your project, you have to check out and install the \e {Qt Quick Designer Components} module from \l{https://codereview.qt-project.org/admin/repos/qt-labs/qtquickdesigner-components} {Qt Code Review}. diff --git a/doc/qtcreator/src/qtquick/qtquick-positioning.qdoc b/doc/qtcreator/src/qtquick/qtquick-positioning.qdoc index ae6ac6ec548..798ddff679e 100644 --- a/doc/qtcreator/src/qtquick/qtquick-positioning.qdoc +++ b/doc/qtcreator/src/qtquick/qtquick-positioning.qdoc @@ -432,30 +432,49 @@ \section2 Organizing Components - The following table lists the UI controls that you can use to - organize components in UIs (since Qt 5.7). They are available in - \l Library > \uicontrol Components > \uicontrol {Qt Quick Controls}. + You can use the \uicontrol Frame and \uicontrol {Group Box} controls to + draw frames around groups of controls. + \if defined(qtdesignstudio) + If you don't want a frame, use the \uicontrol Group component instead. + \endif + + + The following table lists the UI controls that you can use to organize + components in UIs (since Qt 5.7). The \e Location column indicates the + location of the component in \l Library > \uicontrol Components. \table \header \li Icon \li Name + \li Location \li Purpose \row \li \inlineimage icons/frame-icon16.png \li \l [QtQuickControls]{Frame} + \li Qt Quick Controls \li A visual frame around a group of controls. + \if defined(qtdesignstudio) + \row + \li \inlineimage icons/group-16px.png + \li Group + \li Qt Quick Studio Components + \li Enables handling the selected components as a group. + \endif \row \li \inlineimage icons/groupbox-icon16.png \li \l [QtQuickControls]{GroupBox}{Group Box} + \li Qt Quick Controls \li A titled visual frame around a group of controls. \row \li \inlineimage icons/page-icon16.png \li \l [QtQuickControls]{Page} + \li Qt Quick Controls \li A styled page control with support for a header and footer. \row \li \inlineimage icons/pane-icon16.png \li \l [QtQuickControls]{Pane} + \li Qt Quick Controls \li A background that matches the application style and theme. \endtable */ diff --git a/doc/qtcreator/src/qtquick/qtquick-properties.qdoc b/doc/qtcreator/src/qtquick/qtquick-properties.qdoc index 24a0c653948..126ed209bdb 100644 --- a/doc/qtcreator/src/qtquick/qtquick-properties.qdoc +++ b/doc/qtcreator/src/qtquick/qtquick-properties.qdoc @@ -200,9 +200,9 @@ \section2 Setting Gradient Properties Select the arrow below the gradient button to set gradient properties - for \l{Shapes}{Studio Components}. + for \l{Shapes}{Qt Quick Studio Components}. - \image qtquick-designer-gradient-types.png "Gradients supported by Studio Components" + \image qtquick-designer-gradient-types.png "Gradients supported by Qt Quick Studio Components" \section3 Linear Gradients diff --git a/doc/qtcreator/src/qtquick/qtquick-timeline.qdoc b/doc/qtcreator/src/qtquick/qtquick-timeline.qdoc index b7a82dde791..9441920d17f 100644 --- a/doc/qtcreator/src/qtquick/qtquick-timeline.qdoc +++ b/doc/qtcreator/src/qtquick/qtquick-timeline.qdoc @@ -259,7 +259,8 @@ \if defined(qtdesignstudio) \section1 Animating Shapes - You can use the Studio components to animate the following shapes: + You can use the \uicontrol {Qt Quick Studio Components} to animate the + following shapes: \list \li \l Arc diff --git a/doc/qtdesignstudio/images/icons/group-16px.png b/doc/qtdesignstudio/images/icons/group-16px.png new file mode 100644 index 00000000000..86be6eacfa6 Binary files /dev/null and b/doc/qtdesignstudio/images/icons/group-16px.png differ diff --git a/doc/qtdesignstudio/images/icons/item-flippable-16px.png b/doc/qtdesignstudio/images/icons/item-flippable-16px.png new file mode 100644 index 00000000000..90c5d17339d Binary files /dev/null and b/doc/qtdesignstudio/images/icons/item-flippable-16px.png differ diff --git a/doc/qtdesignstudio/images/studio-arc.png b/doc/qtdesignstudio/images/studio-arc.png deleted file mode 100644 index 3d1a1dabd24..00000000000 Binary files a/doc/qtdesignstudio/images/studio-arc.png and /dev/null differ diff --git a/doc/qtdesignstudio/images/studio-border.png b/doc/qtdesignstudio/images/studio-border.png deleted file mode 100644 index df9f12cc632..00000000000 Binary files a/doc/qtdesignstudio/images/studio-border.png and /dev/null differ diff --git a/doc/qtdesignstudio/images/studio-group.png b/doc/qtdesignstudio/images/studio-group.png deleted file mode 100644 index 27a5f79bbc9..00000000000 Binary files a/doc/qtdesignstudio/images/studio-group.png and /dev/null differ diff --git a/doc/qtdesignstudio/images/studio-pie.png b/doc/qtdesignstudio/images/studio-pie.png deleted file mode 100644 index f2e67a63fb9..00000000000 Binary files a/doc/qtdesignstudio/images/studio-pie.png and /dev/null differ diff --git a/doc/qtdesignstudio/images/studio-rectangle.png b/doc/qtdesignstudio/images/studio-rectangle.png deleted file mode 100644 index 0d545b8fbb7..00000000000 Binary files a/doc/qtdesignstudio/images/studio-rectangle.png and /dev/null differ diff --git a/doc/qtdesignstudio/images/studio-triangle.png b/doc/qtdesignstudio/images/studio-triangle.png deleted file mode 100644 index 948e67041ed..00000000000 Binary files a/doc/qtdesignstudio/images/studio-triangle.png and /dev/null differ diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-figma-using.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-figma-using.qdoc index e654eab67e5..1ba8e459515 100644 --- a/doc/qtdesignstudio/src/qtbridge/qtbridge-figma-using.qdoc +++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-figma-using.qdoc @@ -128,7 +128,7 @@ Figma rectangles are exported as \l{basic-rectangle} {Rectangle} components. Figma vectors are exported as \l{SVG Path Item} components from the \l{Shapes} - {Studio Components} module. + {Qt Quick Studio Components} module. \li \uicontrol Merged merges the selected groups and layers into one component. \li \uicontrol Skipped completely skips the selected layer. @@ -153,7 +153,7 @@ contain the components in this field. For example, to use components from version 2.3 of the Qt Quick Controls module, you need the import statement \c {QtQuick.Controls 2.3} and to use version 1.0 - Studio Components, you need the import statement + Qt Quick Studio Components, you need the import statement \c {QtQuick.Studio.Components 1.0}. You can add components from all the available modules in \QDS later. You can also import a module as an \e alias. @@ -178,7 +178,7 @@ You can export assets in the selected format (JPG, PNG, or SVG). By default, vectors are exported as \l{SVG Path Item} components from the - Studio Components module. This might not work for layers that have + Qt Quick Studio Components module. This might not work for layers that have particular effects applied to them. In that case, the layers are exported as images. @@ -195,7 +195,7 @@ \row \li \uicontrol {Export as shapes} \li Exports vectors as components of the type \l{SVG Path Item} from the - Studio Components module. + Qt Quick Studio Components module. \row \li \uicontrol {Reset plugin data} \li Resets all settings for all layers and groups (also in the diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc index 3fc3629a67e..2680880963b 100644 --- a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc +++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc @@ -85,7 +85,7 @@ \QDS offers predefined sets of UI controls that you can modify according to your needs. You can export your own controls as components, Qt Quick - Controls, or Studio Components. The position and dimensions of your control + Controls, or Qt Quick Studio Components. The position and dimensions of your control are preserved. However, if you want your UI controls, such as check boxes, to look exactly diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-arc.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-arc.qdoc deleted file mode 100644 index f4efa4066dc..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-arc.qdoc +++ /dev/null @@ -1,346 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Arc - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief An arc that ends at the specified position and uses the specified - radius. - - An arc is specified by setting values in degrees for the \l begin and - \l end properties. The arc can be just a line or a filled outline. - The \l strokeColor, \l strokeWidth, and \l strokeStyle properties specify - the appearance of the line or outline. The \l dashPattern and \l dashOffset - properties specify the appearance of dashed lines. - - The area between the arc's start and end points or the area inside the - outline are painted using either a solid fill color, specified using the - \l fillColor property, or a gradient, defined using one of the - \l ShapeGradient subtypes and set using the \l gradient property. - If both a color and a gradient are specified, the gradient is used. - - To create an arc with an outline, set the \l outlineArc property to \c true. - The \l arcWidth property specifies the width of the arc outline, including - the stroke. The \l arcWidthBegin and \l arcWidthEnd properties can be used - to specify the width of the start and end points of the outline separately. - The width of the outline between the start and end points is calculated - automatically. The inner and outer curves or the outline can be adjusted by - specifying values for the \l radiusInnerAdjust and \l radiusOuterAdjust - properties. - - The \l round, \l roundBegin, and \l roundEnd properties specify whether the - end points of the arc outline have rounded caps. For an arc that does not - have an outline, the \l capStyle property specifies whether the line ends - are square or rounded. - - Because an arc has curves, it may be appropriate to set the \c antialiasing - property that is inherited from \l Item to improve its appearance. - - \section2 Example Usage - - You can use the Arc component in \QDS to create different kinds of arcs. - - \image studio-arc.png - - The QML code looks as follows: - - \code - ArcItem { - id: arc - x: 31 - y: 31 - capStyle: 32 - end: 180 - strokeWidth: 6 - strokeColor: "#000000" - } - - ArcItem { - id: arcOutline - strokeColor: "gray" - arcWidth: 13 - end: 180 - fillColor: "light gray" - antialiasing: true - round: true - outlineArc: true - } - - ArcItem { - id: circle - end: 360 - strokeWidth: 5 - strokeColor: "#000000" - } - - ArcItem { - id: circleOutline - outlineArc: true - round: true - strokeColor: "gray" - fillColor: "light gray" - strokeWidth: 1 - end: 360 - } - \endcode -*/ - -/*! - \qmlproperty enumeration Arc::capStyle - - The cap style of the line if the arc does not have an outline. - - \value ShapePath.FlatCap - A square line end that does not cover the end point of the line. - \value ShapePath.SquareCap - A square line end that covers the end point and extends beyond it - by half the line width. This is the default value. - \value ShapePath.RoundCap - A rounded line end. - - \sa round, roundBegin, roundEnd, Qt::PenCapStyle -*/ - -/*! - \qmlproperty ShapePath Arc::dashOffset - - The starting point of the dash pattern for the arc or arc outline. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath Arc::dashPattern - - The dash pattern of the arc or arc outline specified as the dashes and the - gaps between them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - Each dash is also subject to cap styles, and therefore a dash of 1 with - square cap set will extend 0.5 pixels out in each direction resulting in - a total width of 2. - - The default \l capStyle is \c {ShapePath.SquareCap}, meaning that a square - line end covers the end point and extends beyond it by half the line width. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty ShapePath Arc::fillColor - - The arc fill color. - - If the arc is just a line, the area between its \l begin and \l end - points is filled. - - If the arc has an outline, the area within the outline is filled. - - A gradient for the fill can be specified by using \l gradient. If both a - color and a gradient are specified, the gradient is used. - - When set to \c transparent, no filling occurs. - - The default value is \c white. -*/ - -/*! - \qmlproperty ShapePath Arc::gradient - - The gradient of the arc fill color. - - By default, no gradient is enabled and the value is null. In this case, the - fill uses a solid color based on the value of \l fillColor. - - When set, \l fillColor is ignored and filling is done using one of the - \l ShapeGradient subtypes. - - \note The \l Gradient type cannot be used here. Rather, prefer using one of - the advanced subtypes, like \l LinearGradient. -*/ - -/*! - \qmlproperty ShapePath Arc::strokeColor - - The color of the arc line or outline. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty enumeration Arc::strokeStyle - - The style of the arc line or outline. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath Arc::strokeWidth - - The width of the arc line or outline. - - When set to a negative value, no line is drawn. - - The default value is 4. - - The total width of an arc that has an outline (that is, the outline and the - fill) is specified by \l arcWidth. -*/ - -/*! - \qmlproperty real Arc::begin - - The position in degrees where the arc begins. - - The default value is 0. - - To create a circle, set the value of this property to 0 and the value of the - \l end property to 360. -*/ - -/*! - \qmlproperty real Arc::end - - The position in degrees where the arc ends. - - The default value is 90. - - To create a circle, set the value of this property to 360 and the value of - the \l begin property to 0. -*/ - -/*! - \qmlproperty real Arc::arcWidth - - The total width of an arc that has an outline, including the outline and - fill. - - The default value is 10. - - \sa arcWidthBegin, arcWidthEnd, strokeWidth -*/ - -/*! - \qmlproperty real Arc::arcWidthBegin - - The width of the beginning of an arc outline. - - \sa arcWidthEnd, arcWidth -*/ - -/*! - \qmlproperty real Arc::arcWidthEnd - - The width of the end of an arc outline. - - \sa arcWidthBegin, arcWidth -*/ - -/*! - \qmlproperty real Arc::radiusInnerAdjust - - The radius of the inside edge of the arc outline. - - This property can be used to adjust the inner curve of the arc outline. -*/ - -/*! - \qmlproperty real Arc::radiusOuterAdjust - - The radius of the outside edge of the arc outline. - - This property can be used to adjust the outer curve of the arc outline. -*/ - -/*! - \qmlproperty real Arc::alpha - - The area between the \l begin and \l end points of the arc. -*/ - -/*! - \qmlproperty bool Arc::outlineArc - - Whether the arc has an outline. - - \sa arcWidth, arcWidthBegin, arcWidthEnd, round, roundBegin, roundEnd, - -*/ - -/*! - \qmlproperty bool Arc::round - - Whether the arc outline end points have round caps. - - The \l roundBegin and \l roundEnd properties can be used to specify the - caps separately for the end points. - -*/ - -/*! - \qmlproperty bool Arc::roundBegin - - Whether the arc outline begins with a round cap. - - \sa Qt::PenCapStyle, round, roundEnd -*/ - -/*! - \qmlproperty bool Arc::roundEnd - - Whether the arc outline ends with a round cap. - - \sa Qt::PenCapStyle, round, roundBegin -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-border.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-border.qdoc deleted file mode 100644 index 93ce98cb5ad..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-border.qdoc +++ /dev/null @@ -1,310 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Border - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief A border drawn in four segments: left, top, right, and bottom. - - The Border type is used to create borders out of four segments: left, - top, right, and bottom. The \l drawLeft, \l drawTop, \l drawRight, and - \l drawBottom properties can be used to determine whether each of the - segments is visible. - - The \l borderMode property determines whether the border is drawn along - the inside or outside edge of the item, or on top of the edge. - - The \l radius property specifies whether the border corners are rounded. - The radius can also be specified separately for each corner. Because this - introduces curved edges to the corners, it may be appropriate to set the - \c antialiasing property that is inherited from \l Item to improve the - appearance of the border. - - The \l joinStyle property specifies how to connect two border line segments. - - The \l strokeColor, \l strokeWidth, and \l strokeStyle properties specify - the appearance of the border line. The \l dashPattern and \l dashOffset - properties specify the appearance of dashed lines. - - The \l capStyle property specifies whether line ends are square or - rounded. - - \section2 Example Usage - - You can use the Border component in \QDS to create different kinds of - borders. - - \image studio-border.png - - The QML code looks as follows: - - \code - BorderItem { - id: openLeft - width: 99 - height: 99 - antialiasing: true - drawLeft: false - strokeColor: "gray" - } - - BorderItem { - id: openTop - width: 99 - height: 99 - antialiasing: true - strokeColor: "#808080" - drawTop: false - } - - BorderItem { - id: asymmetricalCorners - width: 99 - height: 99 - antialiasing: true - bottomLeftRadius: 0 - topRightRadius: 0 - strokeColor: "#808080" - } - - BorderItem { - id: dashedBorder - width: 99 - height: 99 - antialiasing: true - strokeStyle: 4 - strokeColor: "#808080" - } - \endcode -*/ - -/*! - \qmlproperty int Border::radius - - The radius used to draw rounded corners. - - The default value is 10. - - If radius is non-zero, the corners will be rounded, otherwise they will - be sharp. The radius can also be specified separately for each corner by - using the \l bottomLeftRadius, \l bottomRightRadius, \l topLeftRadius, and - \l topRightRadius properties. -*/ - -/*! - \qmlproperty int Border::bottomLeftRadius - - The radius of the bottom left border corner. - - \sa radius -*/ - -/*! - \qmlproperty int Border::bottomRightRadius - - The radius of the bottom right border corner. - - \sa radius -*/ - -/*! - \qmlproperty int Border::topLeftRadius - - The radius of the top left border corner. - - \sa radius -*/ - -/*! - \qmlproperty int Border::topRightRadius - - The radius of the top right border corner. - - \sa radius -*/ - -/*! - \qmlproperty enumeration Border::capStyle - - The cap style of the line. - - \value ShapePath.FlatCap - A square line end that does not cover the end point of the line. - \value ShapePath.SquareCap - A square line end that covers the end point and extends beyond it - by half the line width. This is the default value. - \value ShapePath.RoundCap - A rounded line end. - - \sa Qt::PenCapStyle -*/ - -/*! - \qmlproperty ShapePath Border::dashOffset - - The starting point of the dash pattern for the border line. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath Border::dashPattern - - The dash pattern of the border line specified as the dashes and the gaps - between them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - Each dash is also subject to cap styles, and therefore a dash of 1 with - square cap set will extend 0.5 pixels out in each direction resulting in - a total width of 2. - - The default \l capStyle is \c {ShapePath.SquareCap}, meaning that a square - line end covers the end point and extends beyond it by half the line width. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty enumeration Border::joinStyle - - The join style used to connect two border line segments. - - \value ShapePath.MiterJoin - The outer edges of the lines are extended to meet at an angle, and - this area is filled. - \value ShapePath.BevelJoin - The triangular notch between the two lines is filled. - This is the default value. - \value ShapePath.RoundJoin - A circular arc between the two lines is filled. - - \sa Qt::PenJoinStyle -*/ - -/*! - \qmlproperty ShapePath Border::strokeColor - - The color of the border line. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty enumeration Border::strokeStyle - - The style of the border line. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath Border::strokeWidth - - The width of the border line. - - When set to a negative value, no line is drawn. - - The default value is 4. -*/ - -/*! - \qmlproperty bool Border::drawBottom - - Whether the bottom border is visible. - - The border segment is drawn if this property is set to \c true. -*/ - -/*! - \qmlproperty bool Border::drawLeft - - Whether the left border is visible. - - The border segment is drawn if this property is set to \c true. -*/ - -/*! - \qmlproperty bool Border::drawRight - - Whether the right border is visible. - - The border segment is drawn if this property is set to \c true. -*/ - -/*! - \qmlproperty bool Border::drawTop - - Whether the top border is visible. - - The border segment is drawn if this property is set to \c true. -*/ - -/*! - \qmlproperty enumeration Border::borderMode - - Where the border is drawn. - - \value Border.Inside - The border is drawn along the inside edge of the item and does not - affect the item width. - This is the default value. - \value Border.Middle - The border is drawn over the edge of the item and does not - affect the item width. - \value Border.Outside - The border is drawn along the outside edge of the item and increases - the item width by the value of \l strokeWidth. - - \sa strokeWidth -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-flipable.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-flipable.qdoc deleted file mode 100644 index 2d1b355f5e1..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-flipable.qdoc +++ /dev/null @@ -1,125 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2019 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Flipable - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \ingroup qtquickstudio-components - - \brief Provides a surface that can be flipped. - - A Flipable type can be visibly \e flipped between its front and back sides, - like a card. The front and back sides are specified by using any two types - inside the Flipable type. The type with the higher z-order is the front - side. The \l opacityFront and \l opacityBack properties are used to hide - and show either the front or back side of the item at a time. - - The \l flipAngle property is used to animate the angle of the type to - produce the flipping effect. The \l xAxis or \l yAxis property is set - to 1 to determine which axis the type is rotated around. - - \section2 Example Usage - - You can use the Flipable component in \QDS to create an item that can be - flipped. In this example, the two sides of the item show ISO 7000 icons. - - \image studio-flipable.png - - The QML code looks as follows: - - \code - FlipableItem { - id: flipable - width: 90 - height: 89 - opacityBack: 0 - - IsoItem { - id: arrowIsoIcon - color: "#808080" - anchors.fill: parent - source: "./iso-icons/iso_grs_7000_4_0251.dat" - } - - IsoItem { - id: questionIsoIcon - color: "#808080" - anchors.fill: parent - source: "./iso-icons/iso_grs_7000_4_0435.dat" - } - } - \endcode -*/ - -/*! - \qmlproperty Rotation Flipable::flipAngle - - The flip angle in degrees. - - The minimum value is -360 and the maximum value is 360 degrees. -*/ - -/*! - \qmlproperty real Flipable::opacityBack - - The opacity of the back side of the type. - - The opacity can be set between 0 and 1 to hide or show the items on the - back side of the type. -*/ - -/*! - \qmlproperty real Flipable::opacityFront - - The opacity of the front side of the type. - - The opacity can be set between 0 and 1 to hide or show the items on the - front side of the type. -*/ - -/*! - \qmlproperty int Flipable::xAxis - - Whether the type is rotated around the x-axis. - - This property is set to 1 to rotate the type around the x-axis. -*/ - -/*! - \qmlproperty int Flipable::yAxis - - Whether the type is rotated around the y-axis. - - This property is set to 1 to rotate the type around the y-axis. -*/ - -/*! - \qmlproperty bool Flipable::flipped - - Whether the type has been flipped. - - This property is set to \c true when the type is flipped. -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-group.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-group.qdoc deleted file mode 100644 index cca7a56eb8b..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-group.qdoc +++ /dev/null @@ -1,67 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2019 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Group - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits Item - \ingroup qtquickstudio-components - - \brief A group item that gets its size from its children. - - The Group type is an \l Item type extended with the size property. The value - of size is automatically calculated to fit the children of the group. - - \section2 Example Usage - - You can use the Group type to specify the size of one or several items. - - \image studio-group.png - - The QML code looks as follows: - - \code - GroupItem { - id: group - - Rectangle { - id: rectangle - width: 200 - height: 200 - color: "#c2c2c2" - } - - Rectangle { - id: rectangle1 - x: 140 - y: 140 - width: 200 - height: 200 - color: "#000000" - } - } - \endcode -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-iso.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-iso.qdoc deleted file mode 100644 index c0bec2cc692..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-iso.qdoc +++ /dev/null @@ -1,67 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Iso - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief An ISO 7000 icon. - - The Iso type specifies an icon from an ISO 7000 icon library as a - \l [QtQuickExtras] {Picture} - type. The icon to use for the type and its color can be specified. - - \section2 Example Usage - - You can use the Iso type in \QDS to add ISO 7000 icons. - - \image studio-flipable.png - - The QML code looks as follows: - - \code - IsoItem { - id: arrowIsoIcon - color: "#808080" - anchors.fill: parent - source: "./iso-icons/iso_grs_7000_4_0251.dat" - } - \endcode - - To select an icon in the \uicontrol {ISO Icon Browser} in \QDS, select - the ISO icon in the \uicontrol Navigator or \uicontrol {Form Editor}, - and then select \uicontrol {Choose Icon} in the context menu. - - \image iso-icon-browser.png -*/ - -/*! - \qmlproperty color Iso::iconColor - - The color of an ISO 7000 icon. -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-pie.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-pie.qdoc deleted file mode 100644 index 9804abae815..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-pie.qdoc +++ /dev/null @@ -1,250 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Pie - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief A pie. - - The Pie type is used to create a pie slice, a pie that is missing slices, - or just the pie rind (similar to an \l Arc), depending on the \l begin and - \l end property values and the \l hideLine value. - - The filling of the pie is painted using either a solid fill color, specified - using the \l fillColor property, or a gradient, defined using one of the - \l ShapeGradient subtypes and set using the \l gradient property. - If both a color and a gradient are specified, the gradient is used. - - The \l strokeColor, \l strokeWidth, and \l strokeStyle properties specify - the appearance of the pie outline. The \l dashPattern and \l dashOffset - properties specify the appearance of dashed lines. - - The \l capStyle property specifies whether line ends are square or - rounded. - - Because a pie has curved edges, it may be appropriate to set the - \c antialiasing property that is inherited from \l Item to improve - its appearance. - - \section2 Example Usage - - You can use the Pie component in \QDS to create different kinds of pies. - - \image studio-pie.png - - The QML code looks as follows: - - \code - PieItem { - id: pieSlice - antialiasing: true - strokeColor: "gray" - fillColor: "light gray" - } - - PieItem { - id: pie - end: 300 - fillColor: "#d3d3d3" - strokeColor: "#808080" - antialiasing: true - } - - PieItem { - id: pieRind - strokeWidth: 4 - capStyle: 32 - hideLine: true - end: 300 - strokeColor: "#808080" - antialiasing: true - } - \endcode -*/ - -/*! - \qmlproperty ShapePath Pie::capStyle - - The cap style of the line. - - \value ShapePath.FlatCap - A square line end that does not cover the end point of the line. - \value ShapePath.SquareCap - A square line end that covers the end point and extends beyond it - by half the line width. This is the default value. - \value ShapePath.RoundCap - A rounded line end. - - \sa Qt::PenCapStyle -*/ - -/*! - \qmlproperty ShapePath Pie::dashOffset - - The starting point of the dash pattern for the line. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath Pie::dashPattern - - The dash pattern of the line specified as the dashes and the gaps between - them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - Each dash is also subject to cap styles, and therefore a dash of 1 with - square cap set will extend 0.5 pixels out in each direction resulting in - a total width of 2. - - The default \l capStyle is \c {ShapePath.SquareCap}, meaning that a square - line end covers the end point and extends beyond it by half the line width. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty ShapePath Pie::fillColor - - The pie fill color. - - If \l hideLine is \c false, a pie slice is drawn using the values of the - \l begin and \l end properties and filled with this color. - - If \l hideLine is \c true, just the pie rind is drawn and the area between - the \l begin and \l end points is filled. - - A gradient for the fill can be specified by using \l gradient. If both a - color and a gradient are specified, the gradient is used. - - When set to \c transparent, no filling occurs. - - The default value is \c white. -*/ - -/*! - \qmlproperty ShapePath Pie::gradient - - The gradient of the pie fill color. - - By default, no gradient is enabled and the value is null. In this case, the - fill uses a solid color based on the value of \l fillColor. - - When set, \l fillColor is ignored and filling is done using one of the - \l ShapeGradient subtypes. - - \note The \l Gradient type cannot be used here. Rather, prefer using one of - the advanced subtypes, like \l LinearGradient. -*/ - -/*! - \qmlproperty ShapePath Pie::strokeColor - - The color of the line. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty ShapePath Pie::strokeStyle - - The style of the border line. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath Pie::strokeWidth - - The width of the line. - - When set to a negative value, no line is drawn. - - The default value is 4. -*/ - -/*! - \qmlproperty real Pie::begin - - The position in degrees where the pie begins. - - The default value is 0. - - To create a circle, set the value of this property to 0 and the value of the - \l end property to 360. -*/ - -/*! - \qmlproperty real Pie::end - - The position in degrees where the pie ends. - - The default value is 90. - - To create a circle, set the value of this property to 360 and the value of - the \l begin property to 0. -*/ - -/*! - \qmlproperty real Pie::alpha - - The area between \l begin and \l end. -*/ - - -/*! - \qmlproperty bool Pie::hideLine - - Whether to draw a pie slice or just the pie rind (similar to an \l Arc). -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-rectangle.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-rectangle.qdoc deleted file mode 100644 index f30f6fee940..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-rectangle.qdoc +++ /dev/null @@ -1,281 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Rectangle - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief A filled rectangle with an optional border. - - Rectangle items are used to fill areas with solid color or gradients and - to provide a rectangular border. - - Each Rectangle item is painted using either a solid fill color, specified - using the \l fillColor property, or a gradient, defined using one of the - \l ShapeGradient subtypes and set using the \l gradient property. - If both a color and a gradient are specified, the gradient is used. - - An optional border can be added to a rectangle with its own color and - thickness by setting the \l strokeColor and \l strokeWidth properties. - Setting the color to \c transparent creates a border without a fill color. - - Rounded rectangles can be drawn using the \l radius property. The radius - can also be specified separately for each corner. Because this introduces - curved edges to the corners of a rectangle, it may be appropriate to set - the \c antialiasing property that is inherited from \l Item to improve the - appearance of the rectangle. - - \section2 Example Usage - - You can use the Rectangle component in \QDS to create different kinds of - rectangles. - - \image studio-rectangle.png - - The QML code looks as follows: - - \code - RectangleItem { - id: rectangle - gradient: RadialGradient { - focalRadius: 0 - centerY: 38.5 - focalY: 38.5 - centerX: 51.5 - centerRadius: 38.5 - GradientStop { - position: 0 - color: "#ffffff" - } - - GradientStop { - position: 1 - color: "#000000" - } - focalX: 51.5 - } - bottomRightRadius: 0 - topLeftRadius: 0 - strokeColor: "gray" - } - - RectangleItem { - id: rectangle1 - gradient: LinearGradient { - y1: 0 - y2: 77 - x2: 103 - x1: 0 - GradientStop { - position: 0 - color: "#ffffff" - } - - GradientStop { - position: 1 - color: "#000000" - } - } - topRightRadius: 0 - bottomLeftRadius: 0 - strokeColor: "#808080" - } - - RectangleItem { - id: rectangle2 - topLeftRadius: 0 - bottomRightRadius: 0 - fillColor: "#d3d3d3" - strokeColor: "#808080" - } - - RectangleItem { - id: rectangle3 - fillColor: "#000000" - gradient: LinearGradient { - y1: 0 - y2: 77 - x2: 103 - x1: 0 - GradientStop { - position: 0 - color: "#000000" - } - - GradientStop { - position: 1 - color: "#fdf9f9" - } - } - topRightRadius: 0 - bottomLeftRadius: 0 - strokeColor: "#808080" - } - \endcode -*/ - -/*! - \qmlproperty int Rectangle::radius - - The radius used to draw rounded corners. - - The default value is 10. - - If radius is non-zero, the corners will be rounded, otherwise they will - be sharp. The radius can also be specified separately for each corner by - using the \l bottomLeftRadius, \l bottomRightRadius, \l topLeftRadius, and - \l topRightRadius properties. -*/ - -/*! - \qmlproperty int Rectangle::bottomLeftRadius - - The radius of the bottom left rectangle corner. -*/ - -/*! - \qmlproperty int Rectangle::bottomRightRadius - - The radius of the bottom right rectangle corner. -*/ - -/*! - \qmlproperty int Rectangle::topLeftRadius - - The radius of the top left rectangle corner. -*/ - -/*! - \qmlproperty int Rectangle::topRightRadius - - The radius of the top right rectangle corner. -*/ - -/*! - \qmlproperty ShapePath Rectangle::dashOffset - - The starting point of the dash pattern for the rectangle border. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath Rectangle::dashPattern - - The dash pattern of the rectangle border specified as the dashes and the - gaps between them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty ShapePath Rectangle::fillColor - - The rectangle fill color. - - A gradient for the fill can be specified by using \l gradient. If both a - color and a gradient are specified, the gradient is used. - - When set to \c transparent, no filling occurs. - - The default value is \c white. -*/ - -/*! - \qmlproperty ShapePath Rectangle::gradient - - The gradient of the rectangle fill color. - - By default, no gradient is enabled and the value is null. In this case, the - fill uses a solid color based on the value of \l fillColor. - - When set, \l fillColor is ignored and filling is done using one of the - \l ShapeGradient subtypes. - - \note The \l Gradient type cannot be used here. Rather, prefer using one of - the advanced subtypes, like \l LinearGradient. -*/ - -/*! - \qmlproperty ShapePath Rectangle::strokeColor - - The color used to draw the border of the rectangle. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty ShapePath Rectangle::strokeStyle - - The style of the rectangle border. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath Rectangle::strokeWidth - - The width of the border of the rectangle. - - The default value is 4. - - A width of 1 creates a thin line. For no line, use a negative value or a - transparent color. - - \note The width of the rectangle's border does not affect the geometry of - the rectangle itself or its position relative to other items if anchors are - used. - - The border is rendered within the rectangle's boundaries. -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-svgPath.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-svgPath.qdoc deleted file mode 100644 index 78a04e10835..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-svgPath.qdoc +++ /dev/null @@ -1,204 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype SvgPath - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief A path defined using an SVG path data string. - - The SvgPath type uses an SVG path data string to draw a path as a line. - - The \l strokeColor, \l strokeWidth, and \l strokeStyle, properties specify - the appearance of the path. The \l dashPattern and \l dashOffset properties - specify the appearance of dashed lines. - - The \l capStyle property specifies whether line ends are square or - rounded. - - The \l joinStyle property specifies how to connect two path segments. - If the path segments enclose areas, they can be painted using either - a solid fill color, specified using the \l fillColor property, or a - gradient, defined using one of the \l ShapeGradient subtypes and set - using the \l gradient property. If both a color and a gradient are - specified, the gradient is used. - - If the path has curves, it may be appropriate to set the \c antialiasing - property that is inherited from \l Item to improve its appearance. - - \note Mixing SvgPath with other types of elements is not always supported. - For example, when \l Shape is backed by \c GL_NV_path_rendering, a - \l ShapePath can contain one or more SvgPath elements, or one or more - elements of other types, but not both. -*/ - -/*! - \qmlproperty ShapePath SvgPath::capStyle - - The cap style of the line. - - \value ShapePath.FlatCap - A square line end that does not cover the end point of the line. - \value ShapePath.SquareCap - A square line end that covers the end point and extends beyond it - by half the line width. This is the default value. - \value ShapePath.RoundCap - A rounded line end. - - \sa Qt::PenCapStyle -*/ - -/*! - \qmlproperty ShapePath SvgPath::dashOffset - - The starting point of the dash pattern for the line. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath SvgPath::dashPattern - - The dash pattern of the line specified as the dashes and the gaps between - them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - Each dash is also subject to cap styles, and therefore a dash of 1 with - square cap set will extend 0.5 pixels out in each direction resulting in - a total width of 2. - - The default \l capStyle is \c {ShapePath.SquareCap}, meaning that a square - line end covers the end point and extends beyond it by half the line width. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty ShapePath SvgPath::fillColor - - The fill color of enclosed path segments. - - A gradient for the fill can be specified by using \l gradient. If both a - color and a gradient are specified, the gradient is used. - - When set to \c transparent, no filling occurs. - - The default value is \c white. -*/ - -/*! - \qmlproperty ShapePath SvgPath::gradient - - The gradient of the fill color. - - By default, no gradient is enabled and the value is null. In this case, the - fill uses a solid color based on the value of \l fillColor. - - When set, \l fillColor is ignored and filling is done using one of the - \l ShapeGradient subtypes. - - \note The \l Gradient type cannot be used here. Rather, prefer using one of - the advanced subtypes, like \l LinearGradient. -*/ - -/*! - \qmlproperty ShapePath SvgPath::joinStyle - - The join style used to connect two path segments. - - \value ShapePath.MiterJoin - The outer edges of the lines are extended to meet at an angle, and - this area is filled. - \value ShapePath.BevelJoin - The triangular notch between the two lines is filled. - This is the default value. - \value ShapePath.RoundJoin - A circular arc between the two lines is filled. - - \sa Qt::PenJoinStyle -*/ - -/*! - \qmlproperty ShapePath SvgPath::strokeColor - - The color of the line. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty ShapePath SvgPath::strokeStyle - - The style of the line. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath SvgPath::strokeWidth - - The width of the line. - - When set to a negative value, no line is drawn. - - The default value is 4. -*/ - -/*! - \qmlproperty string SvgPath::path - - The SVG path data string specifying the path. - - For more information, see \l{https://www.w3.org/TR/SVG/paths.html#PathData} - {W3C SVG Path Data}. -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-triangle.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-triangle.qdoc deleted file mode 100644 index eeb33fe2e6e..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/components/qqs-components-triangle.qdoc +++ /dev/null @@ -1,288 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2020 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \qmltype Triangle - \inqmlmodule QtQuick.Studio.Components - \since QtQuick.Studio.Components 1.0 - \inherits ShapePath - \ingroup qtquickstudio-components - - \brief A triangle. - - The Triangle type can be used to draw triangles with different dimensions - and shapes. The type is enclosed in an invisible \l Rectangle type. The size - of the triangle is determined by the size of the bounding rectangle. The - dimensions of the triangle can be changed to make it elongated or squat - with space around it by using the \l leftMargin, \l topMargin, - \l rightMargin, and \l bottomMargin properties. The margins are set between - the triangle and the edges of the parent rectangle. - - Each Triangle item is painted using either a solid fill color, specified - using the \l fillColor property, or a gradient, defined using one of the - \l ShapeGradient subtypes and set using the \l gradient property. - If both a color and a gradient are specified, the gradient is used. - - An optional border can be added to a triangle with its own color and - thickness by setting the \l strokeColor and \l strokeWidth properties. - Setting the color to \c transparent creates a border without a fill color. - - \section2 Example Usage - - You can use the Triangle component in \QDS to create triangles in different - shapes and colors. - - \image studio-triangle.png - - The QML code looks as follows: - - \code - TriangleItem { - id: triangle - strokeColor: "gray" - fillColor: "light gray" - } - - TriangleItem { - id: squatTriangle - bottomMargin: 10 - topMargin: 30 - fillColor: "#d3d3d3" - strokeColor: "#808080" - } - - TriangleItem { - id: elongatedTriangle - leftMargin: 15 - rightMargin: 15 - fillColor: "#d3d3d3" - strokeColor: "#808080" - } - - TriangleItem { - id: pear - radius: 20 - fillColor: "light gray" - bottomMargin: 10 - arcRadius: 20 - strokeColor: "#808080" - } - \endcode -*/ - -/*! - \qmlproperty ShapePath Triangle::dashOffset - - The starting point of the dash pattern for the triangle border. - - The offset is measured in terms of the units used to specify the dash - pattern. For example, a pattern where each stroke is four units long, - followed by a gap of two units, will begin with the stroke when drawn - as a line. However, if the dash offset is set to 4.0, any line drawn - will begin with the gap. Values of the offset up to 4.0 will cause part - of the stroke to be drawn first, and values of the offset between 4.0 and - 6.0 will cause the line to begin with part of the gap. - - The default value is 0. - - \sa QPen::setDashOffset() -*/ - -/*! - \qmlproperty ShapePath Triangle::dashPattern - - The dash pattern of the triangle border specified as the dashes and the - gaps between them. - - The dash pattern is specified in units of the pen's width. That is, a dash - with the length 5 and width 10 is 50 pixels long. - - The default value is (4, 2), meaning a dash of 4 * \l strokeWidth pixels - followed by a space of 2 * \l strokeWidth pixels. - - \sa QPen::setDashPattern() -*/ - -/*! - \qmlproperty ShapePath Triangle::fillColor - - The triangle fill color. - - A gradient for the fill can be specified by using \l gradient. If both a - color and a gradient are specified, the gradient is used. - - When set to \c transparent, no filling occurs. - - The default value is \c white. -*/ - -/*! - \qmlproperty ShapePath Triangle::gradient - - The gradient of the triangle fill color. - - By default, no gradient is enabled and the value is null. In this case, the - fill uses a solid color based on the value of \l fillColor. - - When set, \l fillColor is ignored and filling is done using one of the - \l ShapeGradient subtypes. - - \note The \l Gradient type cannot be used here. Rather, prefer using one of - the advanced subtypes, like \l LinearGradient. -*/ - -/*! - \qmlproperty enumeration Triangle::joinStyle - - The join style used to connect two triangle line segments. - - \value ShapePath.MiterJoin - The outer edges of the lines are extended to meet at an angle, and - this area is filled. - \value ShapePath.BevelJoin - The triangular notch between the two lines is filled. - This is the default value. - \value ShapePath.RoundJoin - A circular arc between the two lines is filled. - - \sa Qt::PenJoinStyle -*/ - -/*! - \qmlproperty ShapePath Triangle::strokeColor - - The color used to draw the border of the triangle. - - When set to \c transparent, no line is drawn. - - The default value is \c red. - - \sa QColor -*/ - -/*! - \qmlproperty ShapePath Triangle::strokeStyle - - The style of the triangle border. - - \value ShapePath.SolidLine - A solid line. This is the default value. - \value ShapePath.DashLine - Dashes separated by a few pixels. - The \l dashPattern property specifies the dash pattern. - - \sa Qt::PenStyle -*/ - -/*! - \qmlproperty ShapePath Triangle::strokeWidth - - The width of the border of the rectangle. - - The default value is 4. - - A width of 1 creates a thin line. For no line, use a negative value or a - transparent color. - - \note The width of the rectangle's border does not affect the geometry of - the rectangle itself or its position relative to other items if anchors are - used. - - The border is rendered within the rectangle's boundaries. -*/ - -/*! - \qmlproperty int Triangle::radius - - The radius used to draw rounded corners. - - The default value is 5. - - If radius is non-zero, the corners will be rounded, otherwise they will - be sharp. - - This property can be used together with the \l arcRadius property to - determine the shape of the triangle. - - \sa arcRadius -*/ - -/*! - \qmlproperty real Triangle::arcRadius - - The radius used to draw rounded corners. - - The default value is 5. - - If radius is non-zero, the corners will be rounded, otherwise they will - be sharp. - - This property can be used together with the \l radius property to - determine the shape of the triangle. -*/ - -/*! - \qmlproperty real Triangle::leftMargin - - The left margin between the triangle and the bounding rectangle. - - Setting the left and right margins makes the triangle thinner and moves it - away from the edge. - - \sa rightMargin, topMargin, bottomMargin -*/ - -/*! - \qmlproperty real Triangle::topMargin - - The top margin between the triangle and the bounding rectangle. - - Setting the top and bottom margins makes the triangle lower and moves it - away from the edge. - - \sa bottomMargin, leftMargin, rightMargin -*/ - -/*! - \qmlproperty real Triangle::rightMargin - - The left margin between the triangle and the bounding rectangle. - - Setting the left and right margins makes the triangle thinner and moves it - away from the edge. - - \sa leftMargin, topMargin, bottomMargin -*/ - -/*! - \qmlproperty real Triangle::bottomMargin - - The top margin between the triangle and the bounding rectangle. - - Setting the top and bottom margins makes the triangle shorter and moves it - away from the edge. - - \sa topMargin, leftMargin, rightMargin -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickdesigner-components.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickdesigner-components.qdoc deleted file mode 100644 index 8d1b90f7268..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickdesigner-components.qdoc +++ /dev/null @@ -1,50 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2019 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the Qt Design Studio documentation. -** -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** -****************************************************************************/ - -/*! - \page qtquickdesigner-components-overview.html - - \title Qt Quick Studio Components - - The Qt Quick Studio Components module provides sets of components and - effects enhanced for creating animated UIs. The components inherit - \l {Qt Quick Shapes QML Types}. The effects inherit the types in the - \l {Qt Graphical Effects} module. For more information about the effects, - see \l{2D Effects}. - - \section1 Using Studio Components - - A set of ready-made studio components are available for creating differently - shaped objects, such as arcs, pies, or triangles, as well as objects with - particular abilities, such as being visibly \e flipped between their front - and back sides, like a card. The studio components are built on top of - \l {Qt Quick Shapes QML Types}, with some additional properties. - - The following table summarizes the available studio components and contains - links to their documentation. - - \annotatedlist qtquickstudio-components - -*/ diff --git a/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickstudiocomponents-qmlmodule.qdoc b/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickstudiocomponents-qmlmodule.qdoc deleted file mode 100644 index 7f67c3daf26..00000000000 --- a/doc/qtdesignstudio/src/qtquickdesigner-components/qtquickstudiocomponents-qmlmodule.qdoc +++ /dev/null @@ -1,58 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2019 The Qt Company Ltd. -** Contact: https://www.qt.io/licensing/ -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:FDL$ -** Commercial License Usage -** Licensees holding valid commercial Qt licenses may use this file in -** accordance with the commercial license agreement provided with the -** Software or, alternatively, in accordance with the terms contained in -** a written agreement between you and The Qt Company. For licensing terms -** and conditions see https://www.qt.io/terms-conditions. For further -** information use the contact form at https://www.qt.io/contact-us. -** -** GNU Free Documentation License Usage -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of -** this file. Please review the following information to ensure -** the GNU Free Documentation License version 1.3 requirements -** will be met: https://www.gnu.org/licenses/fdl-1.3.html. -** $QT_END_LICENSE$ -** -****************************************************************************/ - -/*! - \qmlmodule QtQuick.Studio.Components 1.0 - \title Qt Quick Studio Components QML Types - \ingroup qmlmodules - \brief Provides components enhanced for creating animated UIs. - - A set of ready-made studio components are available for creating differently - shaped objects, such as arcs, pies, or triangles, as well as objects with - particular abilities, such as being visibly \e flipped between their front - and back sides, like a card. The studio components are built on top of - \l {Qt Quick Shapes QML Types}, with some additional properties. - - The QML types can be imported into your application using the following - import statements in your .qml file: - - \badcode - import QtQuick.Studio.Components 1.0 - \endcode - - \omit - \\ TODO: Include the omitted text when the module becomes a Qt module. - Currently, the components are a part of Qt Design Studio. - - To link against the module, add the following QT variable to your qmake .pro - file: - - \badcode - QT += studiocomponents - \endcode - \endomit -*/