Preview images by double-clicking them
This commit is contained in:
		
					parent
					
						
							
								74e3208549
							
						
					
				
			
			
				commit
				
					
						29bcd516d7
					
				
			
		
					 1 changed files with 40 additions and 21 deletions
				
			
		| 
						 | 
				
			
			@ -116,7 +116,7 @@ Rectangle {
 | 
			
		|||
 | 
			
		||||
                        onDoubleClicked: {
 | 
			
		||||
                            // TODO: This needs to download the medium-size image (sample_url)
 | 
			
		||||
                            largeShow.imageDoubleClicked(sampleUrl)
 | 
			
		||||
                            imageOverlay.imageDoubleClicked(sampleUrl)
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
                        }
 | 
			
		||||
| 
						 | 
				
			
			@ -275,78 +275,97 @@ Rectangle {
 | 
			
		|||
 | 
			
		||||
        signal imageDoubleClicked( url url)
 | 
			
		||||
 | 
			
		||||
        id: largeShow
 | 
			
		||||
        id: imageOverlay
 | 
			
		||||
        smooth: true
 | 
			
		||||
        fillMode: QPixmapItem.PreserveAspectFit
 | 
			
		||||
        height: rootObj.width
 | 
			
		||||
        width: rootObj.height
 | 
			
		||||
        height: rootObj.height * 0.9
 | 
			
		||||
        width: rootObj.width * 0.9
 | 
			
		||||
        anchors.horizontalCenter: parent.horizontalCenter
 | 
			
		||||
        anchors.verticalCenter: parent.verticalCenter
 | 
			
		||||
        visible: false
 | 
			
		||||
        visible: width > 0
 | 
			
		||||
        z: 1
 | 
			
		||||
 | 
			
		||||
        Button {
 | 
			
		||||
            id: closeButton
 | 
			
		||||
            anchors.top: parent.top
 | 
			
		||||
            anchors.right: largeShow.right
 | 
			
		||||
            anchors.right: imageOverlay.right
 | 
			
		||||
            height: parent.paintedHeight * 0.05
 | 
			
		||||
            width: parent.paintedWidth * 0.05
 | 
			
		||||
            width: parent.paintedHeight * 0.05
 | 
			
		||||
            anchors.topMargin: (parent.height - parent.paintedHeight) / 2
 | 
			
		||||
            anchors.leftMargin: (parent.width - parent.paintedWidth) / 2
 | 
			
		||||
            iconName: "window-close"
 | 
			
		||||
            visible: width > 0
 | 
			
		||||
            visible: false
 | 
			
		||||
            z: 2
 | 
			
		||||
 | 
			
		||||
            onClicked: {
 | 
			
		||||
                closeButton.visible = false
 | 
			
		||||
//                 shrinkAnimation.start()
 | 
			
		||||
                largeShow.visible = false
 | 
			
		||||
                imageOverlay.visible = false
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        Rectangle {
 | 
			
		||||
 | 
			
		||||
            id: overlayBox
 | 
			
		||||
            color:"black"
 | 
			
		||||
 | 
			
		||||
            anchors.bottom: parent.bottom
 | 
			
		||||
            anchors.left: parent.left
 | 
			
		||||
            anchors.bottomMargin: (parent.height - parent.paintedHeight) / 2
 | 
			
		||||
            anchors.leftMargin: (parent.width - parent.paintedWidth) / 2
 | 
			
		||||
            width: imageOverlay.paintedWidth
 | 
			
		||||
            height: imageOverlay.paintedHeight * 0.03
 | 
			
		||||
            opacity: 0.8
 | 
			
		||||
 | 
			
		||||
            Text {
 | 
			
		||||
                id: overlayText
 | 
			
		||||
                anchors.fill: parent
 | 
			
		||||
                text: "" // FIXME
 | 
			
		||||
                color: "white"
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        onImageDoubleClicked: {
 | 
			
		||||
 | 
			
		||||
            largeShow.visible = true
 | 
			
		||||
            largeShow.source = url
 | 
			
		||||
            imageOverlay.visible = true
 | 
			
		||||
            imageOverlay.source = url
 | 
			
		||||
            closeButton.visible = true
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        onStatusChanged: {
 | 
			
		||||
 | 
			
		||||
            if (largeShow.status == Image.Loading) {
 | 
			
		||||
            if (imageOverlay.status == Image.Loading) {
 | 
			
		||||
                runningIndicator.visible = true
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            if (largeShow.status == Image.Ready) {
 | 
			
		||||
            if (imageOverlay.status == Image.Ready) {
 | 
			
		||||
                runningIndicator.visible = false
 | 
			
		||||
                largeShow.visible = true
 | 
			
		||||
//                 imageOverlay.visible = true
 | 
			
		||||
                enlargeAnimation.start()
 | 
			
		||||
                console.log(largeShow.width)
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        PropertyAnimation {
 | 
			
		||||
            id: enlargeAnimation
 | 
			
		||||
            target: largeShow
 | 
			
		||||
            target: imageOverlay
 | 
			
		||||
            properties: "width"
 | 
			
		||||
            from: 0
 | 
			
		||||
            to: largeShow.paintedWidth
 | 
			
		||||
            to: imageOverlay.paintedWidth
 | 
			
		||||
            duration: 250
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        PropertyAnimation {
 | 
			
		||||
            id: shrinkAnimation
 | 
			
		||||
            target: largeShow
 | 
			
		||||
            target: imageOverlay
 | 
			
		||||
            properties: "width"
 | 
			
		||||
            from: largeShow.paintedWidth
 | 
			
		||||
            from: imageOverlay.paintedWidth
 | 
			
		||||
            to: 0
 | 
			
		||||
            duration: 250
 | 
			
		||||
            onRunningChanged: {
 | 
			
		||||
                if (!shrinkAnimation.running) {
 | 
			
		||||
//                     largeShow.source = ""
 | 
			
		||||
                    largeShow.visible = false
 | 
			
		||||
                    imageOverlay.visible = false
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue