Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Blur image (dynamic source)
Forum Updated to NodeBB v4.3 + New Features

Blur image (dynamic source)

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
effectimage
3 Posts 3 Posters 1.0k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • H Offline
    H Offline
    helenebro
    wrote on 10 Feb 2016, 08:50 last edited by
    #1

    Hi,
    I want display an image on Item and blur it.
    I have tried this :

    Item {
        property bool isReduc: true
        property variant value
        width: 400
        height: 500
        Image {
               id: image_bug
               anchors.fill: parent
               source: value ? value.image : "qrc:/image/Ressources/defaultImage.png";
           }
    
           FastBlur{
               id: blur
               anchors.fill: image_bug
               source: image_bug
               radius: 100
           }
    }
    

    I have a "black image".

    • If I don't force image size (comment "anchors.fill:parent), it works but my image isn't the right size
    • If I set "static" source (source: "qrc:/image/Ressources/defaultImage.png";), it works
      But I can't have an image 400x500 blurred
    1 Reply Last reply
    0
    • S Offline
      S Offline
      Sam_George
      wrote on 8 Apr 2020, 15:10 last edited by
      #2

      Hi,
      @helenebro did you get any way to do it?

      1 Reply Last reply
      0
      • M Offline
        M Offline
        Markkyboy
        wrote on 9 Apr 2020, 01:26 last edited by Markkyboy 4 Sept 2020, 01:36
        #3

        Despite this question being 4 years old, I'll answer it anyway.

        @helenebro - your formatting is likely causing your issue as you have nested 'FastBlur' inside 'Image' preventing the effect from showing. After formatting and a little adjustment to your code, I came up with the following. I hope I understand you correctly. When I first tried your code, I also got a black 'rectangle'.

        import QtQuick 2.12
        import QtQuick.Window 2.12
        import QtGraphicalEffects 1.0
        
        Window {
            visible: true
            width: 640
            height: 580
            title: qsTr("Image_bug")
        
            Item {
                width: 200
                height: 300
        
                Image {
                    id: image_bug
                    width: 400; height: 500
                    source: "image_bug.jpg"
                }
        
                FastBlur{
                    id: blur
                    anchors.fill: image_bug
                    source: image_bug
                    radius: 50
                }
            }
        }
        

        image_bug_blurred.JPG

        @Sam_George - does this help you at all?, please let me know either way, thanks.

        Don't just sit there standing around, pick up a shovel and sweep up!

        I live by the sea, not in it.

        1 Reply Last reply
        1

        • Login

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved