qt6 standard alternative of Fastblur?

shokarta

Hello all,

in QT5 i was using Fastblur to blur the whole screen,
unfortunately not available anymore in QT6 and using Qt5Compat.GraphicalEffects is not the way we should approach for the whole lifetime of the applications...

Im not aware of any standard way which could do at least similar graphical effect.

So is there something we can use in qt6 without high effort of programming fastblur ourselves?
Hopefully there is some standard functionality which will allow us to use standard without loading additional libraries etc...

sierdzio

See this: https://www.qt.io/blog/in-depth-custom-shader-effects

JKSH

@sierdzio said in qt6 standard alternative of Fastblur?:

See this: https://www.qt.io/blog/in-depth-custom-shader-effects

...along with this: https://code.qt.io/cgit/qt/qt5compat.git/tree/src/imports/graphicaleffects5/shaders_ng/fastblur.frag?h=6.4.0

shokarta

ok, so what do i do wrong?

into the CMakeLists.txt I have added all lines masked as "added":

cmake_minimum_required(VERSION 3.16)
project(Inventory_qt6 VERSION 0.1 LANGUAGES CXX)

set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTOUIC ON)
set(CMAKE_AUTORCC ON)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
set(CMAKE_INCLUDE_CURRENT_DIR ON)

find_package(Qt6 COMPONENTS Quick REQUIRED)
find_package(Qt6 COMPONENTS Qml REQUIRED)
find_package(Qt6 COMPONENTS Gui REQUIRED)
find_package(Qt6 COMPONENTS Sql REQUIRED)
find_package(Qt6 COMPONENTS Core REQUIRED)
find_package(Qt6 COMPONENTS Network REQUIRED)
find_package(Qt6 COMPONENTS Concurrent REQUIRED)
find_package(Qt6 COMPONENTS Widgets REQUIRED)
find_package(Qt6 COMPONENTS ShaderTools REQUIRED)        // added

qt_add_executable(appInventory_qt6
    main.cpp
)

qt_add_qml_module(appInventory_qt6
    URI Inventory_qt6
    VERSION 1.0
    QML_FILES
        main.qml
        InitialScreen.qml
        ChoiseOffline.qml
        JavaScript.js

    RESOURCES
            images/connecting.gif
            images/clear.png
            images/clear_old.png
            images/flag_en.png
            images/flag_de.png
            images/flag_cs.png
            images/scan.png

            sounds/error.wav
            sounds/notification.wav
            sounds/ok.wav

            shaders/gaussianblur.frag        // added
)


set_target_properties(appInventory_qt6 PROPERTIES
    MACOSX_BUNDLE_GUI_IDENTIFIER my.example.com
    MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
    MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
    MACOSX_BUNDLE TRUE
    WIN32_EXECUTABLE TRUE
)

target_link_libraries(appInventory_qt6
    PRIVATE Qt6::Quick
    PRIVATE Qt6::Qml
    PRIVATE Qt6::Gui
    PRIVATE Qt6::Sql
    PRIVATE Qt6::Core
    PRIVATE Qt6::Network
    PRIVATE Qt6::Concurrent
    PRIVATE Qt6::Widgets
)

install(TARGETS appInventory_qt6
    BUNDLE DESTINATION .
    LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR})

// added all following
qt6_add_shaders(appInventory_qt6 "shaders"
    BATCHABLE
    PRECOMPILE
    OPTIMIZED
    PREFIX
        "/shaders"
    FILES
        "shaders/gaussianblur.frag"
)

then, in the project source directory i have created directory "shaders" and copied this file (just renamed to "gausianblur.frag" only to see if the ShaderEffects are working, then i would play with the frag file

and in my main.qml i have done this:

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtMultimedia

ApplicationWindow {
    id: mainWindow

    width: 480
    height: 800
    visible: true
    color: "white"

    // Views (initialy used SwipeView)
    StackLayout {
        id: view
        anchors.fill: parent
        currentIndex: 0

        //interactive: false            // SwipeView
        //orientation: Qt.Horizontal    // SwipeView
        //onCurrentIndexChanged: console.log(currentIndex)
        Item {
            id: view_InitialScreen
            InitialScreen {}
        }
        Item {
            id: view_ChoiseOffline
            ChoiseOffline {}
        }
    }

    // BLUR Effect
    ShaderEffect {
        property var src: mainWindow
        property int radius: 32
        property var pixelStep: Qt.vector2d(1 / src.width, 1 / src.height)
        anchors.fill: parent
        fragmentShader: "shaders/gaussianblur.frag.qsb"
    }
}

but upon compiling i see following note:

Failed to find shader ":/Inventory_qt6/shaders/gaussianblur.frag.qsb"
ShaderEffect: Failed to deserialize QShader from :/Inventory_qt6/shaders/gaussianblur.frag.qsb. Either the filename is incorrect, or it is not a valid .qsb file. In Qt 6 shaders must be preprocessed using the Qt Shader Tools infrastructure. The vertexShader and fragmentShader properties are now URLs that are expected to point to .qsb files generated by the qsb tool. See https://doc.qt.io/qt-6/qtshadertools-index.html for more information.
ShaderEffect: shader preparation failed for qrc:/Inventory_qt6/shaders/gaussianblur.frag.qsb

the file exists in project source directory, as well as after compiling in project build directory (copied into shaders/gaussianblur.frag and of course .qsb\gaussianblur.frag.qsb is created just fine)

shokarta

UPDATE:
so i have added shaders/gaussianblur.frag.qsb into the RESOURCES under qt_add_qml_module()

and after compiling i manualy copied this gaussianblur.frag.qsb from /.qsb/ folder into project source directory of /shaders/ and recompiled and there is no error, shader seems to load but unfortunately i see all screen fully black.

any hints?

UPDATE2:
from the Compile Output log:

11:16:03: Running steps for project Inventory_qt6...
11:16:03: Starting: "C:\Qt\Tools\CMake_64\bin\cmake.exe" --build C:/Qt/Projects/Builds/build-Inventory_qt6-Desktop_Qt_6_3_1_MinGW_64_bit-Debug --target all
[3/45 11.5/sec] Generating .qsb/shaders/gaussianblur.frag.qsb
Failed to run spirv-opt -O C:\Users\z659406\AppData\Local\Temp\qsb-fLmBbM\qsb_spv_temp -o C:\Users\z659406\AppData\Local\Temp\qsb-fLmBbM\qsb_spv_temp_out: Process failed to start: System can not find the file.
Failed to run fxc /nologo /E main /T ps_5_0 /Fo C:\Users\z659406\AppData\Local\Temp\qsb-lrgfgV\qsb_hlsl_temp_out C:\Users\z659406\AppData\Local\Temp\qsb-lrgfgV\qsb_hlsl_temp: Process failed to start: System can not find the file.
[20/45 46.3/sec] Generating Inventory_qt6/shaders/gaussianblur.frag
[21/45 48.6/sec] Generating Inventory_qt6/shaders/gaussianblur.frag.qsb
[27/45 22.7/sec] Running rcc for resource shaders
[36/45 16.5/sec] Building CXX object CMakeFiles/appInventory_qt6.dir/.rcc/qrc_shaders.cpp.obj
[45/45 6.1/sec] Linking CXX executable appInventory_qt6.exe
11:16:11: The process "C:\Qt\Tools\CMake_64\bin\cmake.exe" exited normally.
11:16:11: Elapsed time: 00:08.

and from General Messages:

Running C:\Qt\Tools\CMake_64\bin\cmake.exe -S C:/Qt/Projects/Sources/Inventory_qt6 -B C:/Qt/Projects/Builds/build-Inventory_qt6-Desktop_Qt_6_3_1_MinGW_64_bit-Debug "-DCMAKE_GENERATOR:STRING=Ninja" "-DCMAKE_BUILD_TYPE:STRING=Debug" "-DCMAKE_PROJECT_INCLUDE_BEFORE:FILEPATH=C:/Qt/Tools/QtCreator/share/qtcreator/package-manager/auto-setup.cmake" "-DQT_QMAKE_EXECUTABLE:FILEPATH=C:/Qt/6.3.1/mingw_64/bin/qmake.exe" "-DCMAKE_PREFIX_PATH:PATH=C:/Qt/6.3.1/mingw_64" "-DCMAKE_C_COMPILER:FILEPATH=C:/Qt/Tools/mingw1120_64/bin/gcc.exe" "-DCMAKE_CXX_COMPILER:FILEPATH=C:/Qt/Tools/mingw1120_64/bin/g++.exe" "-DCMAKE_CXX_FLAGS_INIT:STRING=-DQT_QML_DEBUG" in C:\Qt\Projects\Builds\build-Inventory_qt6-Desktop_Qt_6_3_1_MinGW_64_bit-Debug.
-- The CXX compiler identification is GNU 11.2.0
-- Detecting CXX compiler ABI info
-- Detecting CXX compiler ABI info - done
-- Check for working CXX compiler: C:/Qt/Tools/mingw1120_64/bin/g++.exe - skipped
-- Detecting CXX compile features
-- Detecting CXX compile features - done
-- Looking for C++ include pthread.h
-- Looking for C++ include pthread.h - found
-- Performing Test CMAKE_HAVE_LIBC_PTHREAD
-- Performing Test CMAKE_HAVE_LIBC_PTHREAD - Success
-- Found Threads: TRUE  
-- Performing Test HAVE_STDATOMIC
-- Performing Test HAVE_STDATOMIC - Success
-- Found WrapAtomic: TRUE  
-- Could NOT find WrapVulkanHeaders (missing: Vulkan_INCLUDE_DIR) 
-- Could NOT find WrapVulkanHeaders (missing: Vulkan_INCLUDE_DIR) 
-- Could NOT find WrapVulkanHeaders (missing: Vulkan_INCLUDE_DIR) 
shaders/gaussianblur.frag -> shaders/gaussianblur.frag.qsb exposed as :/shaders/shaders/gaussianblur.frag.qsb
shaders/gaussianblur.frag -> shaders/gaussianblur.frag.qsb exposed as :/shaders/shaders/gaussianblur.frag.qsb
-- Configuring done
-- Generating done
-- Build files have been written to: C:/Qt/Projects/Builds/build-Inventory_qt6-Desktop_Qt_6_3_1_MinGW_64_bit-Debug
Elapsed time: 00:07.

JKSH

@shokarta said in qt6 standard alternative of Fastblur?:

ok, so what do i do wrong?

I'm not sure. Try running and modifying the Shader Effects Example instead: https://doc.qt.io/qt-6/qtquick-shadereffects-example.html (search for "shader" in the Qt Creator Examples)