Learn what Felgo offers to help your business succeed. Start your free evaluation today! Felgo for Your Business

Qt World Summit Conference App

 import Felgo 4.0
 import QtQuick 2.0

 Rectangle {
   id: speakerImg
   width: webImg.implicitWidth
   height: webImg.implicitHeight

   color: Theme.backgroundColor
   border.color: Theme.secondaryTextColor
   border.width: dp(1)
   radius: width * 0.5

   readonly property bool loaded: webImg.img.status === Image.Ready
   readonly property bool loading: webImg.loading

   property bool activatePictureViewer: false

   property alias img: webImg
   property alias defaultImg: defaultImg
   property alias source: webImg.actualSource
   property real padding: dp(6)

   Component.onCompleted: {
     // custom fix for KDAB image
     if(webImg.source.toString().indexOf("KDAB_logo.png") > 0) {
       webImg.fillMode = Image.PreserveAspectFit
     }
   }

   RoundedImage {
     id: defaultImg
     anchors.fill: webImg
     radius: webImg.radius
     img.defaultSource: Qt.resolvedUrl("../../assets/icon_engineer.png")
     img.asynchronous: true
     visible: !webImg.visible
   }

   RoundedImage {
     id: webImg
     width: parent.width - padding
     height: parent.width - padding
     anchors.centerIn: parent
     radius: parent.radius / parent.width * width
     source: actualSource
     visible: img.status === Image.Ready
     img.asynchronous: true
     img.sourceSize.width: 100
     img.sourceSize.height: 100

     fillMode: Image.PreserveAspectCrop

     property string actualSource: ""
     property bool loading: false

     // handle loading status for image
     Connections {
       target: webImg.img
       onStatusChanged: {
         if(webImg.img.status === Image.Loading && !webImg.loading)
           webImg.loading = true
         else if(webImg.img.status !== Image.Loading && webImg.loading)
           webImg.loading = false
       }
     }

     // reload image be resetting source property
     function reload() {
       webImg.source = ""
       webImg.source = Qt.binding(function() { return actualSource })
     }
   }

   // allow image reload on clicking if failed before, or call picture viewer
   MouseArea {
     enabled: (webImg.img.status !== Image.Ready && webImg.img.status !== Image.Loading) || activatePictureViewer
     anchors.fill: parent
     onClicked: {
       if(webImg.img.status !== Image.Ready && webImg.img.status !== Image.Loading)
         webImg.reload()
       else
         PictureViewer.show(getApplication(), webImg.source, false)
     }
   }

   // auto-reload image when device is online again
   Connections {
     target: webImg.img.status !== Image.Ready ? getApplication() : null
Qt_Technology_Partner_RGB_475 Qt_Service_Partner_RGB_475_padded