⚠️ Forum Maintenance: Feb 6th, 8am - 14pm (UTC+2)

Blur effect for Rectangle

  • Hi guys... I need to put a blur affect to a rectangle qml object. I saw the example about FastBlur effect, but it's work only for images... my code look like this and it's doesn't work:

    id: root
    color: "transparent"
    border.width: 2
    border.color: "black"
    radius: 18

        id: rectSection
        width: parent.width - parent.border.width * 2
        x: parent.border.width
        height: parent.height - parent.border.width * 2
        y: parent.border.width
        color: "#070707"
        anchors.top: parent.top
        anchors.topMargin: parent.border.width
        opacity: 0.4
        radius: 16
        id: blur
        anchors.fill: root
        radius: 8
        source: rectSection


    how can I adda blur effect to a rectangle qml object ??

    best regards


  • Moderators

    Check out the console output. Are there any errors? I think it is wrong to mix anchoring and fixed coords in a Rectangle (rectSection). So maybe your rectangle is not being drawn at all.

  • Thanks sierdzio

    well, my real problem y that I have my movie application, and I have a rectangle which apear sometimes... when my rectangle appear, this rectangle has a 0.7 of opacity, and I need the blur affect only under the part which is under my rectangle...

    how can I do that ??? that is my real problem !!!

    because the rectangle can be in any place over my application, so, I can't have an exactly component as source....

    any idea about how can I do that ??


  • Moderators

    [quote author="freddy311082" date="1399480977"]because the rectangle can be in any place over my application, so, I can't have an exactly component as source....[/quote]

    That has nothing to do with the blur effect, it still needs to be applied over your semi-transparent rectangle. Best option is to make it fill it's parent. And if you need to place it in an arbitrary place, then do that with the base Rectangle, not with the blur.

    In any case, please check the console log. I am almost certain the QML engine is printing some errors because you are mixing anchors and fixed coordinates. In that case, don't be surprised it does not work ;-)

Log in to reply