diff --git a/data/qml/stations/CreateByArtist.qml b/data/qml/stations/CreateByArtist.qml index bda53dc77..31495a6a6 100644 --- a/data/qml/stations/CreateByArtist.qml +++ b/data/qml/stations/CreateByArtist.qml @@ -15,7 +15,7 @@ Item { Column { id: upperColumn - anchors.centerIn: parent + anchors.horizontalCenter: parent.horizontalCenter height: parent.height width: defaultFontHeight * 30 anchors.bottomMargin: defaultFontHeight @@ -48,6 +48,7 @@ Item { } ArtistView { + id: artistView height: parent.height - headerText.height - artistInputField.height - parent.spacing * 3 width: parent.width model: artistChartsModel @@ -58,5 +59,8 @@ Item { createStation(artistChartsModel.itemFromIndex(index).artistName); } } + ScrollBar { + listView: artistView + } } } diff --git a/data/qml/tomahawkimports/ScrollBar.qml b/data/qml/tomahawkimports/ScrollBar.qml new file mode 100644 index 000000000..f4c3b0282 --- /dev/null +++ b/data/qml/tomahawkimports/ScrollBar.qml @@ -0,0 +1,66 @@ +import QtQuick 1.1 + +Item { + id: scrollBar + width: defaultFontHeight / 2 + + // the ListView where to attach this scrollbar + property variant listView + // the orientation of the scrollbar + property variant orientation : Qt.Vertical + + states: [ + State { + name: "hidden"; when: !listView.moving + PropertyChanges { target: scrollBar; opacity: 0 } + }, + State { + name: "visible"; when: listView.moving + PropertyChanges { target: scrollBar; opacity: 1 } + } + ] + transitions: [ + Transition { + from: "hidden" + to: "visible" + NumberAnimation { properties: "opacity"; duration: 200 } + }, + Transition { + from: "visible" + to: "hidden" + NumberAnimation { properties: "opacity"; duration: 2000 } + } + ] + + anchors { + left: orientation == Qt.Vertical ? listView.right : listView.left + leftMargin: orientation == Qt.Vertical ? defaultFontHeight / 4 : 0 + top: orientation == Qt.Vertical ? listView.top : listView.bottom + topMargin: orientation == Qt.Vertical ? 0 : defaultFontHeight / 4 + bottom: orientation == Qt.Vertical ? listView.bottom : undefined + right: orientation == Qt.Vertical ? undefined : listView.right + } + + // A light, semi-transparent background + Rectangle { + id: background + anchors.fill: parent + radius: orientation == Qt.Vertical ? (width/2 - 1) : (height/2 - 1) + color: "white" + opacity: 0.2 + } + + // Size the bar to the required size, depending upon the orientation. + Rectangle { + property real position: orientation == Qt.Vertical ? (listView.contentY / listView.contentHeight) : (listView.contentX / listView.contentWidth) + property real pageSize: orientation == Qt.Vertical ? (listView.height / listView.contentHeight) : (listView.width / listView.contentWidth) + + x: orientation == Qt.Vertical ? 1 : (position * (scrollBar.width-2) + 1) + y: orientation == Qt.Vertical ? (position * (scrollBar.height-2) + 1) : 1 + width: orientation == Qt.Vertical ? (parent.width-2) : (pageSize * (scrollBar.width-2)) + height: orientation == Qt.Vertical ? (pageSize * (scrollBar.height-2)) : (parent.height-2) + radius: orientation == Qt.Vertical ? (width/2 - 1) : (height/2 - 1) + color: "white" + opacity: 0.2 + } +} diff --git a/resources.qrc b/resources.qrc index bd5e578d4..212adacee 100644 --- a/resources.qrc +++ b/resources.qrc @@ -181,5 +181,6 @@ data/qml/tomahawkimports/HeaderLabel.qml data/qml/stations/CreateByGenre.qml data/qml/tomahawkimports/TagCloud.qml + data/qml/tomahawkimports/ScrollBar.qml