Adjust QML view

Add transitions on button showing / hiding
Add a ScrollView to make scollbars appear
Formatting fixes for readability
This commit is contained in:
Luca Beltrame 2015-02-07 00:03:06 +01:00
parent 6ee35b842c
commit 95554b1aac

View file

@ -32,19 +32,13 @@ Rectangle {
width: 500
height: 500
KRun {
id: runner
}
signal downloadRequested(url url)
FileDialog {
id: saveFileDialog
title: "Select a file to save to"
selectExisting: false
nameFilters: [ "Image files (*.jpg *.png *.tiff *.gif)", "All files (*)" ]
}
Component {
id: highlight
Rectangle {
@ -55,7 +49,6 @@ Rectangle {
}
}
Component {
id: viewDelegate
Item {
@ -63,12 +56,10 @@ Rectangle {
width: grid.cellWidth
height: grid.cellHeight
Column {
id: postElement
anchors.fill: parent
QPixmapItem {
id: pixItem
pixmap: thumbPix
@ -90,54 +81,73 @@ Rectangle {
}
onEntered: {
viewButton.visible = mouseArea.containsMouse ? true: false
downloadButton.visible = mouseArea.containsMouse ? true: false
viewButton.visible = true
downloadButton.visible = true
viewButton.opacity = 1
downloadButton.opacity = 1
}
onExited: {
viewButton.visible = mouseArea.containsMouse ? true: false
downloadButton.visible = mouseArea.containsMouse ? true: false
viewButton.opacity = 0
downloadButton.opacity = 0
}
Button {
id: viewButton
iconName: "view-preview"
visible: false
opacity: 0
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: (pixItem.height - pixItem.paintedHeight) / 2
anchors.leftMargin: (pixItem.width - pixItem.paintedWidth) / 2
height: pixItem.height * 0.15
width: pixItem.height * 0.15
z: 1
onClicked: {
runner.openUrl(fileUrl)
}
Behavior on opacity {
NumberAnimation {
duration: 200
}
}
}
Button {
id: downloadButton
iconName: "download"
visible: false
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.bottomMargin: (pixItem.height - pixItem.paintedHeight) / 2
anchors.leftMargin: (pixItem.width - pixItem.paintedWidth) / 2
height: pixItem.height * 0.15
width: pixItem.height * 0.15
z: 1
onClicked: {
console.log("AA" + pixItem.paintedHeight)
rootObj.downloadRequested(fileUrl)
}
Behavior on opacity {
NumberAnimation {
duration: 200
}
}
}
}
}
Text {
id: sizeText
@ -168,6 +178,9 @@ Rectangle {
}
}
ScrollView {
id: scrollView
anchors.fill: parent
GridView {
id: grid
cellWidth: 230
@ -184,10 +197,12 @@ Rectangle {
Component.onCompleted: currentIndex = -1
onAtYEndChanged: {
if (grid.atYEnd) {
// danbooruService.getPostList(2, "", 10)
// danbooruService.getPostList(2, "", 10)
}
}
}
}
}