KDE/danbooru-client
1
0
Fork 0
Code Issues Pull requests Releases Activity

Display tags when image is zoomed out

Browse source 
Next: try to display image info when one is clicked.
This commit is contained in:
Luca Beltrame 2015-03-01 23:17:10 +01:00
parent b97ef73677
commit c937f7707a
1 changed files with 34 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/qml/danbooruimageview.qml
View file

@ -116,7 +116,7 @@ Rectangle {
onDoubleClicked: { onDoubleClicked: {
// TODO: This needs to download the medium-size image (sample_url) // TODO: This needs to download the medium-size image (sample_url)
imageOverlay.imageDoubleClicked(sampleUrl) imageOverlay.imageDoubleClicked(sampleUrl, tags)
} }
@ -273,7 +273,7 @@ Rectangle {
Image { Image {
signal imageDoubleClicked( url url) signal imageDoubleClicked(url url, var tags)
id: imageOverlay id: imageOverlay
smooth: true smooth: true
@ -285,6 +285,7 @@ Rectangle {
visible: width > 0 visible: width > 0
z: 1 z: 1
Button { Button {
id: closeButton id: closeButton
anchors.top: parent.top anchors.top: parent.top
@ -301,6 +302,8 @@ Rectangle {
closeButton.visible = false closeButton.visible = false
// shrinkAnimation.start() // shrinkAnimation.start()
imageOverlay.visible = false imageOverlay.visible = false
overlayBox.visible = false
overlayText.visible = false
} }
} }
@ -315,8 +318,9 @@ Rectangle {
anchors.bottomMargin: (parent.height - parent.paintedHeight) / 2 anchors.bottomMargin: (parent.height - parent.paintedHeight) / 2
anchors.leftMargin: (parent.width - parent.paintedWidth) / 2 anchors.leftMargin: (parent.width - parent.paintedWidth) / 2
width: imageOverlay.paintedWidth width: imageOverlay.paintedWidth
height: imageOverlay.paintedHeight * 0.03 height: imageOverlay.paintedHeight * 0.05
opacity: 0.8 opacity: 0.8
visible: false
Text { Text {
id: overlayText id: overlayText
@ -325,6 +329,8 @@ Rectangle {
color: "white" color: "white"
visible: false visible: false
} }
} }
Keys.onEscapePressed: { Keys.onEscapePressed: {
@ -337,6 +343,13 @@ Rectangle {
imageOverlay.visible = true imageOverlay.visible = true
imageOverlay.source = url imageOverlay.source = url
closeButton.visible = true closeButton.visible = true
if (tags.length < 10) {
overlayText.text = i18n("Tags: %1", tags.toString())
} else {
overlayText.text = i18n("Tags: %1", tags.slice(0, 10).join(", "))
}
} }
onStatusChanged: { onStatusChanged: {
@ -349,6 +362,7 @@ Rectangle {
runningIndicator.visible = false runningIndicator.visible = false
// imageOverlay.visible = true // imageOverlay.visible = true
enlargeAnimation.start() enlargeAnimation.start()
} }
} }
@ -359,6 +373,23 @@ Rectangle {
from: 0 from: 0
to: imageOverlay.paintedWidth to: imageOverlay.paintedWidth
duration: 250 duration: 250
onRunningChanged: {
if (!enlargeAnimation.running) {
overlayBox.visible = true
overlayText.visible = true
console.log(imageOverlay.paintedWidth / imageOverlay.paintedHeight)
if (imageOverlay.paintedWidth / imageOverlay.paintedHeight <= 1.6) {
overlayBox.height = imageOverlay.paintedHeight * 0.03
} else {
overlayBox.height = imageOverlay.paintedHeight * 0.05
}
}
}
} }