Nominate our 2022 Qt Champions!

Partially transparent image

  • Hi all,

    I need an image to be partially transparent in Qt.Quick (i.e. just a quarter of a certain jpg/png image) and I'm looking through the documentation but can't really find anything useful. Is this at all possible in any way? Maybe some sort of 'void' Window or similar?
    I need it for background image which should be transparent partially (let's say lower left corner - 2-dimensional cropping anyway) if a user goes to a certain menu, otherwise it should be normal without transparent parts. Of course I can crop it manually, but that really isn't very good for my application - different screen resolutions would require me to crop the images independently for each resolution and configuration, which really makes no sense to do.

    If someone knows, please share. Thanks in advance!

  • Moderators

    @jimmy274 Perhaps you should try OpacityMask from Graphical Effects.

  • @p3c0 Hey thanks, it wasn't a perfect fit, but you've pointed me in the right direction (Graphical Effects) - ThresholdMask is what I needed. It's also not a completely perfect fit, but then again, I'm still experimenting with it.

    Either way, thanks big time, really cool pointer!

  • Moderators

    @jimmy274 You're Welcome :)
    A more interesting way but through C++ would be to use QQuickPaintedItem to create your own custom item. You can re-implement paint method to draw your custom shapes, text etc.. It uses QPainter to achieve this. Try looking for setCompositionMode and setClipRegion methods. An example for QQuickPaintedItem is here.