diff --git a/src/apps/marble-maps/Bookmarks.qml b/src/apps/marble-maps/Bookmarks.qml --- a/src/apps/marble-maps/Bookmarks.qml +++ b/src/apps/marble-maps/Bookmarks.qml @@ -13,252 +13,235 @@ import QtQuick.Window 2.2 import QtQuick.Layouts 1.3 import QtQml.Models 2.1 +import QtQuick.Controls.Material 2.1 import QtGraphicalEffects 1.0 import org.kde.kirigami 2.0 as Kirigami import org.kde.marble 0.20 -Kirigami.ScrollablePage { + +Kirigami.Page { id: bookmarkPage title: "Bookmarks" - property int currentIndex: 0 - property var marbleQuickItem: null - - SystemPalette{ - id: palette - colorGroup: SystemPalette.Active - } + property variant marbleQuickItem + signal backTriggered() - Rectangle { + Flickable { + id: root anchors.fill: parent - color: palette.base - } + property int currentIndex: 0 - Column { - id: column - anchors { - fill: parent - margins: Screen.pixelDensity * 2 + SystemPalette { + id: palette + colorGroup: SystemPalette.Active } - Text { - text: "

Bookmarks

" - } + Column { + id: column + anchors { + fill: parent + margins: Screen.pixelDensity * 2 + } - ListView { - id: bookmarksView - width: parent.width - interactive: false - spacing: 5 - height: contentHeight - - model: DelegateModel { - id: visualModel - model: bookmarks.model - delegate: MouseArea { - id: delegateRoot - property int visualIndex: DelegateModel.itemsIndex - width: bookmarksView.width - height: 100 - drag.target: bookmarkRectangle - drag.axis: Drag.YAxis - - SwipeDelegate { - id: delegate - text: model.display - width: parent.width - - contentItem: Rectangle { - id: bookmarkRectangle + Text { + text: "

Bookmarks

" + } + + ListView { + id: bookmarksView + interactive: false + width: parent.width + spacing: 5 + height: contentHeight + + model: DelegateModel { + id: visualModel + model: bookmarks.model + + delegate: + MouseArea { + id: delegateRoot + propagateComposedEvents: true + property int visualIndex: DelegateModel.itemsIndex + width: bookmarksView.width + height: 100 + drag.target: icon + drag.axis: Drag.YAxis + + SwipeDelegate { + id: delegate + text: model.display width: parent.width - height: Screen.pixelDensity * 2 + Math.max(text.height, imageButton.height) - color: palette.basefconte - anchors { - horizontalCenter: parent.horizontalCenter; - } + height: Screen.pixelDensity * 2 + Math.max(bookmarkText.height, imageButton.height) - Drag.active: delegateRoot.drag.active - Drag.source: delegateRoot - Drag.hotSpot.x: 36 - Drag.hotSpot.y: 36 + contentItem: Rectangle { + id: icon + width: parent.width + height: Screen.pixelDensity + Math.max(bookmarkText.height, imageButton.height) - Text { - id: text anchors { - left: imageButton.right - right: dragButton.left - leftMargin: parent.width * 0.05 + horizontalCenter: parent.horizontalCenter; verticalCenter: parent.verticalCenter } - elide: Text.ElideMiddle - text: model.display - verticalAlignment: Qt.AlignVCenter - font.pointSize: 12 - color: palette.text - } + Drag.active: delegateRoot.drag.active + Drag.source: delegateRoot + Drag.hotSpot.x: 50 //150 + Drag.hotSpot.y: 50 //150 + color: "transparent" + + Text{ + id: bookmarkText + anchors.left: imageButton.right + leftPadding: 5 + text: delegate.text + elide: Text.ElideRight + horizontalAlignment: Text.AlignLeft + anchors.verticalCenter: parent.verticalCenter + font.pointSize: 12 + color: palette.text + } - Image { - id: imageButton - anchors { - left: bookmarksView.left - verticalCenter: parent.verticalCenter + Image { + id: imageButton + anchors { + left: bookmarksView.left + verticalCenter: parent.verticalCenter + } + source: "qrc:///material/place.svg" + width: Screen.pixelDensity * 6 + verticalAlignment: Qt.AlignVCenter + + height: width + smooth: true } - source: "qrc:///material/place.svg" - width: Screen.pixelDensity * 6 - verticalAlignment: Qt.AlignVCenter - height: width - smooth: true + ColorOverlay{ + anchors.fill: imageButton + source: imageButton + color: palette.highlight + } } - ColorOverlay{ - anchors.fill: imageButton - source: imageButton - color: palette.highlight - } + swipe.behind: Item { + width: parent.width + height: parent.height - Image { - id: dragButton - anchors{ - verticalCenter: parent.verticalCenter - right: parent.right + Rectangle{ + width: parent.width + color: "#333333" + height: parent.height + z: 200 + Text { + font.pointSize: 10 + text: qsTr("Removed") + color: "white" + + padding: 20 + anchors.fill: parent + horizontalAlignment: Qt.AlignRight + verticalAlignment: Qt.AlignVCenter + + opacity: delegate.swipe.complete ? 1 : 0 + Behavior on opacity { + NumberAnimation {} + } + } } - width: Screen.pixelDensity * 6 - height: width - source: "qrc:///material/drag.png" - verticalAlignment: Qt.AlignVCenter - smooth: true + SwipeDelegate.onClicked: delegate.swipe.close() + SwipeDelegate.onPressedChanged: undoTimer.stop() } - } - background: Rectangle { - width: parent.width - height: parent.height - opacity: enabled ? 1 : 0.3 - color: delegate.down ? "#dddedf" : "transparent" - } + Timer { + id: undoTimer + interval: 1600 + onTriggered: { + var currentBookmark = bookmarks.placemark(index) + bookmarks.removeBookmark(currentBookmark.longitude, currentBookmark.latitude) + } + } - swipe.behind: Rectangle { - id: rect - width: parent.width - height: Screen.pixelDensity * 4 - clip: true - color: SwipeDelegate.pressed ? "#555" : "transparent" - - Label { - font.family: "Fontello" - text: delegate.swipe.complete ? "\ue805" // icon-cw-circled - : "\ue801" // icon-cancel-circled-1 - anchors.fill: parent - horizontalAlignment: Qt.AlignRight - - opacity: 2 * -delegate.swipe.position - color: Material.Red - Behavior on color { ColorAnimation { } } + swipe.onCompleted: undoTimer.start() + swipe.onClosed: delegate.swipe.close() + swipe.transition: Transition { + SmoothedAnimation { velocity: 3; easing.type: Easing.InOutCubic } } - Rectangle{ - width: parent.width - color: "#333333" - height: parent.height - z: 200 - Text { - font.pointSize: 10 - text: qsTr("Removed") - color: "white" - padding: 20 - anchors.fill: parent - horizontalAlignment: Qt.AlignRight - opacity: delegate.swipe.complete ? 1 : 0 - Behavior on opacity { - NumberAnimation {} + states: [ + State { + when: icon.Drag.active + ParentChange { + target: icon + parent: root + } + + AnchorChanges { + target: icon; + anchors.horizontalCenter: undefined; + anchors.verticalCenter: undefined } } + ] + background: Rectangle { + color: "transparent" } - - SwipeDelegate.onClicked: delegate.swipe.close() - SwipeDelegate.onPressedChanged: undoTimer.stop() } - Timer { - id: undoTimer - interval: 3600 - onTriggered: { - var currentBookmark = bookmarks.placemark(index) - bookmarks.removeBookmark(currentBookmark.longitude, currentBookmark.latitude) - } + DropArea { + anchors.fill: parent + onEntered: visualModel.items.move(drag.source.visualIndex, delegateRoot.visualIndex) } + } + } - swipe.onCompleted: undoTimer.start() - - states: [ - State { - when: bookmarkRectangle.Drag.active - ParentChange { - target: bookmarkRectangle - parent: column - } - - AnchorChanges { - target: bookmarkRectangle; - anchors.horizontalCenter: undefined; - anchors.verticalCenter: undefined - } - } - ] + remove: Transition { + SequentialAnimation { + PauseAnimation { duration: 125 } + NumberAnimation { property: "height"; to: 0; easing.type: Easing.InOutQuad } } + } - DropArea { - anchors.fill: parent - onEntered: visualModel.items.move(drag.source.visualIndex, delegateRoot.visualIndex) + displaced: Transition { + SequentialAnimation { + PauseAnimation { duration: 125 } + NumberAnimation { property: "y"; easing.type: Easing.InOutQuad } } } } - remove: Transition { - SequentialAnimation { - PauseAnimation { duration: 125 } - NumberAnimation { property: "height"; to: 0; easing.type: Easing.InOutQuad } + Column { + visible: bookmarksView.model.count === 0 + width: parent.width + + Text { + width: 0.8 * parent.width + font.pointSize: 18 + color: paletteDisabled.text + text: qsTr("Your bookmarks will appear here.") + wrapMode: Text.WrapAtWordBoundaryOrAnywhere + elide: Text.ElideRight } - } - displaced: Transition { - NumberAnimation { properties: "x,y"; easing.type: Easing.OutQuad } + Image { + anchors.right: parent.right + anchors.bottom: column.bottom + width: 0.3 * parent.width + fillMode: Image.PreserveAspectFit + source: "qrc:/konqi/books.png" + } } } - Column { - visible: bookmarksView.model.count === 0 - width: parent.width - - Text { - width: 0.8 * parent.width - font.pointSize: 18 - color: paletteDisabled.text - text: qsTr("Your bookmarks will appear here.") - wrapMode: Text.WrapAtWordBoundaryOrAnywhere - elide: Text.ElideRight - } - - Image { - anchors.right: parent.right - anchors.bottom: column.bottom - width: 0.3 * parent.width - fillMode: Image.PreserveAspectFit - source: "qrc:/konqi/books.png" - } - } } Bookmarks { id: bookmarks map: marbleQuickItem } -} - + //onMapChanged: bookmarks.map = map +} diff --git a/src/apps/marble-maps/PlacemarkDialog.qml b/src/apps/marble-maps/PlacemarkDialog.qml --- a/src/apps/marble-maps/PlacemarkDialog.qml +++ b/src/apps/marble-maps/PlacemarkDialog.qml @@ -14,6 +14,8 @@ import QtQuick.Layouts 1.3 import QtQuick.Dialogs 1.2 +import org.kde.kirigami 2.0 as Kirigami + import org.kde.marble 0.20 Item { @@ -161,15 +163,23 @@ } } - - Dialog { + Kirigami.OverlaySheet { id: routesDialog - title: qsTr("Routes") - RoutesItem { - id: routesItem - implicitWidth: parent.width - model: placemark === null ? undefined : placemark.routeRelationModel - onHighlightChanged: map.highlightRouteRelation(oid, enabled) + ColumnLayout { + property int implicitWidth: root.width//Units.gridUnit * 30 + id: columnLayout + Label{ + Layout.fillWidth: true + text: qsTr("

Routes

") + + } + RoutesItem { + id: routesItem + Layout.fillWidth: true + model: placemark === null ? undefined : placemark.routeRelationModel + onHighlightChanged: map.highlightRouteRelation(oid, enabled) + } + } } }