diff options
| author | Richard Dale <richard.dale@codethink.co.uk> | 2013-07-04 09:56:52 +0100 |
|---|---|---|
| committer | Richard Dale <richard.dale@codethink.co.uk> | 2013-07-04 09:56:52 +0100 |
| commit | acf9e50d52c4d09a1aed9490bb2f3c5de7dce9bb (patch) | |
| tree | 5b05df5a9e67f397bc7629f0921bc30c64bcc03e /src/controls | |
| parent | a7e874ddf3496766903fc88e52fb61573c3d3f74 (diff) | |
| parent | aa4ddfd8443f07badc0899d835027e46c6e0dfd8 (diff) | |
| download | qtquickcontrols-baserock/morph.tar.gz | |
Merge v5.1.0 releasebaserock/morph
Diffstat (limited to 'src/controls')
33 files changed, 851 insertions, 534 deletions
diff --git a/src/controls/ApplicationWindow.qml b/src/controls/ApplicationWindow.qml index f2e181a5..602661a3 100644 --- a/src/controls/ApplicationWindow.qml +++ b/src/controls/ApplicationWindow.qml @@ -125,14 +125,6 @@ Window { /*! \internal */ default property alias data: contentArea.data - /*! \internal */ - Binding { - target: contentItem - property: "activeFocusOnTab" - when: activeFocusItem - value: activeFocusItem ? ( (activeFocusItem != contentItem) ? !activeFocusItem.activeFocusOnTab : true ) : false - } - color: syspal.window SystemPalette {id: syspal} diff --git a/src/controls/Button.qml b/src/controls/Button.qml index 1a9b198e..0a3cb131 100644 --- a/src/controls/Button.qml +++ b/src/controls/Button.qml @@ -72,20 +72,6 @@ BasicButton { */ property bool isDefault: false - /*! This property holds the text shown on the button. If the button has no - text, the \l text property will be an empty string. - - The default value is the empty string. - */ - property string text - - /*! This property holds the icon shown on the button. If the button has no - icon, the \l iconSource property will be an empty string. - - The default value is the empty string. - */ - property url iconSource - /*! Assign a \l Menu to this property to get a pull-down menu button. The default value is \c null. @@ -94,7 +80,7 @@ BasicButton { /*! \qmlproperty bool BasicButton::pressed - This property holds whether the button is pressed. */ + This property holds whether the button is being pressed. */ readonly property bool pressed: __behavior.effectivePressed || menu && menu.__popupVisible activeFocusOnTab: true @@ -115,6 +101,14 @@ BasicButton { value: button } + Binding { + target: button + property: "tooltip" + // We don't want a tooltip if it's the same as the button text + when: !!text && !(action && (!!action.tooltip || action.tooltip === text)) + value: "" + } + Connections { target: __behavior onEffectivePressedChanged: { diff --git a/src/controls/ComboBox.qml b/src/controls/ComboBox.qml index 7b13bc8e..9282c58d 100644 --- a/src/controls/ComboBox.qml +++ b/src/controls/ComboBox.qml @@ -80,23 +80,36 @@ import QtQuick.Controls.Private 1.0 Control { id: comboBox - /*! The model to populate the ComboBox from. */ + /*! \qmlproperty model ComboBox::model + The model to populate the ComboBox from. */ property alias model: popupItems.model + + /*! The model role used for populating the ComboBox. */ property string textRole: "" - /*! The index of the currently selected item in the ComboBox. */ + /*! \qmlproperty int ComboBox::currentIndex + The index of the currently selected item in the ComboBox. */ property alias currentIndex: popup.__selectedIndex - /*! The text of the currently selected item in the ComboBox. */ + + /*! \qmlproperty string ComboBox::currentText + The text of the currently selected item in the ComboBox. */ readonly property alias currentText: popup.selectedText /*! This property specifies whether the combobox should gain active focus when pressed. The default value is \c false. */ property bool activeFocusOnPress: false - /*! \internal */ + /*! \qmlproperty bool ComboBox::pressed + + This property holds whether the button is being pressed. */ readonly property bool pressed: mouseArea.pressed && mouseArea.containsMouse || popup.__popupVisible - /*! \internal */ - property alias __containsMouse: mouseArea.containsMouse + + /*! \qmlproperty bool ComboBox::hovered + + This property indicates whether the control is being hovered. + */ + readonly property alias hovered: mouseArea.containsMouse + /*! \internal */ property var __popup: popup diff --git a/src/controls/GroupBox.qml b/src/controls/GroupBox.qml index e358dd9d..4aa6a50f 100644 --- a/src/controls/GroupBox.qml +++ b/src/controls/GroupBox.qml @@ -159,7 +159,8 @@ Item { /*! \internal */ property alias __style: styleLoader.item - implicitWidth: (!anchors.fill ? container.calcWidth() : 0) + loader.leftMargin + loader.rightMargin + implicitWidth: Math.max((!anchors.fill ? container.calcWidth() : 0) + loader.leftMargin + loader.rightMargin, + sizeHint.implicitWidth + (checkable ? 24 : 6)) implicitHeight: (!anchors.fill ? container.calcHeight() : 0) + loader.topMargin + loader.bottomMargin Layout.minimumWidth: implicitWidth @@ -181,6 +182,7 @@ Item { property int rightMargin: __style ? __style.padding.right : 0 sourceComponent: styleLoader.item ? styleLoader.item.panel : null onLoaded: item.z = -1 + Text { id: sizeHint ; visible: false ; text: title } Loader { id: styleLoader property alias __control: groupbox @@ -212,7 +214,11 @@ Item { enabled: (!groupbox.checkable || groupbox.checked) property Item layoutItem: container.children.length === 1 ? container.children[0] : null - function calcWidth () { return (layoutItem ? (layoutItem.implicitWidth || layoutItem.width) : container.childrenRect.width) } - function calcHeight () { return (layoutItem ? (layoutItem.implicitHeight || layoutItem.height) : container.childrenRect.height) } + function calcWidth () { return (layoutItem ? (layoutItem.implicitWidth || layoutItem.width) + + (layoutItem.anchors.fill ? layoutItem.anchors.leftMargin + + layoutItem.anchors.rightMargin : 0) : container.childrenRect.width) } + function calcHeight () { return (layoutItem ? (layoutItem.implicitHeight || layoutItem.height) + + (layoutItem.anchors.fill ? layoutItem.anchors.topMargin + + layoutItem.anchors.bottomMargin : 0) : container.childrenRect.height) } }] } diff --git a/src/controls/ProgressBar.qml b/src/controls/ProgressBar.qml index 33e21514..e472e66e 100644 --- a/src/controls/ProgressBar.qml +++ b/src/controls/ProgressBar.qml @@ -98,6 +98,12 @@ Control { */ property int orientation: Qt.Horizontal + /*! \qmlproperty bool ProgressBar::hovered + + This property indicates whether the control is being hovered. + */ + readonly property alias hovered: hoverArea.containsMouse + /*! \internal */ style: Qt.createComponent(Settings.style + "/ProgressBarStyle.qml", progressbar) @@ -123,7 +129,13 @@ Control { implicitWidth:(__panel ? __panel.implicitWidth : 0) implicitHeight: (__panel ? __panel.implicitHeight: 0) - /* \internal */ + MouseArea { + id: hoverArea + anchors.fill: parent + hoverEnabled: true + } + + /*! \internal */ function setValue(v) { var newval = parseFloat(v) if (!isNaN(newval)) { diff --git a/src/controls/ScrollView.qml b/src/controls/ScrollView.qml index 31f69b8f..aa980ddd 100644 --- a/src/controls/ScrollView.qml +++ b/src/controls/ScrollView.qml @@ -86,8 +86,9 @@ import QtQuick.Controls.Styles 1.0 FocusScope { id: root - implicitWidth: 200 - implicitHeight: 100 + + implicitWidth: 240 + implicitHeight: 150 /*! This property tells the ScrollView if it should render @@ -146,8 +147,8 @@ FocusScope { /*! \internal */ property Component style: Qt.createComponent(Settings.style + "/ScrollViewStyle.qml", root) - /* \internal */ - property PaddedStyle __style: styleLoader.item + /*! \internal */ + property Style __style: styleLoader.item activeFocusOnTab: true @@ -236,11 +237,15 @@ FocusScope { property bool horizontalRecursionGuard: false property bool verticalRecursionGuard: false - horizontalMaximumValue: flickableItem ? flickableItem.contentWidth - viewport.width : 0 - verticalMaximumValue: flickableItem ? flickableItem.contentHeight - viewport.height + __viewTopMargin : 0 + horizontalMinimumValue: flickableItem ? flickableItem.originX : 0 + horizontalMaximumValue: flickableItem ? flickableItem.originX + flickableItem.contentWidth - viewport.width : 0 + + verticalMinimumValue: flickableItem ? flickableItem.originY : 0 + verticalMaximumValue: flickableItem ? flickableItem.originY + flickableItem.contentHeight - viewport.height + __viewTopMargin : 0 Connections { target: flickableItem + onContentYChanged: { wheelArea.verticalRecursionGuard = true wheelArea.verticalValue = flickableItem.contentY diff --git a/src/controls/Slider.qml b/src/controls/Slider.qml index 711c449b..64dcfff1 100644 --- a/src/controls/Slider.qml +++ b/src/controls/Slider.qml @@ -108,9 +108,16 @@ Control { /*! \qmlproperty bool Slider::pressed - This property indicates if slider handle is currently being pressed. + This property indicates whether the slider handle is being pressed. */ - property alias pressed: mouseArea.pressed + readonly property alias pressed: mouseArea.pressed + + /*! + \qmlproperty bool Slider::hovered + + This property indicates whether the control is being hovered. + */ + readonly property alias hovered: mouseArea.containsMouse /*! \qmlproperty real Slider::stepSize @@ -145,7 +152,7 @@ Control { /*! \qmlproperty bool Slider::activeFocusOnPress - This property indicates if the Slider should receive active focus when + This property indicates whether the Slider should receive active focus when pressed. */ property bool activeFocusOnPress: false @@ -153,7 +160,7 @@ Control { /*! \qmlproperty bool Slider::tickmarksEnabled - This property indicates if the Slider should display tickmarks + This property indicates whether the Slider should display tickmarks at step intervals. The default value is \c false. @@ -161,9 +168,6 @@ Control { property bool tickmarksEnabled: false /*! \internal */ - property bool __containsMouse: mouseArea.containsMouse - - /*! \internal */ property bool __horizontal: orientation === Qt.Horizontal /*! \internal */ @@ -174,19 +178,6 @@ Control { Accessible.role: Accessible.Slider Accessible.name: value - /*! - \qmlmethod Slider::formatValue - - This method returns the current slider value in a way that is more suitable - for user display, such as the \l value rounded to only two decimal places. - - By default this function returns the nearest \c int value. - */ - - function formatValue(v) { - return Math.round(v); - } - style: Qt.createComponent(Settings.style + "/SliderStyle.qml", slider) Keys.onRightPressed: value += (maximumValue - minimumValue)/10.0 @@ -210,6 +201,14 @@ Control { anchors.horizontalCenter: !__horizontal ? parent.horizontalCenter : undefined width: __panel.handleWidth height: __panel.handleHeight + + function updatePos() { + if (updateValueWhileDragging && !mouseArea.drag.active) + range.position = __horizontal ? x : y + } + + onXChanged: updatePos(); + onYChanged: updatePos(); } MouseArea { @@ -260,14 +259,6 @@ Control { } } - // Range position normally follows handle, except when - // 'updateValueWhileDragging' is false. - Binding { - when: updateValueWhileDragging && !mouseArea.drag.active - target: range - property: "position" - value: __horizontal ? fakeHandle.x : fakeHandle.y - } // During the drag, we simply ignore the position set from the range, this // means that setting a value while dragging will not "interrupt" the diff --git a/src/controls/SpinBox.qml b/src/controls/SpinBox.qml index ec563afc..b1f87cec 100644 --- a/src/controls/SpinBox.qml +++ b/src/controls/SpinBox.qml @@ -75,6 +75,8 @@ Control { id: spinbox /*! + \qmlproperty real SpinBox::value + The value of this SpinBox, clamped to \l minimumValue and \l maximumValue. The default value is \c{0.0}. @@ -82,6 +84,8 @@ Control { property alias value: validator.value /*! + \qmlproperty real SpinBox::minimumValue + The minimum value of the SpinBox range. The \l value is clamped to this value. @@ -90,6 +94,8 @@ Control { property alias minimumValue: validator.minimumValue /*! + \qmlproperty real SpinBox::maximumValue + The maximum value of the SpinBox range. The \l value is clamped to this value. If maximumValue is smaller than \l minimumValue, \l minimumValue will be enforced. @@ -98,7 +104,7 @@ Control { */ property alias maximumValue: validator.maximumValue - /*! + /*! \qmlproperty real SpinBox::stepSize The amount by which the \l value is incremented/decremented when a spin button is pressed. @@ -106,13 +112,16 @@ Control { */ property alias stepSize: validator.stepSize - /*! The suffix for the value. I.e "cm" */ + /*! \qmlproperty string SpinBox::suffix + The suffix for the value. I.e "cm" */ property alias suffix: validator.suffix - /*! The prefix for the value. I.e "$" */ + /*! \qmlproperty string SpinBox::prefix + The prefix for the value. I.e "$" */ property alias prefix: validator.prefix - /*! This property indicates the amount of decimals. + /*! \qmlproperty int SpinBox::decimals + This property indicates the amount of decimals. Note that if you enter more decimals than specified, they will be truncated to the specified amount of decimal places. The default value is \c{0}. @@ -125,12 +134,19 @@ Control { */ property alias font: input.font - /*! This property indicates if the Spinbox should get active + /*! This property indicates whether the Spinbox should get active focus when pressed. The default value is \c true. */ property bool activeFocusOnPress: true + /*! + \qmlproperty bool SpinBox::hovered + + This property indicates whether the control is being hovered. + */ + readonly property alias hovered: mouseArea.containsMouse + style: Qt.createComponent(Settings.style + "/SpinBoxStyle.qml", spinbox) /*! \internal */ @@ -148,7 +164,7 @@ Control { /*! \internal */ property alias __text: input.text - __controlState: QtObject { + __styleData: QtObject { readonly property bool upEnabled: value != maximumValue; readonly property alias upHovered: mouseUp.containsMouse readonly property alias upPressed: mouseUp.pressed @@ -157,8 +173,6 @@ Control { readonly property alias downPressed: mouseDown.pressed readonly property alias downHovered: mouseDown.containsMouse - readonly property alias containsMouse: mouseArea.containsMouse - readonly property int contentHeight: Math.max(input.implicitHeight, 16) readonly property int contentWidth: Math.max(maxSizeHint.implicitWidth, minSizeHint.implicitWidth) } diff --git a/src/controls/SplitView.qml b/src/controls/SplitView.qml index fc43874e..8214981a 100644 --- a/src/controls/SplitView.qml +++ b/src/controls/SplitView.qml @@ -53,13 +53,14 @@ import QtQuick.Controls.Private 1.0 as Private SplitView is a control that lays out items horizontally or vertically with a draggable splitter between each item. - There will always be one (and only one) item in the SplitView that has \l {Layout}{Layout.fillWidth} - set to \c true (or Layout.fillHeight, if orientation is Qt.Vertical). This means that the + There will always be one (and only one) item in the SplitView that has \l{Layout::fillWidth}{Layout.fillWidth} + set to \c true (or \l{Layout::fillHeight}{Layout.fillHeight}, if orientation is Qt.Vertical). This means that the item will get all leftover space when other items have been laid out. By default, the last visible child of the SplitView will have this set, but it can be changed by explicitly setting fillWidth to \c true on another item. As the fillWidth item will automatically be resized to fit the extra space, explicit assignments - to width and height will be ignored (but Layout.minimumWidth and Layout.maximumWidth will still be respected). + to width and height will be ignored (but \l{Layout::minimumWidth}{Layout.minimumWidth} and + \l{Layout::maximumWidth}{Layout.maximumWidth} will still be respected). A handle can belong to the item either on the left or top side, or on the right or bottom side: \list @@ -69,9 +70,17 @@ import QtQuick.Controls.Private 1.0 as Private This will again control which item gets resized when the user drags a handle, and which handle gets hidden when an item is told to hide. - SplitView supports setting attached \l Layout properties on child items, which means that you - can control minimumWidth, minimumHeight, maximumWidth and maximumHeight (in addition - to fillWidth/fillHeight) for each child. + + SplitView supports setting attached Layout properties on child items, which + means that you can set the following attached properties for each child: + \list + \li \l{Layout::minimumWidth}{Layout.minimumWidth} + \li \l{Layout::minimumHeight}{Layout.minimumHeight} + \li \l{Layout::maximumWidth}{Layout.maximumWidth} + \li \l{Layout::maximumHeight}{Layout.maximumHeight} + \li \l{Layout::fillWidth}{Layout.fillWidth} (\c true for only one child) + \li \l{Layout::fillHeight}{Layout.fillHeight} (\c true for only one child) + \endlist Example: @@ -117,14 +126,17 @@ Item { /*! This property holds the delegate that will be instantiated between each child item. Inside the delegate the following properties are available: - \list - \li int \c handleIndex - specifies the index of the splitter handle. The handle - between the first and the second item will get index 0, - the next handle index 1 etc. - \li bool \c pressed: the handle is being pressed. - \li bool \c resizing: the handle is being dragged. - \endlist - */ + + \table + \row \li readonly property bool styleData.index \li Specifies the index of the splitter handle. The handle + between the first and the second item will get index 0, + the next handle index 1 etc. + \row \li readonly property bool styleData.hovered \li The handle is being hovered. + \row \li readonly property bool styleData.pressed \li The handle is being pressed. + \row \li readonly property bool styleData.resizing \li The handle is being dragged. + \endtable + +*/ property Component handleDelegate: Rectangle { width: 1 height: 1 @@ -176,7 +188,7 @@ Item { continue if (splitterItems.children.length > 0) - handleLoader.createObject(splitterHandles, {"handleIndex":splitterItems.children.length - 1}) + handleLoader.createObject(splitterHandles, {"__handleIndex":splitterItems.children.length - 1}) item.parent = splitterItems i-- // item was removed from list item.widthChanged.connect(d.updateLayout) @@ -319,18 +331,21 @@ Item { id: handleLoader Loader { id: itemHandle - property int handleIndex: -1 - property alias containsMouse: mouseArea.containsMouse - property alias pressed: mouseArea.pressed - property bool resizing: mouseArea.drag.active - visible: __items[handleIndex + ((d.fillIndex >= handleIndex) ? 0 : 1)].visible + property int __handleIndex: -1 + property QtObject styleData: QtObject { + readonly property int index: __handleIndex + readonly property alias hovered: mouseArea.containsMouse + readonly property alias pressed: mouseArea.pressed + readonly property bool resizing: mouseArea.drag.active + onResizingChanged: root.resizing = resizing + } + visible: __items[__handleIndex + ((d.fillIndex >= __handleIndex) ? 0 : 1)].visible sourceComponent: handleDelegate onWidthChanged: d.updateLayout() onHeightChanged: d.updateLayout() onXChanged: moveHandle() onYChanged: moveHandle() - onResizingChanged: root.resizing = resizing MouseArea { id: mouseArea @@ -357,12 +372,12 @@ Item { var leftEdge, rightEdge, newWidth, leftStopX, rightStopX var i - if (d.fillIndex > handleIndex) { + if (d.fillIndex > __handleIndex) { // Resize item to the left. // Ensure that the handle is not crossing other handles. So // find the first visible handle to the left to determine the left edge: leftEdge = 0 - for (i=handleIndex-1; i>=0; --i) { + for (i=__handleIndex-1; i>=0; --i) { leftHandle = __handles[i] if (leftHandle.visible) { leftEdge = leftHandle[d.offset] + leftHandle[d.size] @@ -371,13 +386,13 @@ Item { } // Ensure: leftStopX >= itemHandle[d.offset] >= rightStopX - var min = d.accumulatedSize(handleIndex+1, __items.length, true) + var min = d.accumulatedSize(__handleIndex+1, __items.length, true) rightStopX = root[d.size] - min - itemHandle[d.size] leftStopX = Math.max(leftEdge, itemHandle[d.offset]) itemHandle[d.offset] = Math.min(rightStopX, Math.max(leftStopX, itemHandle[d.offset])) newWidth = itemHandle[d.offset] - leftEdge - leftItem = __items[handleIndex] + leftItem = __items[__handleIndex] // The next line will trigger 'updateLayout': leftItem[d.size] = newWidth } else { @@ -385,7 +400,7 @@ Item { // Ensure that the handle is not crossing other handles. So // find the first visible handle to the right to determine the right edge: rightEdge = root[d.size] - for (i=handleIndex+1; i<__handles.length; ++i) { + for (i=__handleIndex+1; i<__handles.length; ++i) { rightHandle = __handles[i] if (rightHandle.visible) { rightEdge = rightHandle[d.offset] @@ -394,13 +409,13 @@ Item { } // Ensure: leftStopX <= itemHandle[d.offset] <= rightStopX - min = d.accumulatedSize(0, handleIndex+1, true) + min = d.accumulatedSize(0, __handleIndex+1, true) leftStopX = min - itemHandle[d.size] rightStopX = Math.min((rightEdge - itemHandle[d.size]), itemHandle[d.offset]) itemHandle[d.offset] = Math.max(leftStopX, Math.min(itemHandle[d.offset], rightStopX)) newWidth = rightEdge - (itemHandle[d.offset] + itemHandle[d.size]) - rightItem = __items[handleIndex+1] + rightItem = __items[__handleIndex+1] // The next line will trigger 'updateLayout': rightItem[d.size] = newWidth } diff --git a/src/controls/StackView.qml b/src/controls/StackView.qml index c7b2366f..9559ea87 100644 --- a/src/controls/StackView.qml +++ b/src/controls/StackView.qml @@ -52,37 +52,38 @@ import "Private/StackView.js" as JSArray \brief Provides a stack-based navigation model. - StackView implements a stack-based navigation model. You use this view when you - have a set of interlinked information pages for the user to browse. - Items are pushed onto the stack as the user navigates deeper into the material, and - popped off again when he chooses to go back. + StackView implements a stack-based navigation model, which can be used + with a set of interlinked information pages. Items are pushed onto the stack + as the user navigates deeper into the material, and popped off again when he + chooses to go back. \section1 Using StackView in an Application Using the StackView in the application is typically a simple matter of adding - the StackView as a child of a Window. The stack is usually - anchored to the edges of the window, except at the top or bottom where it might - be anchored to a status bar, or some other similar UI component. - The stack can then be used by invoking its navigation methods. The first item - to show in the StackView is commonly loaded assigning it to \l initialItem. + the StackView as a child of a Window. The stack is usually anchored to the + edges of the window, except at the top or bottom where it might be anchored + to a status bar, or some other similar UI component. The stack can then be + used by invoking its navigation methods. The first item to show in the StackView + is commonly loaded assigning it to \l initialItem. + + \note Items pushed onto the stack view have \l{Supported Attached Properties}{Stack attached properties}. \section1 Basic Navigation - There are three primary navigation operations in StackView: push(), pop() and - replace (you replace by specifying argument \c replace to push()). + There are three primary navigation operations in StackView: push(), pop(), and + replace (replace by specifying argument \c replace to push()). These correspond to classic stack operations where "push" adds an item to the top of a stack, "pop" removes the top item from the stack, and "replace" is like a pop followed by a push in that it replaces the topmost item on the stack with a new item (but the applied transtition might be different). The topmost item - in the stack corresponds to the one that is \l{StackView::currentItem} {current}, - i.e. the one that is visible on - screen. That means that "push" is the logical equivalent of navigating forward or - deeper into the application, "pop" is the equivalent of navigation back and - "replace" is the equivalent of replacing the current item with a different item. - - Sometimes it is necessary to go back more than a single step in the stack, e.g. - to return to a "main" item or some kind of section item in the application. - For this use case, pop() can be provided with a item to pop to. This is called - an "unwind" operation as the stack gets unwound to the specified item. If the - item is not found then the stack unwinds until there is only a single item in + in the stack corresponds to the one that is \l{StackView::currentItem} {currently} + visible on the screen. That means that "push" is the logical equivalent of navigating + forward or deeper into the application, "pop" is the equivalent of navigating back, + and "replace" is the equivalent of replacing the current item. + + Sometimes it is necessary to go back more than a single step in the stack, for + example, to return to a "main" item or some kind of section item in the application. + For this use case, it is possible to specify an item as a parameter for pop(). + This is called an "unwind" operation as the stack gets unwound to the specified item. + If the item is not found then the stack unwinds until there is only a single item in the stack, which becomes the current item. To explicitly unwind to the bottom of the stack it is recommended to use \l{pop()} {pop(null)}, though technically any non-existent item will do. @@ -96,11 +97,11 @@ import "Private/StackView.js" as JSArray \li \l{pop()}{pop(A)} => [A] - "pop" transition between C and A \endlist - Note that when the stack is empty, a push() will not perform a - transition animation because there is nothing to transition from (which will - typically happend during application start-up). A pop() on a stack with - depth 1 or 0 is a no-operation. If removing all items from the stack is - needed, a separate function clear() is available. + \note Note that when the stack is empty, a push() will not perform a + transition animation because there is nothing to transition from (typically during + application start-up). A pop() on a stack with depth 1 or 0 is a no-operation. + If removing all items from the stack is needed, a separate function clear() is + available. Calling push() returns the item that was pushed onto the stack. Calling pop() returns the item that was popped off the stack. When pop() is @@ -108,22 +109,22 @@ import "Private/StackView.js" as JSArray popped, which will also be the one transitioning out) is returned. \section1 Deep Linking - Deep linking means launching an application into a particular state. For example - a Newspaper application could be launched into showing a particular article, - bypassing the front item (and possible a section item) that would normally have - to be navigated through to get to the article in question. In terms of StackView, deep - linking means the ability to modify the state of the stack so that - you e.g. push a set of items to the top of the stack, or that you completely reset + \e{Deep linking} means launching an application into a particular state. For example, + a newspaper application could be launched into showing a particular article, + bypassing the front item (and possibly a section item) that would normally have + to be navigated through to get to the article concerned. In terms of StackView, deep + linking means the ability to modify the state of the stack, so much so that it is + possible to push a set of items to the top of the stack, or to completely reset the stack to a given state. - The API for deep linking in StackView is the same as for basic navigation. If - you push an array instead of a single item then all the items in that array will + The API for deep linking in StackView is the same as for basic navigation. Pushing + an array instead of a single item, will involve that all the items in that array will be pushed onto the stack. The transition animation, however, will be conducted as if only the last item in the array was pushed onto the stack. The normal semantics - of push() apply for deep linking, meaning that push() adds whatever you push onto - the stack. Note also that only the last item in the array will actually be loaded. - The rest will be lazy loaded as needed when entering - the screen upon subsequent calls to pop (or when requesting the item by using \a get). + of push() apply for deep linking, meaning that push() adds whatever is pushed onto + the stack. Note also that only the last item of the array will be loaded. + The rest will be lazy-loaded as needed when entering the screen upon subsequent + calls to pop (or when requesting the item by using \a get). This gives us the following result, given the stack [A, B, C]: @@ -135,93 +136,95 @@ import "Private/StackView.js" as JSArray \section1 Pushing items - An item you push onto the StackView can be either an Item, a URL, a - string with a URL, or a Component. To push it, you assign it - to a property "item" inside a property list, and send it as argument to \l{StackView::push}{push}: + An item pushed onto the StackView can be either an Item, a URL, a string + with a URL, or a Component. To push it, assign it to a property "item" + inside a property list, and send it as an argument to \l{StackView::push}{push}: \code stackView.push({item: yourItem}) \endcode - The list can contain several properties that controls how the item should be pushed: + The list can contain several properties that control how the item should be pushed: \list - \li \c item: This property is required, and holds the item you want to push. - \li \c properties: You can set a property list of QML properties that should be assigned - to the item upon push. These properties will be copied into the item at the - time the item is loaded, or about to become the current item (normally upon push). - \li \c immediate: Set this property to \c true to skip transition effects. When pushing - an array, you only need to set this property on the first element to make the + \li \c item: this property is required, and holds the item to be pushed. + \li \c properties: a list of QML properties to be assigned to the item upon push. These + properties will be copied into the item at load time, or when the item will become + the current item (normally upon push). + \li \c immediate: set this property to \c true to skip transition effects. When pushing + an array, this property only needs to be set on the first element to make the whole operation immediate. - \li \c replace: Set this property to replace the current item on the stack. When pushing + \li \c replace: set this property to replace the current item on the stack. When pushing an array, you only need to set this property on the first element to replace as many elements on the stack as inside the array. - \li \c destroyOnPop: Set this property to be explicit to whether or not StackView should - destroy the item when its popped off the stack. By default (if \a destroyOnPop is - not specified), StackView will destroy items pushed as components or URLs. Items - not destroyed will be reparented back to the original parents they had before being - pushed onto the stack, and hidden. If you need to set this property, do it with - care, so that items are not leaked. + \li \c destroyOnPop: set this boolean to true if StackView needs to destroy the item when + it is popped off the stack. By default (if \a destroyOnPop is not specified), StackView + will destroy items pushed as components or URLs. Items not destroyed will be re-parented + back to the original parents they had before being pushed onto the stack and hidden. + If you need to set this property, do it with care, so that items are not leaked. \endlist - If the only argument needed is "item", you can also, as a short-hand - notation, do: + If the only argument needed is "item", the following short-hand notation can be applied: \code - stackView.push(yourItem). + stackView.push(yourItem) \endcode You can push several items in one go by using an array of property lists. This is optimizing compared to pushing items one by one, since StackView then can load only the last item in the list. The rest will be loaded as they are about to become - the current item (which happends when the stack is popped). The following example shows how + the current item (which happens when the stack is popped). The following example shows how to push an array of items: \code stackView.push([{item: yourItem1}, {item: yourItem2}]) \endcode - If inline items are pushed, the item gets re-parented into an internal - container in the StackView. When the item is later popped off, it gets - re-parented back to its original owner. If, however, an item is pushed - as a component or a URL, the actual item will be created as a item from that component. This - happens automatically when the item is about to become the current item in the stack. Ownership - over the item will then normally be taken by the StackView. It will as such automatically - destroy the item when it is later popped off. The component that declared the item, by + If an inline item is pushed, the item is temporarily re-parented into the StackView. When the item + is later popped off, it gets re-parented back to its original owner again. + If, however, an item is pushed as a component or a URL, the actual item will be created as an + item from that component. This happens automatically when the item is about to become the current + item in the stack. Ownership of the item will then normally be taken by the StackView. It will as + such automatically destroy the item when it is later popped off. The component that declared the item, by contrast, remains in the ownership of the application and is not destroyed by the stack. - You can override this behavior if needed by explicitly setting "destroyOnPop" in the list - argument given to push. + This can be overridden by explicitly setting \c{destroyOnPop} in the list of arguments given to push. - If you specify the \c properties property to push, these properties will be copied into - the item at the time the item is loaded (in case of a component or URL), or instead when - its about to become the current item (in case of an inline item). This normally happens when - the item is pushed. The following example shows how this can be done: + If the \c properties to be pushed are specified, they will be copied into the item at loading time + (in case of a component or URL), or when the item will become the current item (in case of an inline + item). The following example shows how this can be done: \code - stackView.push({item: someItem, properties: {fgcolor: "red", bgcolor: "blue"}}); + stackView.push({item: someItem, properties: {fgcolor: "red", bgcolor: "blue"}}) \endcode - Note that if an item is declared inside another item that is destroyed - even if a component - was used - that child item also gets destroyed. - This follows normal Qt parent-child destruction rules but sometimes comes as a surprise - for developers. In practice this means that if you declare a item B as a child of - item A and then do a replace from item A to item B, then item B will be destroyed when - item A was destroyed (as it was popped off the stack) and the application will effectively - be switching to a item that has been destroyed. + + \note Note that if an item is declared inside another item, and if that parent gets destroyed, + (even if a component was used), that child item will also be destroyed. + This follows normal Qt parent-child destruction rules, but sometimes comes as a surprise + for developers. \section1 Lifecycle - An items lifecycle in the StackView goes from instantiation to inactive, activating, active, - deactivating, inactive, and when no longer needed, destruction. + An item's lifecycle in the StackView can have the following transitions: + \list 1 + \li instantiation + \li inactive + \li activating + \li active + \li deactivating + \li inactive + \li destruction + \endlist + It can move any number of times between inactive and active. When an item is activated, it's visible on the screen and is considered to be the current item. An item in a StackView that is not visible is not activated, even if the item is currently the - top-most item in the stack. When the stack becomes visible the item that is top-most gets - activated. Likewise if the stack is then hidden, the top-most item would be deactivated. + top-most item in the stack. When the stack becomes visible, the item that is top-most gets + activated. Likewise if the stack is then hidden, the topmost item would be deactivated. Popping the item off the top of the stack at this point would not result in further deactivation since the item is not active. - There is an attached \l{Stack::status}{Stack.status} property that tracks the lifecycle. The value of status is - an enumeration with values \c Stack.Inactive, \c Stack.Activating, \c Stack.Active - and \c Stack.Deactivating. Combined with the normal \c Component.onComplete and + There is an attached \l{Stack::status}{Stack.status} property that tracks the lifecycle. The + status values list is an enumeration with values \c Stack.Inactive, \c Stack.Activating, + \c Stack.Active and \c Stack.Deactivating. Combined with the normal \c Component.onComplete and \c Component.onDestruction signals the entire lifecycle is thus: \list @@ -234,26 +237,26 @@ import "Private/StackView.js" as JSArray \endlist \section1 Finding items - Sometimes it is necessary to search for a item, e.g. in order to unwind the stack to + Sometimes it is necessary to search for an item, for example, in order to unwind the stack to an item to which the application does not have a reference. This is facilitated using a function find() in StackView. The find() function takes a callback function as its only argument. The callback gets invoked for each item in the stack (starting at the top). - If the callback returns true then it signals that a match has been found and the find() - function returns that item. If the callback fails to return true (i.e. no match is found) + If the callback returns true, then it signals that a match has been found and the find() + function returns that item. If the callback fails to return true (no match is found), then find() returns \c null. - The code below searches for an item in the stack that has a name "foo" and then unwinds to - that item. Note that since find() returns null if no item is found and since pop unwinds to - the bottom of the stack if null is given as the target item, the code works well even in the - case that no matching item was found. + The code below searches for an item in the stack that has a name "order_id" and then unwinds to + that item. Note that since find() returns \c {null} if no item is found, and since pop unwinds to + the bottom of the stack if null is given as the target item, the code works well even in + case no matching item is found. \code stackView.pop(stackView.find(function(item) { - return item.name == "foo"; + return item.name == "order_id"; })); \endcode - You can also get to a item in the stack using get(index). You should use + You can also get to an item in the stack using \l {get()}{get(index)}. You should use this function if your item depends on another item in the stack, as the function will ensure that the item at the given index gets loaded before it is returned. @@ -314,8 +317,8 @@ import "Private/StackView.js" as JSArray Implement this function to reset any properties animated on the exitItem so that later transitions can expect the items to be in a default state. - A more complex example could look like the following. Here, the items slides in lying on the side before - they are rotated up in an upright position: + A more complex example could look like the following. Here, the items are lying on the side before + being rotated to an upright position: \qml StackView { @@ -374,7 +377,7 @@ import "Private/StackView.js" as JSArray depending on the their internal state. StackView will expect you to return a Component that contains a StackViewTransition, or a StackViewTransition directly. The former is easier, as StackView will then create the transition and later destroy it when it's done, while avoiding any sideeffects - caused by the transition being alive long after it ran. Returning a StackViewTransition directly + caused by the transition being alive long after it has run. Returning a StackViewTransition directly can be useful if you need to write some sort of transition caching for performance reasons. As an optimization, you can also return \c null to signal that you just want to show/hide the items immediately without creating or running any transitions. You can also override this function if @@ -383,9 +386,9 @@ import "Private/StackView.js" as JSArray \c properties contains the properties that will be assigned to the StackViewTransition before it runs. In fact, you can add more properties to this object during the call if you need to initialize additional properties of your custom StackViewTransition when the returned - component is instanciated. + component is instantiated. - The following example shows how you can decide run-time which animation to use: + The following example shows how you can decide which animation to use during runtime : \qml StackViewDelegate { @@ -435,6 +438,15 @@ import "Private/StackView.js" as JSArray } } \endqml + + \section1 Supported Attached Properties + + Items in a StackView support these attached properties: + \list + \li \l{Stack::index}{Stack.index} - Contains the index of the item inside the StackView + \li \l{Stack::view}{Stack.view} - Contains the StackView the item is in + \li \l{Stack::status}{Stack.status} - Contains the status of the item + \endlist */ Item { @@ -480,28 +492,28 @@ Item { /*! Pushes an item onto the stack. The function takes a property list as argument, which should contain one or more of the following properties: \list - \li \c item: This property is required, and holds the item you want to push. - \li \c properties: You can set a property list of QML properties that should be assigned - to the item upon push. These properties will be copied into the item at the - time the item is loaded (in case of a component or URL), or else the first time it - becomes the current item (normally upon push). - \li \c immediate: Set this property to \c true to skip transition effects. When pushing + \li \c item: this property is required, and holds the item you want to push. + \li \c properties: a list of QML properties that should be assigned + to the item upon push. These properties will be copied into the item when it is + loaded (in case of a component or URL), or when it becomes the current item for the + first time (normally upon push). + \li \c immediate: set this property to \c true to skip transition effects. When pushing an array, you only need to set this property on the first element to make the whole operation immediate. - \li \c replace: Set this property to replace the current item on the stack. When pushing + \li \c replace: set this property to replace the current item on the stack. When pushing an array, you only need to set this property on the first element to replace as many elements on the stack as inside the array. - \li \c destroyOnPop: Set this property to be explicit to whether or not StackView should - destroy the item when its popped off the stack. By default (if \a destroyOnPop is - not specified), StackView will destroy items pushed as components or URLs. Items - not destroyed will be reparented back to the original parents they had before being + \li \c destroyOnPop: set this property to specify if the item needs to be destroyed + when its popped off the stack. By default (if \a destroyOnPop is not specified), + StackView will destroy items pushed as components or URLs. Items + not destroyed will be re-parented to the original parents they had before being pushed onto the stack, and hidden. If you need to set this property, do it with care, so that items are not leaked. \endlist You can also push an array of items (property lists) if you need to push several items in one go. A transition will then only occur between the current item and the last - item in the list. The other items will be deferred loaded until needed. + item in the list. Loading the other items will be deferred until needed. Examples: \list @@ -513,8 +525,8 @@ Item { \li stackView.push([{item:anitem, immediate:true}, {item:aURL}]) \endlist - Note: If the only argument needed is "item", you can also, as a short-hand - notation, do: \c{stackView.push(anItem)}. + \note Note: if the only argument needed is "item", you can apply the following short- + hand notation: \c{stackView.push(anItem)}. Returns the item that became current. @@ -570,11 +582,11 @@ Item { /*! Pops one or more items off the stack. The function takes a property list as argument which can contain one or more of the following properties: \list - \li \c item: If specified, all items down to (but not including) \a item will be - popped off. if \a item is \c null, all items down to (but not including) the + \li \c item: if specified, all items down to (but not including) \a item will be + popped off. If \a item is \c null, all items down to (but not including) the first item will be popped. If not specified, only the current item will be popped. - \li \c immediate: Set this property to \c true to skip transition effects. + \li \c immediate: set this property to \c true to skip transition effects. \endlist Examples: @@ -585,8 +597,8 @@ Item { \li stackView.pop(null) \endlist - Note: If the only argument needed is "item", you can also, as a short-hand - notation, do: \c{stackView.pop(anItem)}. + \note Note: If the only argument needed is "item", you can apply the following short- + hand notation: \c{stackView.pop(anItem)}. Returns the item that was popped off \sa clear() @@ -657,7 +669,8 @@ Item { /*! Search for a specific item inside the stack. \a func will be called for each item in the stack (with the item as argument) - until the function returns true. Return value will be the item found. E.g: + until the function returns true. Return value will be the item found. For + example: find(function(item, index) { return item.isTheOne }) Set \a onlySearchLoadedItems to \c true to not load items that are not loaded into memory */ @@ -783,7 +796,7 @@ Item { element.destroyOnPop = true } } else { - // comp is already an Item, so just reparent it into the StackView: + // comp is already an Item, so just re-parent it into the StackView: element.item = comp element.originalParent = parent element.item.parent = root @@ -797,7 +810,7 @@ Item { } element.item.Stack.__index = element.index - element.item.Stack.__stackView = root + element.item.Stack.__view = root // Let item fill all available space by default: element.item.width = Qt.binding(function() { return root.width }) element.item.height = Qt.binding(function() { return root.height }) @@ -833,7 +846,7 @@ Item { /*! \internal */ function __cleanup(element) { // INVARIANT: element has been removed from JSArray. Destroy its - // item, or reparent it back to the parent it had before it was pushed: + // item, or re-parent it back to the parent it had before it was pushed: var item = element.item if (element.destroyOnPop) { item.destroy() @@ -842,7 +855,7 @@ Item { // might reenter on pop if pushed several times: item.visible = false __setStatus(item, Stack.Inactive) - item.Stack.__stackView = null + item.Stack.__view = null item.Stack.__index = -1 if (element.originalParent) item.parent = element.originalParent @@ -860,7 +873,7 @@ Item { // Animate item in "outElement" out, and item in "inElement" in. Set a guard to protect // the user from pushing new items on signals that will fire while preparing for the transition // (e.g Stack.onCompleted, Stack.onStatusChanged, Stack.onIndexChanged etc). Otherwise, we will enter - // this function several times, which causes the items to be half-way updated. + // this function several times, which causes the items to be updated half-way. if (__currentTransition) __currentTransition.animation.complete() __loadElement(transition.inElement) @@ -871,7 +884,7 @@ Item { // Since an item can be pushed several times, we need to update its properties: enterItem.parent = root - enterItem.Stack.__stackView = root + enterItem.Stack.__view = root enterItem.Stack.__index = transition.inElement.index __currentItem = enterItem diff --git a/src/controls/StatusBar.qml b/src/controls/StatusBar.qml index 13edc5ef..85cc6681 100644 --- a/src/controls/StatusBar.qml +++ b/src/controls/StatusBar.qml @@ -52,14 +52,20 @@ import QtQuick.Controls.Private 1.0 The common way of using StatusBar is in relation to \l ApplicationWindow. Note that the StatusBar does not provide a layout of its own, but requires - you to position its contents, for instance by creating a \l Row. + you to position its contents, for instance by creating a \l RowLayout. + + If only a single item is used within the StatusBar, it will resize to fit the implicitHeight + of its contained item. This makes it particularly suitable for use together with layouts. + Otherwise the height is platform dependent. \code + import QtQuick.Controls 1.0 + import QtQuick.Layouts 1.0 + ApplicationWindow { statusBar: StatusBar { - Label { - text: "Read Only" - anchors.centerIn: parent + RowLayout { + Label { text: "Read Only" } } } } @@ -68,16 +74,72 @@ import QtQuick.Controls.Private 1.0 Item { id: statusbar + activeFocusOnTab: false Accessible.role: Accessible.StatusBar + width: parent ? parent.width : implicitWidth - implicitWidth: loader.item.implicitHeight - implicitHeight: loader.item ? loader.item.implicitHeight : 0 + implicitWidth: container.leftMargin + container.rightMargin + container.calcWidth() + implicitHeight: Math.max(container.topMargin + container.bottomMargin + container.calcHeight(), + loader.item ? loader.item.implicitHeight : 19) + + /*! \internal */ property Component style: Qt.createComponent(Settings.style + "/StatusBarStyle.qml", statusbar) - Loader { - id: loader - anchors.fill: parent - sourceComponent: style - property var __control: statusbar - } + + /*! \internal */ + property alias __style: styleLoader.item + + /*! \internal */ + default property alias __content: container.data + + /*! + \qmlproperty Item StatusBar::contentItem + + This property holds the content Item of the status bar. + + Items declared as children of a StatusBar are automatically parented to the StatusBar's contentItem. + Items created dynamically need to be explicitly parented to the contentItem: + + \note The implicit size of the StatusBar is calculated based on the size of its content. If you want to anchor + items inside the status bar, you must specify an explicit width and height on the StatusBar itself. + */ + readonly property alias contentItem: container + + data: [ + Loader { + id: loader + anchors.fill: parent + sourceComponent: styleLoader.item ? styleLoader.item.panel : null + onLoaded: item.z = -1 + Loader { + id: styleLoader + property alias __control: statusbar + sourceComponent: style + } + }, + Item { + id: container + z: 1 + focus: true + anchors.fill: parent + + anchors.topMargin: topMargin + anchors.leftMargin: leftMargin + anchors.rightMargin: rightMargin + anchors.bottomMargin: bottomMargin + + property int topMargin: __style ? __style.padding.top : 0 + property int bottomMargin: __style ? __style.padding.bottom : 0 + property int leftMargin: __style ? __style.padding.left : 0 + property int rightMargin: __style ? __style.padding.right : 0 + + property Item layoutItem: container.children.length === 1 ? container.children[0] : null + function calcWidth() { return (layoutItem ? (layoutItem.implicitWidth || layoutItem.width) + + (layoutItem.anchors.fill ? layoutItem.anchors.leftMargin + + layoutItem.anchors.rightMargin : 0) : + loader.item ? loader.item.implicitWidth: 0) } + function calcHeight () { return (layoutItem ? (layoutItem.implicitHeight || layoutItem.height) + + (layoutItem.anchors.fill ? layoutItem.anchors.topMargin + + layoutItem.anchors.bottomMargin : 0) : loader.item ? loader.item.implicitHeight : 0) } + }] } diff --git a/src/controls/TabView.qml b/src/controls/TabView.qml index d292ce05..6319d72c 100644 --- a/src/controls/TabView.qml +++ b/src/controls/TabView.qml @@ -55,7 +55,8 @@ import QtQuick.Controls.Private 1.0 FocusScope { id: root - implicitWidth: 150 + + implicitWidth: 240 implicitHeight: 150 /*! The current tab index */ @@ -133,7 +134,7 @@ FocusScope { } /*! Returns the \l Tab item at \a index. */ - function tabAt(index) { + function getTab(index) { return __tabs.get(index).tab } @@ -198,7 +199,7 @@ FocusScope { anchors.fill: parent anchors.margins: (frameVisible ? frameWidth : 0) anchors.topMargin: anchors.margins + (style =="mac" ? 6 : 0) - anchors.bottomMargin: anchors.margins + (style =="mac" ? 6 : 0) + anchors.bottomMargin: anchors.margins property int frameWidth property string style diff --git a/src/controls/TableView.qml b/src/controls/TableView.qml index ca0df45a..b02a49c0 100644 --- a/src/controls/TableView.qml +++ b/src/controls/TableView.qml @@ -65,8 +65,7 @@ import QtQuick.Controls.Styles 1.0 \endcode You provide title and size of a column header - by adding a \l TableViewColumn to the default \l header property - as demonstrated below. + by adding a \l TableViewColumn as demonstrated below. \code TableView { @@ -124,26 +123,37 @@ ScrollView { The default value is \c true. */ property bool headerVisible: true + /*! \qmlproperty bool TableView::backgroundVisible + + This property determines if the background should be filled or not. + + The default value is \c true. + + \note The rowDelegate is not affected by this property + */ + property alias backgroundVisible: colorRect.visible + /*! This property defines a delegate to draw a specific cell. In the item delegate you have access to the following special properties: \list - \li itemSelected - if the item is currently selected - \li itemValue - the value or text for this item - \li itemTextColor - the default text color for an item - \li row - the index of the row - \li column - the index of the column - \li itemElideMode - the elide mode of the column - \li itemTextAlignment - the horizontal text alignment of the column + \li styleData.selected - if the item is currently selected + \li styleData.value - the value or text for this item + \li styleData.textColor - the default text color for an item + \li styleData.row - the index of the row + \li styleData.column - the index of the column + \li styleData.elideMode - the elide mode of the column + \li styleData.textAlignment - the horizontal text alignment of the column \endlist + Example: \code itemDelegate: Item { Text { anchors.verticalCenter: parent.verticalCenter - color: itemTextColor - elide: itemElideMode - text: itemValue + color: styleData.textColor + elide: styleData.elideMode + text: styleData.value } } \endcode */ @@ -153,20 +163,23 @@ ScrollView { In the row delegate you have access to the following special properties: \list - \li alternateBackground - if the row uses the alternate background color - \li rowSelected - if the row is currently selected - \li index - the index of the row + \li styleData.alternate - true when the row uses the alternate background color + \li styleData.selected - true when the row is currently selected + \li styleData.row - the index of the row \endlist */ property Component rowDelegate: __style ? __style.rowDelegate : null - /*! \qmlproperty color TableView::backgroundColor + /*! This property defines a delegate to draw a header. - This property sets the background color of the viewport. - The default value is the base color of the SystemPalette. */ - property alias backgroundColor: colorRect.color - - /*! This property defines a delegate to draw a header. */ + In the header delegate you have access to the following special properties: + \list + \li styleData.value - the value or text for this item + \li styleData.column - the index of the column + \li styleData.pressed - true when the column is being pressed + \li styleData.containsMouse - true when the column is under the mouse + \endlist + */ property Component headerDelegate: __style ? __style.headerDelegate : null /*! Index of the current sort column. @@ -190,9 +203,8 @@ ScrollView { */ property int sortIndicatorOrder: Qt.AscendingOrder - /*! \qmlproperty list<TableViewColumn> TableView::columns - This property contains the TableViewColumn items */ - default property alias columns: listView.columnheader + /*! \internal */ + default property alias __columns: root.data /*! \qmlproperty Component TableView::contentHeader This is the content header of the TableView */ @@ -206,8 +218,9 @@ ScrollView { The current number of rows */ readonly property alias rowCount: listView.count - /*! The current number of columns */ - readonly property int columnCount: columns.length + /*! \qmlproperty int TableView::columnCount + The current number of columns */ + readonly property alias columnCount: columnModel.count /*! \qmlproperty string TableView::section.property \qmlproperty enumeration TableView::section.criteria @@ -226,10 +239,30 @@ ScrollView { /*! \internal */ property alias __currentRowItem: listView.currentItem - /*! \qmlsignal TableView::activated() - Emitted when the user activates an item by single or double-clicking (depending on the platform). + /*! \qmlsignal TableView::activated(int row) + + Emitted when the user activates an item by mouse or keyboard interaction. + Mouse activation is triggered by single- or double-clicking, depending on the platform. + + \a row int provides access to the activated row index. */ - signal activated + signal activated(int row) + + /*! \qmlsignal TableView::clicked(int row) + + Emitted when the user clicks a valid row by single clicking + + \a row int provides access to the clicked row index. + */ + signal clicked(int row) + + /*! \qmlsignal TableView::doubleClicked(int row) + + Emitted when the user double clicks a valid row. + + \a row int provides access to the clicked row index. + */ + signal doubleClicked(int row) /*! \qmlmethod TableView::positionViewAtRow( int row, PositionMode mode ) @@ -255,13 +288,13 @@ ScrollView { Depending on how the model is populated, the model may not be ready when TableView Component.onCompleted is called. In that case you may need to - delay the call to positionViewAtRow by using a \l {Timer}. + delay the call to positionViewAtRow by using a \l {QtQml::Timer}{Timer}. \note This method should only be called after the component has completed. */ function positionViewAtRow(row, mode) { - listView.positionViewAtRow(row, mode) + listView.positionViewAtIndex(row, mode) } /*! @@ -278,17 +311,89 @@ ScrollView { return listView.indexAt(obj.x, obj.y) } + /*! Adds a \a column and returns the added column. + + The \a column argument can be an instance of TableViewColumn, + or a Component. The component has to contain a TableViewColumn. + Otherwise \c null is returned. + */ + function addColumn(column) { + return insertColumn(columnCount, column) + } + + /*! Inserts a \a column at the given \a index and returns the inserted column. + + The \a column argument can be an instance of TableViewColumn, + or a Component. The component has to contain a TableViewColumn. + Otherwise \c null is returned. + */ + function insertColumn(index, column) { + var object = column + if (typeof column['createObject'] === 'function') + object = column.createObject(root) + + else if (object.__view) { + console.warn("TableView::insertColumn(): you cannot add a column to multiple views") + return null + } + if (index >= 0 && index <= columnCount && object.Accessible.role === Accessible.ColumnHeader) { + object.__view = root + columnModel.insert(index, {columnItem: object}) + return object + } + + if (object !== column) + object.destroy() + console.warn("TableView::insertColumn(): invalid argument") + return null + } + + /*! Removes and destroys a column at the given \a index. */ + function removeColumn(index) { + if (index < 0 || index >= columnCount) { + console.warn("TableView::removeColumn(): invalid argument") + return + } + var column = columnModel.get(index).columnItem + columnModel.remove(index, 1) + column.destroy() + } + + /*! Moves a column \a from index \a to another. */ + function moveColumn(from, to) { + if (from < 0 || from >= columnCount || to < 0 || to >= columnCount) { + console.warn("TableView::moveColumn(): invalid argument") + return + } + columnModel.move(from, to, 1) + } + + /*! Returns the column at the given \a index + or \c null if the \a index is invalid. */ + function getColumn(index) { + if (index < 0 || index >= columnCount) + return null + return columnModel.get(index).columnItem + } + + Component.onCompleted: { + for (var i = 0; i < __columns.length; ++i) { + var column = __columns[i] + if (column.Accessible.role === Accessible.ColumnHeader) + addColumn(column) + } + } style: Qt.createComponent(Settings.style + "/TableViewStyle.qml", root) Accessible.role: Accessible.Table - width: 200 - height: 200 + implicitWidth: 200 + implicitHeight: 150 frameVisible: true - __scrollBarTopMargin: Qt.platform.os === "mac" ? headerrow.height : 0 + __scrollBarTopMargin: Qt.platform.os === "osx" ? headerrow.height : 0 __viewTopMargin: headerrow.height /*! \internal */ @@ -327,7 +432,7 @@ ScrollView { id: colorRect parent: viewport anchors.fill: parent - color: palette.base + color: __style ? __style.backgroundColor : palette.base z: -1 } @@ -362,28 +467,39 @@ ScrollView { autoincrement = false; autodecrement = false; } - var y = Math.min(listView.contentY + listView.height - 5, Math.max(mouseY + listView.contentY, listView.contentY)); - var newIndex = listView.indexAt(0, y); - if (newIndex >= 0) - listView.currentIndex = listView.indexAt(0, y); + + if (pressed) { + var newIndex = listView.indexAt(0, mouseY + listView.contentY) + if (newIndex >= 0) + listView.currentIndex = newIndex; + } } onClicked: { - if (root.__activateItemOnSingleClick) - root.activated() + var clickIndex = listView.indexAt(0, mouseY + listView.contentY) + if (clickIndex > -1) { + if (root.__activateItemOnSingleClick) + root.activated(clickIndex) + root.clicked(clickIndex) + } mouse.accepted = false } onPressed: { + var newIndex = listView.indexAt(0, mouseY + listView.contentY) listView.forceActiveFocus() - var x = Math.min(listView.contentWidth - 5, Math.max(mouseX + listView.contentX, 0)) - var y = Math.min(listView.contentHeight - 5, Math.max(mouseY + listView.contentY, 0)) - listView.currentIndex = listView.indexAt(x, y) + if (newIndex > -1) { + listView.currentIndex = newIndex + } } onDoubleClicked: { - if (!root.__activateItemOnSingleClick) - root.activated() + var clickIndex = listView.indexAt(0, mouseY + listView.contentY) + if (clickIndex > -1) { + if (!root.__activateItemOnSingleClick) + root.activated(clickIndex) + root.doubleClicked(clickIndex) + } } // Note: with boolean preventStealing we are keeping the flickable from @@ -395,7 +511,7 @@ ScrollView { // Fills extra rows with alternate color Column { id: rowfiller - property int rowHeight: listView.contentHeight/count + property int rowHeight: count ? listView.contentHeight/count : height property int paddedRowCount: height/rowHeight property int count: listView.count y: listView.contentHeight @@ -408,21 +524,33 @@ ScrollView { width: rowfiller.width height: rowfiller.rowHeight sourceComponent: root.rowDelegate - readonly property bool alternateBackground: (index + rowCount) % 2 === 1 - readonly property bool rowSelected: false + property QtObject styleData: QtObject { + readonly property bool alternate: (index + rowCount) % 2 === 1 + readonly property bool selected: false + readonly property bool hasActiveFocus: root.activeFocus + } readonly property var model: listView.model readonly property var modelData: null - readonly property bool hasActiveFocus: root.activeFocus } } } - property list<TableViewColumn> columnheader + ListModel { + id: columnModel + } + highlightFollowsCurrentItem: true model: root.model - Keys.onUpPressed: root.__decrementCurrentIndex() - Keys.onDownPressed: root.__incrementCurrentIndex() + Keys.onUpPressed: { + event.accepted = false + root.__decrementCurrentIndex() + } + + Keys.onDownPressed: { + event.accepted = false + root.__incrementCurrentIndex() + } Keys.onPressed: { if (event.key === Qt.Key_PageUp) { @@ -431,7 +559,11 @@ ScrollView { verticalScrollBar.value = __verticalScrollBar.value + listView.height } - Keys.onReturnPressed: root.activated(); + Keys.onReturnPressed: { + event.accepted = false + if (currentRow > -1) + root.activated(currentRow); + } delegate: Item { id: rowitem @@ -439,7 +571,7 @@ ScrollView { height: rowstyle.height readonly property int rowIndex: model.index - readonly property bool alternateBackground: alternatingRowColors && rowIndex % 2 == 1 + readonly property bool alternate: alternatingRowColors && rowIndex % 2 == 1 readonly property var itemModelData: typeof modelData == "undefined" ? null : modelData readonly property var itemModel: model readonly property bool itemSelected: ListView.isCurrentItem @@ -457,19 +589,21 @@ ScrollView { // these properties are exposed to the row delegate // Note: these properties should be mirrored in the row filler as well - readonly property bool alternateBackground: rowitem.alternateBackground - readonly property bool rowSelected: rowitem.itemSelected - readonly property int row: rowitem.rowIndex + property QtObject styleData: QtObject { + readonly property int row: rowitem.rowIndex + readonly property bool alternate: rowitem.alternate + readonly property bool selected: rowitem.itemSelected + readonly property bool hasActiveFocus: root.activeFocus + } readonly property var model: listView.model readonly property var modelData: rowitem.itemModelData - readonly property bool hasActiveFocus: root.activeFocus } Row { id: itemrow height: parent.height Repeater { id: repeater - model: root.columnCount + model: columnModel Loader { id: itemDelegateLoader @@ -482,20 +616,22 @@ ScrollView { readonly property var model: listView.model readonly property var modelData: itemModelData - readonly property var itemValue: __hasModelRole ? itemModel[role] // Qml ListModel and QAbstractItemModel - : __hasModelDataRole ? modelData[role] // QObjectList / QObject - : modelData != undefined ? modelData : "" // Models without role - readonly property bool itemSelected: rowitem.itemSelected - readonly property color itemTextColor: rowitem.itemTextColor - readonly property int row: rowitem.rowIndex - readonly property int column: index - readonly property int itemElideMode: __column.elideMode - readonly property int itemTextAlignment: __column.horizontalAlignment - readonly property string role: __column.role - - readonly property TableViewColumn __column: columns[index] - readonly property bool __hasModelRole: role && itemModel.hasOwnProperty(role) - readonly property bool __hasModelDataRole: role && modelData && modelData.hasOwnProperty(role) + property QtObject styleData: QtObject { + readonly property var value: __hasModelRole ? itemModel[role] // Qml ListModel and QAbstractItemModel + : __hasModelDataRole ? modelData[role] // QObjectList / QObject + : modelData != undefined ? modelData : "" // Models without role + readonly property int row: rowitem.rowIndex + readonly property int column: index + readonly property int elideMode: __column.elideMode + readonly property int textAlignment: __column.horizontalAlignment + readonly property bool selected: rowitem.itemSelected + readonly property color textColor: rowitem.itemTextColor + readonly property string role: __column.role + } + + readonly property TableViewColumn __column: columnItem + readonly property bool __hasModelRole: styleData.role && itemModel.hasOwnProperty(styleData.role) + readonly property bool __hasModelDataRole: styleData.role && modelData && modelData.hasOwnProperty(styleData.role) } } onWidthChanged: listView.contentWidth = width @@ -513,7 +649,7 @@ ScrollView { anchors.topMargin: viewport.anchors.topMargin anchors.leftMargin: viewport.anchors.leftMargin anchors.margins: viewport.anchors.margins - anchors.rightMargin: __scroller.rightMargin + + anchors.rightMargin: (frameVisible ? __scroller.rightMargin : 0) + (__scroller.outerFrame && __scrollBarTopMargin ? 0 : __verticalScrollBar.width + __scroller.scrollBarSpacing + root.__style.padding.right) @@ -532,12 +668,12 @@ ScrollView { property int targetIndex: -1 property int dragIndex: -1 - model: columnCount + model: columnModel delegate: Item { z:-index - width: columns[index].width - visible: columns[index].visible + width: columnCount == 1 ? viewport.width + __verticalScrollBar.width : modelData.width + visible: modelData.visible height: headerVisible ? headerStyle.height : 0 Loader { @@ -545,13 +681,12 @@ ScrollView { sourceComponent: root.headerDelegate anchors.left: parent.left anchors.right: parent.right - property string itemValue: columns[index].title - property string itemSort: (sortIndicatorVisible && index == sortIndicatorColumn) ? (sortIndicatorOrder == Qt.AscendingOrder ? "up" : "down") : ""; - property bool itemPressed: headerClickArea.pressed - property bool itemContainsMouse: headerClickArea.containsMouse - property string itemPosition: columnCount === 1 ? "only" : - index===columnCount-1 ? "end" : - index===0 ? "beginning" : "" + property QtObject styleData: QtObject { + readonly property string value: modelData.title + readonly property bool pressed: headerClickArea.pressed + readonly property bool containsMouse: headerClickArea.containsMouse + readonly property int column: index + } } Rectangle{ id: targetmark @@ -576,7 +711,7 @@ ScrollView { // NOTE: the direction is different from the master branch // so this indicates that I am using an invalid assumption on item ordering onPositionChanged: { - if (pressed) { // only do this while dragging + if (pressed && columnCount > 1) { // only do this while dragging for (var h = columnCount-1 ; h >= 0 ; --h) { if (drag.target.x > headerrow.children[h].x) { repeater.targetIndex = h @@ -593,13 +728,7 @@ ScrollView { onReleased: { if (repeater.targetIndex >= 0 && repeater.targetIndex != index ) { - // Rearrange the header sections - var items = new Array - for (var i = 0 ; i< columnCount ; ++i) - items.push(columns[i]) - items.splice(index, 1); - items.splice(repeater.targetIndex, 0, columns[index]); - columns = items + columnModel.move(index, repeater.targetIndex, 1) if (sortIndicatorColumn == index) sortIndicatorColumn = repeater.targetIndex } @@ -607,19 +736,20 @@ ScrollView { } drag.maximumX: 1000 drag.minimumX: -1000 - drag.target: draghandle + drag.target: columnCount > 1 ? draghandle : null } Loader { id: draghandle - property string itemValue: columns[index].title - property string itemSort: (sortIndicatorVisible && index == sortIndicatorColumn) ? (sortIndicatorOrder == Qt.AscendingOrder ? "up" : "down") : ""; - property bool itemPressed: headerClickArea.pressed - property bool itemContainsMouse: headerClickArea.containsMouse - property string itemPosition + property QtObject styleData: QtObject{ + readonly property string value: modelData.title + readonly property bool pressed: headerClickArea.pressed + readonly property bool containsMouse: headerClickArea.containsMouse + readonly property int column: index + } parent: tableHeader - width: columns[index].width + width: modelData.width height: parent.height sourceComponent: root.headerDelegate visible: headerClickArea.pressed @@ -634,9 +764,10 @@ ScrollView { anchors.rightMargin: -width/2 width: 16 ; height: parent.height anchors.right: parent.right + enabled: columnCount > 1 onPositionChanged: { - var newHeaderWidth = columns[index].width + (mouseX - offset) - columns[index].width = Math.max(minimumSize, newHeaderWidth) + var newHeaderWidth = modelData.width + (mouseX - offset) + modelData.width = Math.max(minimumSize, newHeaderWidth) } property bool found:false @@ -651,21 +782,22 @@ ScrollView { minWidth = Math.max(minWidth, item.children[1].children[index].children[0].implicitWidth) } if (minWidth) - columns[index].width = minWidth + modelData.width = minWidth } onPressedChanged: if (pressed) offset=mouseX - cursorShape: Qt.SplitHCursor + cursorShape: enabled ? Qt.SplitHCursor : Qt.ArrowCursor } } } } Loader { id: loader - property string itemValue - property string itemSort - property bool itemPressed - property bool itemContainsMouse - property string itemPosition + property QtObject styleData: QtObject{ + readonly property string value: "" + readonly property bool pressed: false + readonly property bool containsMouse: false + readonly property int column: -1 + } anchors.top: parent.top anchors.right: parent.right diff --git a/src/controls/TableViewColumn.qml b/src/controls/TableViewColumn.qml index 919f30de..f1abc553 100644 --- a/src/controls/TableViewColumn.qml +++ b/src/controls/TableViewColumn.qml @@ -49,6 +49,10 @@ import QtQuick 2.1 */ QtObject { + + /*! \internal */ + property Item __view: null + /*! The title text of the column. */ property string title @@ -56,8 +60,10 @@ QtObject { property string role /*! The current width of the column - The default value depends on platform. */ - property int width: 160 + The default value depends on platform. If only one + column is defined, the width expands to the viewport. + */ + property int width: (__view && __view.columnCount === 1) ? __view.viewport.width : 160 /*! The visible status of the column. */ property bool visible: true @@ -89,4 +95,6 @@ QtObject { /*! The delegate of the column. This can be used to set the \l TableView::itemDelegate for a specific column. */ property Component delegate + + Accessible.role: Accessible.ColumnHeader } diff --git a/src/controls/TextArea.qml b/src/controls/TextArea.qml index 6dab90fd..fd715a36 100644 --- a/src/controls/TextArea.qml +++ b/src/controls/TextArea.qml @@ -599,20 +599,19 @@ ScrollView { edit.undo(); } - /*! - \qmlproperty color TextArea::backgroundColor + /*! \qmlproperty bool TextArea::backgroundVisible - This property sets the background color of the viewport. + This property determines if the background should be filled or not. - The default value is the base color of the SystemPalette. + The default value is \c true. */ - property alias backgroundColor: colorRect.color + property alias backgroundVisible: colorRect.visible /*! \internal */ - property int __documentMargin: 4 + default property alias data: area.data - width: 280 - height: 120 + /*! \internal */ + property int __documentMargin: 4 frameVisible: true @@ -621,9 +620,9 @@ ScrollView { Accessible.role: Accessible.EditableText /*! - \qmlproperty textDocument TextArea::textDocument + \qmlproperty TextDocument TextArea::textDocument - This property exposes the \l QTextDocument of this TextArea. + This property exposes the \l QQuickTextDocument of this TextArea. \sa TextEdit::textDocument */ property alias textDocument: edit.textDocument diff --git a/src/controls/TextField.qml b/src/controls/TextField.qml index 903a6462..32b2d4fb 100644 --- a/src/controls/TextField.qml +++ b/src/controls/TextField.qml @@ -524,8 +524,11 @@ Control { textInput.undo(); } - /*! \internal */ - property alias __containsMouse: mouseArea.containsMouse + /*! \qmlproperty bool TextField::hovered + + This property holds whether the control is being hovered. + */ + readonly property alias hovered: mouseArea.containsMouse /*! \internal */ property alias __contentHeight: textInput.contentHeight diff --git a/src/controls/ToolBar.qml b/src/controls/ToolBar.qml index d2adea56..b73a6f3e 100644 --- a/src/controls/ToolBar.qml +++ b/src/controls/ToolBar.qml @@ -53,13 +53,20 @@ import QtQuick.Controls.Private 1.0 provides styling and is generally designed to work well with ToolButton as well as other controls. - Note that the ToolBar does not provide a layout of its own, but requires you - to position its contents, for instance by creating a Row. + Note that the ToolBar does not provide a layout of its own, but requires + you to position its contents, for instance by creating a \l RowLayout. + + If only a single item is used within the ToolBar, it will resize to fit the implicitHeight + of its contained item. This makes it particularly suitable for use together with layouts. + Otherwise the height is platform dependent. \code + import QtQuick.Controls 1.0 + import QtQuick.Layouts 1.0 + ApplicationWindow { toolBar: ToolBar { - Row { + RowLayout { ToolButton { ... } ToolButton { ... } ToolButton { ... } @@ -71,16 +78,72 @@ import QtQuick.Controls.Private 1.0 Item { id: toolbar + activeFocusOnTab: false Accessible.role: Accessible.ToolBar + width: parent ? parent.width : implicitWidth - implicitWidth: loader.item ? loader.item.implicitWidth : 0 - implicitHeight: loader.item ? loader.item.implicitHeight : 0 + implicitWidth: container.leftMargin + container.rightMargin + container.calcWidth() + implicitHeight: container.topMargin + container.bottomMargin + container.calcHeight() + + /*! \internal */ property Component style: Qt.createComponent(Settings.style + "/ToolBarStyle.qml", toolbar) - Loader { - id: loader - anchors.fill: parent - sourceComponent: style - property var __control: toolbar - } + + /*! \internal */ + property alias __style: styleLoader.item + + /*! \internal */ + default property alias __content: container.data + + /*! + \qmlproperty Item ToolBar::contentItem + + This property holds the content Item of the tool bar. + + Items declared as children of a ToolBar are automatically parented to the ToolBar's contentItem. + Items created dynamically need to be explicitly parented to the contentItem: + + \note The implicit size of the ToolBar is calculated based on the size of its content. If you want to anchor + items inside the tool bar, you must specify an explicit width and height on the ToolBar itself. + */ + readonly property alias contentItem: container + + data: [ + Loader { + id: loader + anchors.fill: parent + sourceComponent: styleLoader.item ? styleLoader.item.panel : null + onLoaded: item.z = -1 + Loader { + id: styleLoader + property alias __control: toolbar + sourceComponent: style + } + }, + Item { + id: container + z: 1 + focus: true + anchors.fill: parent + + anchors.topMargin: topMargin + anchors.leftMargin: leftMargin + anchors.rightMargin: rightMargin + anchors.bottomMargin: bottomMargin + + property int topMargin: __style ? __style.padding.top : 0 + property int bottomMargin: __style ? __style.padding.bottom : 0 + property int leftMargin: __style ? __style.padding.left : 0 + property int rightMargin: __style ? __style.padding.right : 0 + + property Item layoutItem: container.children.length === 1 ? container.children[0] : null + function calcWidth() { return (layoutItem ? (layoutItem.implicitWidth || layoutItem.width) + + (layoutItem.anchors.fill ? layoutItem.anchors.leftMargin + + layoutItem.anchors.rightMargin : 0) : + loader.item ? loader.item.implicitWidth : 0) } + function calcHeight () { return (layoutItem ? (layoutItem.implicitHeight || layoutItem.height) + + (layoutItem.anchors.fill ? layoutItem.anchors.topMargin + + layoutItem.anchors.bottomMargin : 0) : + loader.item ? loader.item.implicitHeight : 0) } + }] } diff --git a/src/controls/ToolButton.qml b/src/controls/ToolButton.qml index d6607d28..3c1eab1a 100644 --- a/src/controls/ToolButton.qml +++ b/src/controls/ToolButton.qml @@ -46,7 +46,7 @@ import QtQuick.Controls.Private 1.0 \qmltype ToolButton \inqmlmodule QtQuick.Controls 1.0 \since QtQtuick.Controls 1.0 - \ingroup applicationwindow + \ingroup controls \brief Provides a button type that is typically used within a ToolBar. ToolButton is functionally similar to \l Button, but can provide a look that is more @@ -62,18 +62,6 @@ import QtQuick.Controls.Private 1.0 BasicButton { id: button - /*! The image label source as file name or resource. */ - property url iconSource - - /*! The image label source as theme name. - When an icon from the platform icon theme is found, this takes - precedence over iconSource. - */ - property url iconName - - /*! The label text. */ - property string text - activeFocusOnTab: true Accessible.name: text diff --git a/src/controls/controls.pro b/src/controls/controls.pro index 928708c2..fbda88fc 100644 --- a/src/controls/controls.pro +++ b/src/controls/controls.pro @@ -1,4 +1,4 @@ -TARGET = qtquickcontrols +TARGET = qtquickcontrolsplugin TARGETPATH = QtQuick/Controls QT += qml quick gui-private core-private diff --git a/src/controls/doc/images/qtquickcontrols-example-gallery.png b/src/controls/doc/images/qtquickcontrols-example-gallery.png Binary files differindex d3b19bb5..a88eab79 100644 --- a/src/controls/doc/images/qtquickcontrols-example-gallery.png +++ b/src/controls/doc/images/qtquickcontrols-example-gallery.png diff --git a/src/controls/doc/qtquickcontrols.qdocconf b/src/controls/doc/qtquickcontrols.qdocconf index c04bced2..44fd86ca 100644 --- a/src/controls/doc/qtquickcontrols.qdocconf +++ b/src/controls/doc/qtquickcontrols.qdocconf @@ -14,22 +14,17 @@ qhp.QtQuickControls.indexTitle = Qt Quick Controls qhp.QtQuickControls.indexRoot = #qhp.QtQuickControls.extraFiles = style/qtquickcontrols.css -qhp.QtQuickControls.filterAttributes = qtcontrols $QT_VERSION qtrefdoc +qhp.QtQuickControls.filterAttributes = qtquickcontrols $QT_VERSION qtrefdoc qhp.QtQuickControls.customFilters.Qt.name = QtQuickControls $QT_VERSION qhp.QtQuickControls.customFilters.Qt.filterAttributes = qtquickcontrols $QT_VERSION -qhp.QtQuickControls.subprojects = qtquickcontrolsqmltypes styleqmltypes +qhp.QtQuickControls.subprojects = qtquickcontrolsqmltypes qhp.QtQuickControls.subprojects.qtquickcontrolsqmltypes.title = QML Types qhp.QtQuickControls.subprojects.qtquickcontrolsqmltypes.indexTitle = Qt Quick Controls QML Types qhp.QtQuickControls.subprojects.qtquickcontrolsqmltypes.selectors = class fake:qmlclass qhp.QtQuickControls.subprojects.qtquickcontrolsqmltypes.sortPages = true -qhp.QtQuickControls.subprojects.styleqmltypes.title = Styles QML Types -qhp.QtQuickControls.subprojects.styleqmltypes.indexTitle = Qt Quick Controls Styles QML Types -qhp.QtQuickControls.subprojects.styleqmltypes.selectors = class fake:qmlclass -qhp.QtQuickControls.subprojects.styleqmltypes.sortPages = true - -depends = qtqml qtquick qtwidgets qtdoc qtquicklayouts +depends = qtqml qtquick qtwidgets qtdoc qtquicklayouts qtquickcontrolsstyles exampledirs += ../../../examples/quick/controls @@ -37,22 +32,15 @@ exampledirs += ../../../examples/quick/controls examplesinstallpath = quick/controls headerdirs += ../ -headerdirs += ../ ../../styles/Base sourcedirs += ../ -sourcedirs += ../ ../../styles/Base -sources += ../../private/qstyleitem.cpp \ - ../../private/AbstractCheckable.qml \ +sources += ../../private/AbstractCheckable.qml \ ../../private/BasicButton.qml \ ../../private/FocusFrame.qml \ ../../private/ModalPopupBehavior.qml \ - ../../private/PageSlideTransition.qml \ ../../private/ScrollBar.qml \ ../../private/TabBar.qml \ ../../private/Control.qml \ - ../../private/Style.qml \ - ../../private/qquickpaddedstyle.h \ - ../../private/qquickpaddedstyle.cpp imagedirs += images diff --git a/src/controls/doc/src/qtquickcontrols-index.qdoc b/src/controls/doc/src/qtquickcontrols-index.qdoc index 011de527..96f2a670 100644 --- a/src/controls/doc/src/qtquickcontrols-index.qdoc +++ b/src/controls/doc/src/qtquickcontrols-index.qdoc @@ -29,25 +29,14 @@ \page qtquickcontrols-index.html \title Qt Quick Controls - \brief The Qt Quick Controls module provides a set of reusable Qt Quick UI components. + \brief The Qt Quick Controls module provides a set of UI controls for Qt Quick. - The Qt Quick Controls module provides a set of reusable UI components to create - classic desktop-style user interfaces using Qt Quick. + The Qt Quick Controls module provides a set of controls that can be used to + build complete interfaces in Qt Quick. The module is new in Qt 5.1 and requires \l{Qt Quick} 2.1. - \note \l{Qt Quick Layouts} can be used to arrange Qt Quick Controls in a user interface. - - \note The current focus is on desktop, but in the long term Qt Quick Controls - are expected to be supported on mobile platforms too. - - \section1 Getting started - - The QML types can be imported into your application using the following import statement in your \c {.qml} file. - - \code - import QtQuick.Controls 1.0 - \endcode + Visit the \l{Qt Quick Controls Overview} page to get started. \section1 Application Window Components used to describe the basic window properties of an application. @@ -67,21 +56,12 @@ \section1 Related information - \section2 Guides \list + \li \l{Qt Quick} \li \l{Qt Quick Controls Overview} - \endlist - - \section2 Reference - \list \li \l{Qt Quick Controls QML Types}{Qt Quick Controls QML Types} - \endlist - - \section2 Examples - \list \li \l{Qt Quick Controls Examples} + \li \l{Qt Quick Controls Styles} + \li \l{Qt Quick Layouts} \endlist - - \l {Qt Quick Controls Styles QML Types} - */ diff --git a/src/controls/doc/src/qtquickcontrols-overview.qdoc b/src/controls/doc/src/qtquickcontrols-overview.qdoc index 82da0b22..4eb6892f 100644 --- a/src/controls/doc/src/qtquickcontrols-overview.qdoc +++ b/src/controls/doc/src/qtquickcontrols-overview.qdoc @@ -28,5 +28,82 @@ /*! \page qtquickcontrols-overview.html \title Qt Quick Controls Overview - \brief A set of APIs for working with ... + \brief A set of UI controls to create user interfaces in Qt Quick + + The Qt Quick Controls provide a set of UI controls to create user interfaces + in Qt Quick. + + \section1 Getting Started + + The QML types can be imported into your application using the following import statement in your \c {.qml} file. + + \code + import QtQuick.Controls 1.0 + \endcode + + \section1 Creating a basic example + + A basic example of a QML file that makes use of controls is shown here: + + \code + import QtQuick.Controls 1.0 + + ApplicationWindow { + title: "My Application" + + Button { + text: "Push Me" + anchors.centerIn: parent + } + } + \endcode + + For an overview of the controls provided by \l{Qt Quick Controls}, you can look at + the \l{Qt Quick Controls - Gallery}{Gallery} example. + + \image qtquickcontrols-example-gallery.png + + \section1 Setting Up Controls from C++ + + Although we have traditionally used a QQuickView window to display QML files + in a C++ application, doing this means you can only set window properties from C++. + + With Qt Quick Controls, declare an ApplicationWindow as the root item of your application and launch it by using the + QQmlApplicationEngine instead. This ensures that you can control top level window properties from QML. + + A basic example of a source file that makes use of controls is shown here: + + \code + #include <QApplication> + #include <QQmlApplicationEngine> + + int main(int argc, char *argv[]) + { + QApplication app(argc, argv); + QQmlApplicationEngine engine("main.qml"); + return app.exec(); + } + \endcode + + \note We are using QApplication and not QGuiApplication in this example. + Though you can use QGuiApplication instead, doing this will eliminate platform-dependent styling. + This is because it is relying on the widget module to provide the native look and feel. + + \section2 Using C++ Data From QML + + If you need to register a C++ class to use from QML, you can call, for example, + qmlRegisterType() before declaring your QQmlApplicationEngine. You can find the list + of all registering functions \l{QQmlEngine}{here}. + + If you need to expose data to QML components, you need to set them + to the context of the current QML engine. See QQmlContext for more + information. + + \section1 Related information + + \list + \li \l{Qt Quick} + \li \l{Qt Quick Controls} + \li \l{Qt Quick Controls Examples} + \endlist */ diff --git a/src/controls/doc/src/styles.qdoc b/src/controls/doc/src/styles.qdoc deleted file mode 100644 index 40809414..00000000 --- a/src/controls/doc/src/styles.qdoc +++ /dev/null @@ -1,41 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2012 Digia Plc and/or its subsidiary(-ies). -** Contact: http://www.qt-project.org/legal -** -** 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 Digia. For licensing terms and -** conditions see http://qt.digia.com/licensing. For further information -** use the contact form at http://qt.digia.com/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: http://www.gnu.org/copyleft/fdl.html. -** $QT_END_LICENSE$ -** -****************************************************************************/ - -/*! - \qmlmodule QtQuick.Controls.Styles 1 - \title Qt Quick Controls Styles QML Types - \ingroup qmlmodules - \brief Provides QML types for Qt Quick Controls styles. - - The \l{Qt Quick Controls} module provides a set of QML types for handling - styles. - - Some of the controls allow custom styling similar to widget style sheets. - A styling object is usually a collection of properties that control behavior and simple delegates - that can be replaced with custom QML snippets. - -*/ diff --git a/src/controls/plugins.qmltypes b/src/controls/plugins.qmltypes index 89363578..bd8508da 100644 --- a/src/controls/plugins.qmltypes +++ b/src/controls/plugins.qmltypes @@ -3,7 +3,7 @@ import QtQuick.tooling 1.1 // This file describes the plugin-supplied types contained in the library. // It is used for QML tooling purposes only. // -// This file was auto-generated with the command '/home/jpnurmi/Projects/qt5-stable/qtbase/bin/qmlplugindump -notrelocatable QtQuick.Controls 1.0'. +// This file was auto-generated with the command 'qmlplugindump -notrelocatable QtQuick.Controls 1.0'. Module { Component { @@ -67,6 +67,8 @@ Module { Property { name: "__contentItem"; type: "QQuickItem"; isPointer: true } Property { name: "__minimumWidth"; type: "int" } Property { name: "__font"; type: "QFont" } + Property { name: "__xOffset"; type: "double" } + Property { name: "__yOffset"; type: "double" } Signal { name: "__menuClosed" } Signal { name: "popupVisibleChanged" } Method { name: "__closeMenu" } @@ -197,7 +199,7 @@ Module { Property { name: "__index"; type: "int" } Property { name: "status"; type: "Status"; isReadonly: true } Property { name: "__status"; type: "Status" } - Property { name: "pageStack"; type: "QQuickItem"; isReadonly: true; isPointer: true } - Property { name: "__stackView"; type: "QQuickItem"; isPointer: true } + Property { name: "view"; type: "QQuickItem"; isReadonly: true; isPointer: true } + Property { name: "__view"; type: "QQuickItem"; isPointer: true } } } diff --git a/src/controls/qmldir b/src/controls/qmldir index f593439f..c243360c 100644 --- a/src/controls/qmldir +++ b/src/controls/qmldir @@ -1,5 +1,5 @@ module QtQuick.Controls -plugin qtquickcontrols +plugin qtquickcontrolsplugin ApplicationWindow 1.0 ApplicationWindow.qml Button 1.0 Button.qml CheckBox 1.0 CheckBox.qml diff --git a/src/controls/qquickaction.cpp b/src/controls/qquickaction.cpp index a597515f..e240d111 100644 --- a/src/controls/qquickaction.cpp +++ b/src/controls/qquickaction.cpp @@ -123,7 +123,7 @@ QT_BEGIN_NAMESPACE Whether the action is enabled, and can be triggered. Defaults to \c true. - \sa tigger(), triggered() + \sa trigger(), triggered */ /*! @@ -140,7 +140,7 @@ QT_BEGIN_NAMESPACE If the action is \l checkable, this property reflects its checked state. Defaults to \c false. Its value is also false while \l checkable is false. - \sa toggled(), exclusiveGroup + \sa toggled, exclusiveGroup */ /*! @@ -169,14 +169,14 @@ QT_BEGIN_NAMESPACE /*! \qmlmethod Action::trigger() - Will emit the \l triggered() signal if the action is enabled. Will also emit the - \l toggled() signal if it is checkable. + Will emit the \l triggered signal if the action is enabled. Will also emit the + \l toggled signal if it is checkable. */ /*! \qmlsignal Action::toggled(checked) Emitted whenever a action's \l checked property changes. - This usually happens at the same time as \l triggered(). + This usually happens at the same time as \l triggered. */ QQuickAction::QQuickAction(QObject *parent) diff --git a/src/controls/qquickaction_p.h b/src/controls/qquickaction_p.h index e106a920..aa63b408 100644 --- a/src/controls/qquickaction_p.h +++ b/src/controls/qquickaction_p.h @@ -57,11 +57,11 @@ class QQuickAction : public QObject { Q_OBJECT - Q_PROPERTY(QString text READ text WRITE setText NOTIFY textChanged) - Q_PROPERTY(QUrl iconSource READ iconSource WRITE setIconSource NOTIFY iconSourceChanged) + Q_PROPERTY(QString text READ text WRITE setText NOTIFY textChanged RESET resetText) + Q_PROPERTY(QUrl iconSource READ iconSource WRITE setIconSource NOTIFY iconSourceChanged RESET resetIconSource) Q_PROPERTY(QString iconName READ iconName WRITE setIconName NOTIFY iconNameChanged) Q_PROPERTY(QVariant __icon READ iconVariant NOTIFY iconChanged) - Q_PROPERTY(QString tooltip READ tooltip WRITE setTooltip NOTIFY tooltipChanged) + Q_PROPERTY(QString tooltip READ tooltip WRITE setTooltip NOTIFY tooltipChanged RESET resetTooltip) Q_PROPERTY(bool enabled READ isEnabled WRITE setEnabled NOTIFY enabledChanged) Q_PROPERTY(bool checkable READ isCheckable WRITE setCheckable NOTIFY checkableChanged) Q_PROPERTY(bool checked READ isChecked WRITE setChecked DESIGNABLE isCheckable NOTIFY toggled) @@ -76,6 +76,7 @@ public: ~QQuickAction(); QString text() const { return m_text; } + void resetText() { setText(QString()); } void setText(const QString &text); QString shortcut() const; @@ -87,9 +88,11 @@ public: void setIconName(const QString &iconName); QUrl iconSource() const { return m_iconSource; } + void resetIconSource() { setIconSource(QString()); } void setIconSource(const QUrl &iconSource); QString tooltip() const { return m_tooltip; } + void resetTooltip() { setTooltip(QString()); } void setTooltip(const QString &tooltip); bool isEnabled() const { return m_enabled; } diff --git a/src/controls/qquickexclusivegroup.cpp b/src/controls/qquickexclusivegroup.cpp index eecff416..f1b6935e 100644 --- a/src/controls/qquickexclusivegroup.cpp +++ b/src/controls/qquickexclusivegroup.cpp @@ -97,9 +97,9 @@ static bool isChecked(const QObject *o) } \endcode - Several controls already support \l ExclusiveGroup, e.g. \l Action, \l MenuItem, \l Button, and \l RadioButton. + Several controls already support ExclusiveGroup, e.g. \l Action, \l MenuItem, \l Button, and \l RadioButton. - Since \l ExclusiveGroup only supports \l Action as child items, we need to manually assign the \c exclusiveGroup + Since ExclusiveGroup only supports \l Action as child items, we need to manually assign the \c exclusiveGroup property for other objects. \code @@ -131,9 +131,9 @@ static bool isChecked(const QObject *o) \section1 Adding support to ExclusiveGroup - It is possible to add support for \l ExclusiveGroup for an object, or control. It should have a \c checked + It is possible to add support for ExclusiveGroup for an object, or control. It should have a \c checked property, and either a \c checkedChanged, \c toggled(), or \c toggled(bool) signal. It also needs - to be bound with \l ExclusiveGroup::bindCheckable(object) when its \l ExclusiveGroup ty[ped property is set. + to be bound with \l ExclusiveGroup::bindCheckable() when its ExclusiveGroup ty[ped property is set. \code Item { @@ -149,13 +149,13 @@ static bool isChecked(const QObject *o) } \endcode - The example above shows the minimum necessary to add \l ExclusiveGroup support to any item. + The example above shows the minimum necessary to add ExclusiveGroup support to any item. */ /*! \qmlproperty object ExclusiveGroup::current - The currently selected object. Defaults to the first checked object bound to the \l ExclusiveGroup. + The currently selected object. Defaults to the first checked object bound to the ExclusiveGroup. If there is none, then it defaults to \c null. */ @@ -166,7 +166,7 @@ static bool isChecked(const QObject *o) You should only need to call this function when creating a component you want to be compatible with \c ExclusiveGroup. - \sa ExclusiveGroup::unbindCheckable(object) + \sa ExclusiveGroup::unbindCheckable() */ /*! @@ -176,7 +176,7 @@ static bool isChecked(const QObject *o) You should only need to call this function when creating a component you want to be compatible with \c ExclusiveGroup. - \sa ExclusiveGroup::bindCheckable(object) + \sa ExclusiveGroup::bindCheckable() */ QQuickExclusiveGroup::QQuickExclusiveGroup(QObject *parent) diff --git a/src/controls/qquickmenu.cpp b/src/controls/qquickmenu.cpp index efc49cd6..bb0ddae9 100644 --- a/src/controls/qquickmenu.cpp +++ b/src/controls/qquickmenu.cpp @@ -100,7 +100,7 @@ QT_BEGIN_NAMESPACE \endcode Note that in this case, the \c index parameter passed to \l insertItem() is relative - to the position of the \l Instatiator in the menu, as opposed to absolute position + to the position of the \l Instantiator in the menu, as opposed to absolute position in the menu. \sa MenuItem, MenuSeparator @@ -170,7 +170,7 @@ QT_BEGIN_NAMESPACE Adds an item to the menu. Returns the newly created \l MenuItem. - \sa insertItem(int before, string title) + \sa insertItem() */ /*! diff --git a/src/controls/qquickmenuitem.cpp b/src/controls/qquickmenuitem.cpp index 4ac7c7ff..ed03b336 100644 --- a/src/controls/qquickmenuitem.cpp +++ b/src/controls/qquickmenuitem.cpp @@ -329,14 +329,14 @@ void QQuickMenuText::updateIcon() Emitted when either the menu item or its bound action have been activated. - \sa trigger(), Action::triggered(), Action::toggled() + \sa trigger(), Action::triggered, Action::toggled */ /*! \qmlmethod MenuItem::trigger() Manually trigger a menu item. Will also trigger the item's bound action. - \sa triggered(), Action::trigger() + \sa triggered, Action::trigger() */ /*! @@ -360,7 +360,7 @@ void QQuickMenuText::updateIcon() If the menu item is checkable, this property reflects its checked state. Defaults to \c false. - \sa checkable, Action::toggled() + \sa checkable, Action::toggled */ /*! \qmlproperty ExclusiveGroup MenuItem::exclusiveGroup @@ -378,9 +378,9 @@ void QQuickMenuText::updateIcon() /*! \qmlsignal MenuItem::toggled(checked) Emitted whenever a menu item's \c checked property changes. - This usually happens at the same time as \l triggered(). + This usually happens at the same time as \l triggered. - \sa checked, triggered(), Action::triggered(), Action::toggled() + \sa checked, triggered, Action::triggered, Action::toggled */ /*! @@ -401,6 +401,7 @@ QQuickMenuItem::QQuickMenuItem(QObject *parent) { connect(this, SIGNAL(__textChanged()), this, SIGNAL(textChanged())); + connect(action(), SIGNAL(shortcutChanged(QString)), this, SLOT(updateShortcut())); connect(action(), SIGNAL(triggered()), this, SIGNAL(triggered())); connect(action(), SIGNAL(toggled(bool)), this, SLOT(updateChecked())); if (platformItem()) @@ -502,7 +503,7 @@ void QQuickMenuItem::setBoundAction(QQuickAction *a) QString QQuickMenuItem::text() const { QString ownText = QQuickMenuText::text(); - if (!ownText.isEmpty()) + if (!ownText.isNull()) return ownText; return m_boundAction ? m_boundAction->text() : QString(); } diff --git a/src/controls/qquickstack.cpp b/src/controls/qquickstack.cpp index 1723ef72..c949ffeb 100644 --- a/src/controls/qquickstack.cpp +++ b/src/controls/qquickstack.cpp @@ -47,15 +47,11 @@ QT_BEGIN_NAMESPACE \qmltype Stack \instantiates QQuickStack \inqmlmodule QtQuick.Controls 1.0 - \ingroup views \brief Provides attached properties for items pushed onto a StackView. - The Stack attached property provides information when an item becomes - active or inactive through the \l{Stack::status}{Stack.status} property. - Status will be \c Stack.Activating when an item is transitioning into - being the current item on the screen, and \c Stack.Active once the - transition stops. When it leaves the screen, it will be - \c Stack.Deactivating, and then \c Stack.Inactive. + The Stack type provides attached properties for items pushed onto a \l StackView. + It gives specific information about the item, such as its \l status and + \l index in the stack \l view the item is in. \sa StackView */ @@ -64,7 +60,7 @@ QQuickStack::QQuickStack(QObject *object) : QObject(object), m_index(-1), m_status(Inactive), - m_pageStack(0) + m_view(0) { } @@ -75,11 +71,11 @@ QQuickStack *QQuickStack::qmlAttachedProperties(QObject *object) /*! \readonly - \qmlproperty int Stack::index + \qmlattachedproperty int Stack::index - This property holds the index of the item inside \l{pageStack}{StackView}, - so that \l{StackView::get()}{pageStack.get(index)} will return the item itself. - If \l{Stack::pageStack}{pageStack} is \c null, \a index will be \c -1. + This property holds the index of the item inside \l{view}{StackView}, + so that \l{StackView::get()}{StackView.get(index)} will return the item itself. + If \l{Stack::view}{view} is \c null, \a index will be \c -1. */ int QQuickStack::index() const { @@ -96,7 +92,7 @@ void QQuickStack::setIndex(int index) /*! \readonly - \qmlproperty enumeration Stack::status + \qmlattachedproperty enumeration Stack::status This property holds the status of the item. It can have one of the following values: \list @@ -121,21 +117,21 @@ void QQuickStack::setStatus(Status status) /*! \readonly - \qmlproperty StackView Stack::pageStack + \qmlattachedproperty StackView Stack::view This property holds the StackView the item is in. If the item is not inside - a StackView, \a pageStack will be \c null. + a StackView, \a view will be \c null. */ -QQuickItem *QQuickStack::pageStack() const +QQuickItem *QQuickStack::view() const { - return m_pageStack; + return m_view; } -void QQuickStack::setStackView(QQuickItem *pageStack) +void QQuickStack::setView(QQuickItem *view) { - if (m_pageStack != pageStack) { - m_pageStack = pageStack; - emit pageStackChanged(); + if (m_view != view) { + m_view = view; + emit viewChanged(); } } diff --git a/src/controls/qquickstack_p.h b/src/controls/qquickstack_p.h index a4b36644..c34dd1a3 100644 --- a/src/controls/qquickstack_p.h +++ b/src/controls/qquickstack_p.h @@ -53,8 +53,8 @@ class QQuickStack : public QObject Q_PROPERTY(int __index READ index WRITE setIndex NOTIFY indexChanged) Q_PROPERTY(Status status READ status NOTIFY statusChanged) Q_PROPERTY(Status __status READ status WRITE setStatus NOTIFY statusChanged) - Q_PROPERTY(QQuickItem* pageStack READ pageStack NOTIFY pageStackChanged) - Q_PROPERTY(QQuickItem* __stackView READ pageStack WRITE setStackView NOTIFY pageStackChanged) + Q_PROPERTY(QQuickItem* view READ view NOTIFY viewChanged) + Q_PROPERTY(QQuickItem* __view READ view WRITE setView NOTIFY viewChanged) Q_ENUMS(Status) public: @@ -75,18 +75,18 @@ public: Status status() const; void setStatus(Status status); - QQuickItem *pageStack() const; - void setStackView(QQuickItem *pageStack); + QQuickItem *view() const; + void setView(QQuickItem *view); signals: void statusChanged(); - void pageStackChanged(); + void viewChanged(); void indexChanged(); private: int m_index; Status m_status; - QQuickItem *m_pageStack; + QQuickItem *m_view; }; QT_END_NAMESPACE |
