From 548d6fc956061cd1edb177447cdf07104d92b9c7 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Wed, 6 Jan 2016 04:40:33 +0100 Subject: sync with mobilecomponents a85365111 + patches MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This is the latest state of the upstream art from Plasma, plus our patches to disable the gamma effect on the icon, and the drawer removed. Signed-off-by: Sebastian Kügler --- .../qml/mobilecomponents/ApplicationWindow.qml | 17 +- qt-mobile/qml/mobilecomponents/ContextDrawer.qml | 31 +- qt-mobile/qml/mobilecomponents/GlobalDrawer.qml | 51 +- .../qml/mobilecomponents/ListItemWithActions.qml | 157 +++--- qt-mobile/qml/mobilecomponents/OverlayDrawer.qml | 414 ++++++++------- qt-mobile/qml/mobilecomponents/Page.qml | 13 - qt-mobile/qml/mobilecomponents/PageRow.qml | 7 +- qt-mobile/qml/mobilecomponents/icons/go-next.svg | 192 +++---- .../qml/mobilecomponents/icons/go-previous.svg | 556 ++++----------------- .../qml/mobilecomponents/private/ActionButton.qml | 11 +- qt-mobile/qml/mobilecomponents/qmldir | 2 + 11 files changed, 550 insertions(+), 901 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml index 76662f549..0eaa81ec0 100644 --- a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml +++ b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml @@ -47,9 +47,22 @@ ApplicationWindow { */ property alias pageStack: __pageStack + function showPassiveNotification(message, timeout, actionText, callBack) { + if (!__actionButton.__passiveNotification) { + var component = Qt.createComponent("private/PassiveNotification.qml"); + __actionButton.__passiveNotification = component.createObject(contentItem.parent); + } + + __actionButton.__passiveNotification.showNotification(message, timeout, actionText, callBack); + } + PageRow { id: __pageStack - anchors.fill: parent + anchors { + fill: parent + bottomMargin: Qt.inputMethod.visible ? (root.y + root.height) - (Qt. +inputMethod.keyboardRectangle.y) : 0 + } focus: true Keys.onReleased: { if (event.key == Qt.Key_Back && stackView.depth > 1) { @@ -76,6 +89,8 @@ ApplicationWindow { property alias actionButton: __actionButton ActionButton { id: __actionButton + //put it there just to make it not accessible bu users + property Item __passiveNotification z: 9999 anchors.bottom: parent.bottom x: parent.width/2 - width/2 diff --git a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml index aea4a5ca5..575ac3679 100644 --- a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml @@ -25,14 +25,15 @@ import org.kde.plasma.mobilecomponents 0.2 OverlayDrawer { id: root - property string title + property string title: typeof i18n !== "undefined" ? i18n("Actions") : "Actions" //This can be any type of object that a ListView can accept as model. It expects items compatible with either QAction or QQC Action - property var actions + property var actions: pageStack.lastVisiblePage ? pageStack.lastVisiblePage.contextualActions : null enabled: menu.count > 0 edge: Qt.RightEdge contentItem: QtControls.ScrollView { + implicitWidth: Units.gridUnit * 20 ListView { id: menu interactive: contentHeight > height @@ -49,9 +50,8 @@ OverlayDrawer { root.actions[0]; } } - verticalLayoutDirection: ListView.BottomToTop - //in bottomtotop all is flipped - footer: Item { + topMargin: menu.height - menu.contentHeight + header: Item { height: heading.height width: menu.width Heading { @@ -66,23 +66,11 @@ OverlayDrawer { text: root.title } } - delegate: ListItem { + delegate: BasicListItem { enabled: true - RowLayout { - height: implicitHeight + Units.smallSpacing * 2 - anchors { - left: parent.left - margins: Units.largeSpacing - } - Icon { - height: parent.height - width: height - source: modelData.iconName - } - Label { - text: model ? model.text : modelData.text - } - } + checked: modelData.checked + icon: modelData.iconName + label: model ? model.text : modelData.text onClicked: { if (modelData && modelData.trigger !== undefined) { modelData.trigger(); @@ -92,6 +80,7 @@ OverlayDrawer { } else { console.warning("Don't know how to trigger the action") } + root.opened = false; } } } diff --git a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml index ff379b093..afe304166 100644 --- a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml @@ -142,51 +142,30 @@ OverlayDrawer { interactive: contentHeight > height - footer: ListItem { + footer: BasicListItem { visible: level > 0 enabled: true - RowLayout { - height: Units.iconSizes.smallMedium + Units.smallSpacing * 2 - anchors { - left: parent.left - } - Icon { - Layout.minimumWidth: height - Layout.maximumWidth: Layout.minimumWidth - Layout.fillHeight: true - source: "go-previous" - } - Label { - text: typeof i18n !== "undefined" ? i18n("Back") : "Back" - } - } + icon: "go-previous" + label: typeof i18n !== "undefined" ? i18n("Back") : "Back" onClicked: pageRow.pop() } - delegate: ListItem { + delegate: BasicListItem { enabled: true - RowLayout { - height: implicitHeight + Units.smallSpacing * 2 + checked: modelData.checked + icon: modelData.iconName + label: modelData.text + + Icon { anchors { - left: parent.left + top: parent.top + bottom: parent.bottom right: parent.right } - Icon { - Layout.maximumWidth: height - Layout.fillHeight: true - source: modelData.iconName - } - Label { - Layout.fillWidth: true - text: modelData.text - } - Icon { - Layout.minimumWidth: height - Layout.maximumWidth: Layout.minimumWidth - Layout.fillHeight: true - source: "go-next" - visible: modelData.children != undefined - } + width: height + source: "go-next" + visible: modelData.children != undefined } + onClicked: { if (modelData.children) { pageRow.push(menuComponent, {"model": modelData.children, "level": level + 1}); diff --git a/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml b/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml index 43c62d400..5fd62319d 100644 --- a/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml +++ b/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml @@ -98,41 +98,64 @@ Item { Rectangle { - id : background + id: shadowHolder color: Theme.backgroundColor - + x: itemMouse.x + itemMouse.width width: parent.width height: parent.height - MouseArea { - anchors.fill: parent - onClicked: itemMouse.x = 0; + } + InnerShadow { + anchors.fill: shadowHolder + radius: Units.smallSpacing * 2 + samples: 16 + horizontalOffset: verticalOffset + verticalOffset: Units.smallSpacing / 2 + color: Qt.rgba(0, 0, 0, 0.3) + source: shadowHolder + } + + MouseArea { + anchors.fill: parent + drag { + target: itemMouse + axis: Drag.XAxis + maximumX: 0 + } + onClicked: itemMouse.x = 0; + onPressed: handleArea.mouseDown(mouse); + onPositionChanged: handleArea.positionChanged(mouse); + onReleased: handleArea.released(mouse); + } + RowLayout { + anchors { + right: parent.right + verticalCenter: parent.verticalCenter + rightMargin: y } - RowLayout { - anchors { - right: parent.right - verticalCenter: parent.verticalCenter - rightMargin: y + height: Math.min( parent.height / 1.5, Units.iconSizes.medium) + property bool exclusive: false + property Item checkedButton + spacing: Units.largeSpacing + Repeater { + model: { + if (listItem.actions.length == 0) { + return null; + } else { + return listItem.actions[0].text !== undefined && + listItem.actions[0].trigger !== undefined ? + listItem.actions : + listItem.actions[0]; + } } - height: Math.min( parent.height / 1.5, Units.iconSizes.medium) - property bool exclusive: false - property Item checkedButton - spacing: 0 - Repeater { - model: { - if (listItem.actions.length == 0) { - return null; - } else { - return listItem.actions[0].text !== undefined && - listItem.actions[0].trigger !== undefined ? - listItem.actions : - listItem.actions[0]; + delegate: Icon { + Layout.fillHeight: true + Layout.minimumWidth: height + source: modelData.iconName + MouseArea { + anchors { + fill: parent + margins: -Units.smallSpacing } - } - delegate: ToolButton { - Layout.fillHeight: true - Layout.minimumWidth: height - iconName: modelData.iconName - property bool flat: false onClicked: { if (modelData && modelData.trigger !== undefined) { modelData.trigger(); @@ -148,45 +171,8 @@ Item { } } } - InnerShadow { - anchors.fill: parent - radius: Units.smallSpacing * 2 - samples: 16 - horizontalOffset: 0 - verticalOffset: Units.smallSpacing / 2 - color: Qt.rgba(0, 0, 0, 0.3) - source: background - } - LinearGradient { - id: shadow - //TODO: depends from app layout - property bool inverse: true - width: Units.smallSpacing * 2 - anchors { - right: shadow.inverse ? undefined : itemMouse.left - left: shadow.inverse ? itemMouse.right : undefined - top: itemMouse.top - bottom: itemMouse.bottom - rightMargin: -1 - } - start: Qt.point(0, 0) - end: Qt.point(Units.smallSpacing*2, 0) - gradient: Gradient { - GradientStop { - position: 0.0 - color: shadow.inverse ? Qt.rgba(0, 0, 0, 0.3) : "transparent" - } - GradientStop { - position: shadow.inverse ? 0.3 : 0.7 - color: Qt.rgba(0, 0, 0, 0.15) - } - GradientStop { - position: 1.0 - color: shadow.inverse ? "transparent" : Qt.rgba(0, 0, 0, 0.3) - } - } - } - + + MouseArea { id: itemMouse property bool changeBackgroundOnPress: !listItem.checked && !listItem.sectionDelegate @@ -223,7 +209,27 @@ Item { } } + Timer { + id: speedSampler + interval: 100 + repeat: true + property real speed + property real oldItemMouseX + onTriggered: { + speed = itemMouse.x - oldItemMouseX; + oldItemMouseX = itemMouse.x; + } + onRunningChanged: { + if (running) { + speed = 0; + } else { + speed = itemMouse.x - oldItemMouseX; + } + oldItemMouseX = itemMouse.x; + } + } MouseArea { + id: handleArea width: Units.iconSizes.smallMedium height: width preventStealing: true @@ -236,12 +242,23 @@ Item { target: itemMouse axis: Drag.XAxis maximumX: 0 + minimumX: -listItem.width + } + function mouseDown(mouse) { + speedSampler.speed = 0; + speedSampler.running = true; } + onPressed: mouseDown(mouse); + onCanceled: speedSampler.running = false; onReleased: { - if (itemMouse.x > -itemMouse.width/2) { + speedSampler.running = false; + + if (speedSampler.speed < -Units.gridUnit * 3) { + itemMouse.x = -itemMouse.width + width * 2; + } else if (speedSampler.speed > Units.gridUnit * 3 || itemMouse.x > -itemMouse.width/3) { itemMouse.x = 0; } else { - itemMouse.x = -itemMouse.width + width * 2 + itemMouse.x = -itemMouse.width + width * 2; } } onClicked: { diff --git a/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml b/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml index c6e9d4b36..061a9f490 100644 --- a/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml @@ -37,11 +37,11 @@ Description: Properties: bool opened: If true the drawer is open showing the contents of the "drawer" - component. + component. Item page: It's the default property. it's the main content of the drawer page, - the part that is always shown + the part that is always shown Item contentItem: It's the part that can be pulled in and out, will act as a sidebar. @@ -53,30 +53,63 @@ AbstractDrawer { default property alias page: mainPage.data property Item contentItem - property alias opened: browserFrame.open + property alias opened: mainFlickable.open property int edge: Qt.LeftEdge property real position: 0 - - onContentItemChanged: contentItem.parent = drawerPage onPositionChanged: { - if (!enabled) { - return; - } - if (root.edge == Qt.LeftEdge) { - browserFrame.x = -browserFrame.width + position * browserFrame.width; - } else { - browserFrame.x = root.width - (position * browserFrame.width); + if (!mainFlickable.flicking && !mainFlickable.dragging && !mainAnim.running) { + switch (root.edge) { + case Qt.RightEdge: + mainFlickable.contentX = drawerPage.width * position; + break; + case Qt.LeftEdge: + mainFlickable.contentX = drawerPage.width * (1-position); + break; + case Qt.BottomEdge: + mainFlickable.contentY = drawerPage.height * position; + break; + } } } + onContentItemChanged: { + contentItem.parent = drawerPage + contentItem.anchors.fill = drawerPage + } + + function open () { - mouseEventListener.startBrowserFrameX = browserFrame.x; - browserFrame.state = "Dragging"; - browserFrame.state = "Open"; + mainAnim.to = 0; + switch (root.edge) { + case Qt.RightEdge: + mainAnim.to = drawerPage.width; + break; + case Qt.BottomEdge: + mainAnim.to = drawerPage.height; + break; + case Qt.LeftEdge: + case Qt.TopEdge: + default: + mainAnim.to = 0; + break; + } + mainAnim.running = true; + mainFlickable.open = true; } function close () { - mouseEventListener.startBrowserFrameX = browserFrame.x; - browserFrame.state = "Dragging"; - browserFrame.state = "Closed"; + switch (root.edge) { + case Qt.RightEdge: + case Qt.BottomEdge: + mainAnim.to = 0; + break; + case Qt.LeftEdge: + mainAnim.to = drawerPage.width; + break; + case Qt.TopEdge: + mainAnim.to = drawerPage.height; + break; + } + mainAnim.running = true; + mainFlickable.open = false; } Item { @@ -88,236 +121,257 @@ AbstractDrawer { Rectangle { anchors.fill: parent color: "black" - opacity: 0.6 * (root.edge == Qt.LeftEdge - ? ((browserFrame.x + browserFrame.width) / browserFrame.width) - : (1 - browserFrame.x / root.width)) + opacity: 0.6 * mainFlickable.internalPosition + } + + + NumberAnimation { + id: mainAnim + target: mainFlickable + properties: (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) ? "contentX" : "contentY" + duration: Units.longDuration + easing.type: Easing.InOutQuad } MouseArea { + id: edgeMouse anchors { right: root.edge == Qt.LeftEdge ? undefined : parent.right - left: root.edge == Qt.LeftEdge ? parent.left : undefined - top: parent.top - bottom: parent.bottom + left: root.edge == Qt.RightEdge ? undefined : parent.left + top: root.edge == Qt.BottomEdge ? undefined : parent.top + bottom: root.edge == Qt.TopEdge ? undefined : parent.bottom } z: 99 - width: Units.smallSpacing - onPressed: mouseEventListener.managePressed(mouse) - onPositionChanged: mouseEventListener.positionChanged(mouse) - onReleased: mouseEventListener.released(mouse) - } - MouseArea { - id: mouseEventListener - anchors.fill: parent - drag.filterChildren: true - property int startBrowserFrameX + width: Units.smallSpacing * 2 + height: Units.smallSpacing * 2 property int startMouseX property real oldMouseX + property int startMouseY + property real oldMouseY property bool startDragging: false - property string startState - enabled: browserFrame.state != "Closed" - onPressed: managePressed(mouse) - function managePressed(mouse) { + onPressed: { if (drawerPage.children.length == 0) { mouse.accepted = false; return; } + speedSampler.restart(); mouse.accepted = true; - startBrowserFrameX = browserFrame.x; oldMouseX = startMouseX = mouse.x; + oldMouseY = startMouseY = mouse.y; startDragging = false; - startState = browserFrame.state; - browserFrame.state = "Dragging"; - browserFrame.x = startBrowserFrameX; } onPositionChanged: { - if (drawerPage.children.length == 0) { + if (!root.contentItem) { mouse.accepted = false; return; } - if (mouse.x < Units.gridUnit || - Math.abs(mouse.x - startMouseX) > root.width / 5) { + if (Math.abs(mouse.x - startMouseX) > root.width / 5 || + Math.abs(mouse.y - startMouseY) > root.height / 5) { startDragging = true; } if (startDragging) { - browserFrame.x = root.edge == Qt.LeftEdge - ? Math.min(0, browserFrame.x + mouse.x - oldMouseX) - : Math.max(root.width - browserFrame.width, browserFrame.x + mouse.x - oldMouseX); + switch (root.edge) { + case Qt.RightEdge: + mainFlickable.contentX = Math.min(mainItem.width - root.width, mainFlickable.contentX + oldMouseX - mouse.x); + break; + case Qt.LeftEdge: + mainFlickable.contentX = Math.max(0, mainFlickable.contentX + oldMouseX - mouse.x); + break; + case Qt.BottomEdge: + mainFlickable.contentY = Math.min(mainItem.height - root.height, mainFlickable.contentY + oldMouseY - mouse.y); + break; + case Qt.TopEdge: + mainFlickable.contentY = Math.max(0, mainFlickable.contentY + oldMouseY - mouse.y); + break; + } } oldMouseX = mouse.x; + oldMouseY = mouse.y; } - onReleased: { - if (drawerPage.children.length == 0) { - mouse.accepted = false; - return; - } - - if (root.edge == Qt.LeftEdge) { - if (mouse.x < Units.gridUnit) { - browserFrame.state = "Closed"; - } else if (browserFrame.x - startBrowserFrameX > browserFrame.width / 3) { - browserFrame.state = "Open"; - } else if (startBrowserFrameX - browserFrame.x > browserFrame.width / 3) { - browserFrame.state = "Closed"; + speedSampler.running = false; + if (speedSampler.speed != 0) { + if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) { + mainFlickable.flick(speedSampler.speed, 0); } else { - browserFrame.state = startState + mainFlickable.flick(0, speedSampler.speed); } - } else { - if (mouse.x > width - Units.gridUnit) { - browserFrame.state = "Closed"; - } else if (browserFrame.x - startBrowserFrameX > browserFrame.width / 3) { - browserFrame.state = "Closed"; - } else if (startBrowserFrameX - browserFrame.x > browserFrame.width / 3) { - browserFrame.state = "Open"; + if (mainFlickable.internalPosition > 0.5) { + root.open(); } else { - browserFrame.state = startState; + root.close(); } } } - onCanceled: { - if (oldMouseX > width - Units.gridUnit) { - browserFrame.state = "Closed"; - } else if (Math.abs(browserFrame.x - startBrowserFrameX) > browserFrame.width / 3) { - browserFrame.state = startState == "Open" ? "Closed" : "Open"; + } + + Timer { + id: speedSampler + interval: 100 + repeat: true + property real speed + property real oldContentX + property real oldContentY + onTriggered: { + if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) { + speed = (mainFlickable.contentX - oldContentX) * 10; + oldContentX = mainFlickable.contentX; } else { - browserFrame.state = "Open"; - } - } - onClicked: { - if (Math.abs(startMouseX - mouse.x) > Units.gridUnit) { - return; - } - if ((root.edge == Qt.LeftEdge && mouse.x > browserFrame.width) || - (root.edge != Qt.LeftEdge && mouse.x < browserFrame.x)) { - browserFrame.state = startState == "Open" ? "Closed" : "Open"; - root.clicked(); + speed = (mainFlickable.contentY - oldContentY) * 10; + oldContentY = mainFlickable.contentY; } } - Rectangle { - id: browserFrame - z: 100 - color: Theme.viewBackgroundColor - anchors { - top: parent.top - bottom: parent.bottom - } - - width: { - if (drawerPage.children.length > 0 && drawerPage.children[0].implicitWidth > 0) { - return Math.min( parent.width - Units.gridUnit, drawerPage.children[0].implicitWidth) + onRunningChanged: { + if (running) { + speed = 0; + oldContentX = mainFlickable.contentX; + oldContentY = mainFlickable.contentY; + } else { + if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) { + speed = (oldContentX - mainFlickable.contentX) * 10; } else { - return parent.width - Units.gridUnit * 3 + speed = (oldContentY - mainFlickable.contentY) * 10; } } + } + } - onXChanged: { - root.position = root.edge == Qt.LeftEdge ? 1 + browserFrame.x/browserFrame.width : (root.width - browserFrame.x)/browserFrame.width; + MouseArea { + id: mainMouseArea + anchors.fill: parent + drag.filterChildren: true + onClicked: { + if ((root.edge == Qt.LeftEdge && mouse.x < drawerPage.width) || + (root.edge == Qt.RightEdge && mouse.x > drawerPage.x) || + (root.edge == Qt.TopEdge && mouse.y < drawerPage.height) || + (root.edge == Qt.BottomEdge && mouse.y > drawerPage.y)) { + return; } + root.clicked(); + root.close(); + } + enabled: (root.edge == Qt.LeftEdge && !mainFlickable.atXEnd) || + (root.edge == Qt.RightEdge && !mainFlickable.atXBeginning) || + (root.edge == Qt.TopEdge && !mainFlickable.atYEnd) || + (root.edge == Qt.BottomEdge && !mainFlickable.atYBeginning) || + mainFlickable.moving - state: "Closed" - onStateChanged: open = (state != "Closed") - property bool open: false - onOpenChanged: { - if (browserFrame.state == "Dragging" || drawerPage.children.length == 0) { - return; - } + Flickable { + id: mainFlickable + property bool open + anchors.fill: parent + onOpenChanged: { if (open) { - browserFrame.state = "Open"; + root.open(); } else { - browserFrame.state = "Closed"; + root.close(); } } - - LinearGradient { - width: Units.gridUnit/2 - anchors { - right: root.edge == Qt.LeftEdge ? undefined : parent.left - left: root.edge == Qt.LeftEdge ? parent.right : undefined - top: parent.top - bottom: parent.bottom + enabled: parent.enabled + flickableDirection: root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge ? Flickable.HorizontalFlick : Flickable.VerticalFlick + contentWidth: mainItem.width + contentHeight: mainItem.height + boundsBehavior: Flickable.StopAtBounds + property real internalPosition: { + switch (root.edge) { + case Qt.RightEdge: + return mainFlickable.contentX/drawerPage.width; + case Qt.LeftEdge: + return 1 - (mainFlickable.contentX/drawerPage.width); + case Qt.BottomEdge: + return mainFlickable.contentY/drawerPage.height; + case Qt.TopEdge: + return 1 - (mainFlickable.contentY/drawerPage.height); } - opacity: root.position == 0 ? 0 : 1 - start: Qt.point(0, 0) - end: Qt.point(Units.gridUnit/2, 0) - gradient: Gradient { - GradientStop { - position: 0.0 - color: root.edge == Qt.LeftEdge ? Qt.rgba(0, 0, 0, 0.3) : "transparent" - } - GradientStop { - position: root.edge == Qt.LeftEdge ? 0.3 : 0.7 - color: Qt.rgba(0, 0, 0, 0.15) - } - GradientStop { - position: 1.0 - color: root.edge == Qt.LeftEdge ? "transparent" : Qt.rgba(0, 0, 0, 0.3) - } - } - Behavior on opacity { - NumberAnimation { - duration: Units.longDuration - easing.type: Easing.InOutQuad + } + onInternalPositionChanged: { + root.position = internalPosition; + } + + onFlickingChanged: { + if (!flicking) { + if (internalPosition > 0.5) { + root.open(); + } else { + root.close(); } } } - - - MouseArea { - id: drawerPage - anchors { - fill: parent - //leftMargin: Units.gridUnit + onMovingChanged: { + if (!moving) { + flickingChanged(); } - clip: true - onChildrenChanged: drawerPage.children[0].anchors.fill = drawerPage } - states: [ - State { - name: "Open" - PropertyChanges { - target: browserFrame - x: root.edge == Qt.LeftEdge ? 0 : root.width - browserFrame.width + Item { + id: mainItem + width: root.width + ((root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) ? drawerPage.width : 0) + height: root.height + ((root.edge == Qt.TopEdge || root.edge == Qt.BottomEdge) ? drawerPage.height : 0) + onWidthChanged: { + if (root.edge == Qt.LeftEdge) { + mainFlickable.contentX = drawerPage.width; } - }, - State { - name: "Dragging" - //workaround for a quirkiness of the state machine - //if no x binding gets defined in this state x will be set to whatever last x it had last time it was in this state - PropertyChanges { - target: browserFrame - x: mouseEventListener.startBrowserFrameX + } + onHeightChanged: { + if (root.edge == Qt.TopEdge) { + mainFlickable.contentY = drawerPage.Height; } - }, - State { - name: "Closed" - PropertyChanges { - target: browserFrame - x: root.edge == Qt.LeftEdge ? -browserFrame.width : root.width + } + + Rectangle { + id: drawerPage + anchors { + left: root.edge != Qt.RightEdge ? parent.left : undefined + right: root.edge != Qt.LeftEdge ? parent.right : undefined + top: root.edge != Qt.BottomEdge ? parent.top : undefined + bottom: root.edge != Qt.TopEdge ? parent.bottom : undefined } + color: Theme.viewBackgroundColor + clip: true + width: root.contentItem ? Math.min(root.contentItem.implicitWidth, root.width - Units.gridUnit * 2) : 0 + height: root.contentItem ? Math.min(root.contentItem.implicitHeight, root.height - Units.gridUnit * 2) : 0 } - ] + LinearGradient { + width: Units.gridUnit/2 + height: Units.gridUnit/2 + anchors { + right: root.edge == Qt.RightEdge ? drawerPage.left : (root.edge == Qt.LeftEdge ? undefined : parent.right) + left: root.edge == Qt.LeftEdge ? drawerPage.right : (root.edge == Qt.RightEdge ? undefined : parent.left) + top: root.edge == Qt.TopEdge ? drawerPage.bottom : (root.edge == Qt.BottomEdge ? undefined : parent.top) + bottom: root.edge == Qt.BottomEdge ? drawerPage.top : (root.edge == Qt.TopEdge ? undefined : parent.bottom) + } - transitions: [ - Transition { - //Exclude Dragging - to: "Open,Closed" - NumberAnimation { - id: transitionAnim - properties: "x" - duration: Units.longDuration - easing.type: Easing.InOutQuad + opacity: root.position == 0 ? 0 : 1 + start: Qt.point(0, 0) + end: (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) ? Qt.point(Units.gridUnit/2, 0) : Qt.point(0, Units.gridUnit/2) + gradient: Gradient { + GradientStop { + position: 0.0 + color: root.edge == Qt.LeftEdge ? Qt.rgba(0, 0, 0, 0.3) : "transparent" + } + GradientStop { + position: root.edge == Qt.LeftEdge ? 0.3 : 0.7 + color: Qt.rgba(0, 0, 0, 0.15) + } + GradientStop { + position: 1.0 + color: root.edge == Qt.LeftEdge ? "transparent" : Qt.rgba(0, 0, 0, 0.3) + } + } + Behavior on opacity { + NumberAnimation { + duration: Units.longDuration + easing.type: Easing.InOutQuad + } } } - ] + } } } } - diff --git a/qt-mobile/qml/mobilecomponents/Page.qml b/qt-mobile/qml/mobilecomponents/Page.qml index fe36a034a..449c7aa47 100644 --- a/qt-mobile/qml/mobilecomponents/Page.qml +++ b/qt-mobile/qml/mobilecomponents/Page.qml @@ -47,23 +47,10 @@ Rectangle { */ property alias contextualActions: internalContextualActions.data - property Flickable flickable Item { id: internalContextualActions } Layout.fillWidth: true color: "transparent" - -/* - Connections { - target: flickable - property real oldContentY: (flickable == null) ? 0 : flickable.contentY - onContentYChanged: { - actionButton.transform[0].y = Math.min(actionButton.height, Math.max(0, actionButton.transform[0].y + (flickable.contentY - oldContentY))); - - oldContentY = flickable.contentY; - } - } - */ } diff --git a/qt-mobile/qml/mobilecomponents/PageRow.qml b/qt-mobile/qml/mobilecomponents/PageRow.qml index ab0e9a5ed..b69b39c8f 100644 --- a/qt-mobile/qml/mobilecomponents/PageRow.qml +++ b/qt-mobile/qml/mobilecomponents/PageRow.qml @@ -56,7 +56,7 @@ Item { property int depth: Engine.getDepth() property Item currentPage: null - property Item lastVisiblePage + property Item lastVisiblePage: currentPage property ToolBar toolBar property variant initialPage //A column is wide enough for 30 characters @@ -154,7 +154,10 @@ Item { return; } - actualRoot.lastVisiblePage = root.children[Math.floor((mainFlickable.contentX + mainFlickable.width - 1)/columnWidth)].page + actualRoot.lastVisiblePage = root.children[Math.floor((mainFlickable.contentX + mainFlickable.width - 1)/columnWidth)].page; + if (!actualRoot.lastVisiblePage) { + actualRoot.lastVisiblePage = actualRoot.currentPage; + } } } } diff --git a/qt-mobile/qml/mobilecomponents/icons/go-next.svg b/qt-mobile/qml/mobilecomponents/icons/go-next.svg index f2828f18f..fe4e783de 100644 --- a/qt-mobile/qml/mobilecomponents/icons/go-next.svg +++ b/qt-mobile/qml/mobilecomponents/icons/go-next.svg @@ -1,144 +1,76 @@ - + - - - - - - + + + + + + - - + + - - + + - - - - - - - - - - + + + + + + + + + + - + - + image/svg+xml - - + + - - - + + + diff --git a/qt-mobile/qml/mobilecomponents/icons/go-previous.svg b/qt-mobile/qml/mobilecomponents/icons/go-previous.svg index 7cfd42891..743ff18e2 100644 --- a/qt-mobile/qml/mobilecomponents/icons/go-previous.svg +++ b/qt-mobile/qml/mobilecomponents/icons/go-previous.svg @@ -1,463 +1,127 @@ - + - - - - - - + + + + + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - + + - - + + - - + + - - + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + - + - + image/svg+xml - - + + - - - + + + diff --git a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml index 9ad55ff7c..80f037e48 100644 --- a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml +++ b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml @@ -27,6 +27,8 @@ MouseArea { property alias iconSource: icon.source property bool checkable: false property bool checked: false + //either Action or QAction should work here + property QtObject action Layout.minimumWidth: Units.iconSizes.large Layout.maximumWidth: Layout.minimumWidth implicitWidth: Units.iconSizes.large @@ -34,8 +36,8 @@ MouseArea { drag { target: button axis: Drag.XAxis - minimumX: contextDrawer ? 0 : parent.width/2 - width/2 - maximumX: globalDrawer ? parent.width : parent.width/2 - width/2 + minimumX: parent.width/2 - width/2 - (contextDrawer && contextDrawer.enabled ? contextDrawer.contentItem.width : 0) + maximumX: parent.width/2 - width/2 + (globalDrawer && globalDrawer.enabled ? globalDrawer.contentItem.width : 0) } function toggleVisibility() { showAnimation.running = false; @@ -74,6 +76,11 @@ MouseArea { if (checkable) { checked = !checked; } + + //if an action has been assigned, trigger it + if (button.action && button.action.trigger) { + button.action.trigger(); + } } Connections { target: globalDrawer diff --git a/qt-mobile/qml/mobilecomponents/qmldir b/qt-mobile/qml/mobilecomponents/qmldir index 53daf98a2..999f823ea 100644 --- a/qt-mobile/qml/mobilecomponents/qmldir +++ b/qt-mobile/qml/mobilecomponents/qmldir @@ -16,4 +16,6 @@ Icon 0.2 Icon.qml Label 0.2 Label.qml Heading 0.2 Heading.qml ListItem 0.2 ListItem.qml +BasicListItem 0.2 BasicListItem.qml ListItemWithActions 0.2 ListItemWithActions.qml +RefreshableScrollView 0.2 RefreshableScrollView.qml -- cgit v1.2.3-70-g09d2