feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

Doc: Add info about using TBS shaders

Browse Source 
Task-number: QDS-14608
Change-Id: I44165930b8fbc5d48df83848131cd593046fc540
Reviewed-by: Mats Honkamaa <mats.honkamaa@qt.io>
This commit is contained in:
Johanna Vanhatapio
2025-02-04 18:37:44 +02:00
parent ee7caf30b6
commit c6848e2e1e
1 changed files with 26 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
doc/qtdesignstudio/src/views/qtquick-effect-maker-view.qdoc
View File

@@ -147,16 +147,23 @@
node, such as BlurHelper or NoiseHelper. node, such as BlurHelper or NoiseHelper.
\endtable \endtable
\section1 Using shaders from Shadertoy \section1 Using shaders from external sources
Copy shaders as code from \l{https://www.shadertoy.com/}{Shadertoy} and use them as a part of your You can use shader code from external sources, such as \l{https://www.shadertoy.com/}{Shadertoy}
effect composition. and l{https://thebookofshaders.com}{The Book of Shaders} to create custom effects that you
can use as a part of your effect composition. For some sources, such as
\e {The Book of Shaders}, you may have to re-name the uniforms to use them in the \QDS
\uicontrol {Effect Composer}. For more information, see
\l {Working with Shadercode in Effect Composer}.
\section2 Using shaders from Shadertoy
First, add a \l{Using a custom effect in an effect composition}{custom effect} to your effect First, add a \l{Using a custom effect in an effect composition}{custom effect} to your effect
composition. Then, copy the shader code and paste it to \uicontrol {Shaders Code Editor}: composition. Then, copy the shader code and paste it to the \uicontrol {Fragment Shader}
tab of \uicontrol {Shaders Code Editor} with some adjustments:
\list 1 \list 1
\li Copy the functions of the shader and paste them to before the \c {@main} tag. \li Copy the functions of the shader and paste them above the \c {@main} tag.
\li Copy the code inside \c {mainImage} and paste it after the \c {@main} tag, inside {}. \li Copy the code inside \c {mainImage} and paste it below the \c {@main} tag, inside {}.
\endlist \endlist
\uicontrol {Effect Composer} doesn't support all the features of Shadertoy: \uicontrol {Effect Composer} doesn't support all the features of Shadertoy:
@@ -178,6 +185,19 @@
\c {fragCoord = vec2(qt_Vertex.x, iResolution.y - qt_Vertex.y)}. You may need to adjust \c {fragCoord = vec2(qt_Vertex.x, iResolution.y - qt_Vertex.y)}. You may need to adjust
\c texCoord in a similar manner. \c texCoord in a similar manner.
\section2 Using shaders from The Book of Shaders
First, add a \l{Using a custom effect in an effect composition}{custom effect} to your effect
composition. Then, copy the shader code and paste it to the \uicontrol {Fragment Shader}
tab of \uicontrol {Shaders Code Editor} with some adjustments:
\list 1
\li Copy the functions of the shader and paste them above the \c {@main} tag.
\li Copy the code inside \c {void main} and paste it below the \c {@main} tag, inside {}.
\li Edit the uniforms of the original shader code in \uicontrol {Shaders Code Editor} as
described in \l {External resources}{Working with Shadercode in Effect Composer}.
For more information, see \l{Using a shader from The Book of Shaders in Effect Composer}.
\section1 Assigning an effect composition to a component \section1 Assigning an effect composition to a component
To assign your newly created effect composition to a component, do one of the following: To assign your newly created effect composition to a component, do one of the following: