Image inside a Rectangle ignores radius

_Mark_

Hello,
I have a very simple question: I want to put an Iage inside a Rectangle. Something like this:

@
Rectangle {
width: 800
height: 600
radius: 20

Image {
    source: "path/to/file.png"
    anchors.fill: parent
    fillMode: Image.PreserveAspectCrop
}

}
@

The problem is the image ignores the rectangle's radius! Hence, it extends over the corners.
How to draw the images really "inside" the rectangle, so the corners are reduced according?

Thanks!
Mark

JapieKrekel

See "QTBUG-9008":https://bugreports.qt-project.org/browse/QTBUG-9008

It is as designed.

It is not handy, but what I do is make an image for the rounded rectangle with the corners having the color of the background, and use it in a border-image so I can stretch it without distorting it. I make that lay on top of my content of the rounded rect .
@
Item {
width: 800
height: 600
Image {
source: "path/to/file.png"
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
}

// last so it is on top (or use the z: )
BorderImage {
    source: "roundedrect.png"
    anchors.fill: parent
    border {left: 25; top: 25; right: 25; bottom: 25}
}

}
@

_Mark_

What a pity! QML is so powerful I'm astonished it cannot mask an image. I know the docs says for "performance" reasons, but let the choice to the user!

Anyway I can't use your solution, unfortunately. I need to generate on-the-fly (at runtime) the mask. The application searches for any image in a folder and put each one in a rounded rectangle with different sizes and colors.

I found this:

http://qt-project.org/forums/viewthread/7037

I removed the import Qt.labs.shaders 1.0 and changed ShaderEffectItem in ShaderEffect - still no chance.
I got the following error:

@QQuickShaderEffect: 'qt_ModelViewProjectionMatrix' does not have a matching property!
@

I searched for any documentation but I found nothing. Do you have any idea about?

JapieKrekel

Ah sorry to here that.

I have no knowledge of GLSL. So hopefully someone else can help you with that.

skol

@_Mark_ qWarning("ShaderEffect: qt_ModelViewProjectionMatrix is deprecated. Use qt_Matrix instead.");