3

In Qt5 this was easy with using DropShadow.
But in Qt6 the module QtGraphicalEffects is removed.

Is there any trick, workaround or maybe new way in Qt6 to create drop shadow around some component?

user123445151156
  • 331
  • 2
  • 10
  • 1
    Well, it's definitely not easy, but you can still write your own [ShaderEffects](https://doc.qt.io/qt-6/qml-qtquick-shadereffect.html) in Qt6. I'm pretty sure QtGraphicalEffects will come back in later releases, but for now you have to do it yourself. – JarMan Feb 10 '21 at 21:26
  • 1
    Or you could do it with translucent images. – JarMan Feb 10 '21 at 21:27
  • yea it looks like that is the way. I will try your suggestion and add it as answer if it works. Thank you – user123445151156 Feb 10 '21 at 21:29
  • @user123445151156 can you please post example usage of ShaderEffects if you succeed creating Shadow? – peco Feb 11 '21 at 11:36

3 Answers3

6

As you noticed yourself, Qt Graphical Effects is removed (definitely):

The following modules are removed and not planned to be developed further.

  • Qt Graphical Effects
  • [...]

However, the Qt Graphical Effects is made compatible with the new QRhi (Qt Rendering Hardware Interface) used by Qt6. [1]

Note that this doesn't mean it will be included in Qt 6 at a later stage. [2]

Nevertheless, I expect it would be relatively easy to use DropShadow from the dev or Qt 5.15 branch of git.

Note that it will be included as a Qt5 Compatibility API in Qt6.1. (Final release of Qt 6.1 is originally planned for 27.04.2021 [3])

m7913d
  • 10,244
  • 7
  • 28
  • 56
2

Qt6 DropShadow

import Qt5Compat.GraphicalEffects
DropShadow {}
Alexander Dyagilev
  • 1,139
  • 1
  • 15
  • 43
2

You can add QtGraphicalEffects module to Qt6 manually and then use DropShadow in your code.

Generally, to unofficially employ QtGraphicalEffects in Qt 6, do the following:

$ git clone git://code.qt.io/qt/qtgraphicaleffects.git
$ cd qtgraphicaleffects/
$ git checkout 59ab3e11433a5157aac0f3af7c0d7fe70a373373 & cd ..
$ ~/Qt/<VERSION>/gcc_64/bin/qmake qtgraphicaleffects
$ make
$ find qtgraphicaleffects/src/effects/ -maxdepth 1 -name \*.qml -exec cp {} qml/QtGraphicalEffects \;
$ cp -r qtgraphicaleffects/src/effects/private/ qml/QtGraphicalEffects
$ cp -r qml/QtGraphicalEffects ~/Qt/<VERSION>/gcc_64/qml/

This will obtain the module source code to the point where it wasn't yet completely removed from the repository. Then it is built and copied with the required files to the Qt installed directory.

So to use DropShadow component, add

import QtGraphicalEffects 1.0

You can also use the following components in your QML code:

  • BrightnessContrast
  • Colorize
  • ColorOverlay
  • ConicalGradient
  • Desaturate
  • Displace
  • DropShadow
  • FastBlur
  • FastGlow
  • GammaAdjust
  • Glow
  • HueSaturation
  • LevelAdjust
  • LinearGradient
  • OpacityMask
  • RadialGradient
  • RectangularGlow
  • ThresholdMask
AmirMohammad Biuki
  • 25
  • 7