Portage des effets Shadertoy vers l'outil de création d'effets d'Qt Quick

Vous pouvez utiliser les effets créés dans Shadertoy dans l'Effect Maker d'Qt Quick. Lorsque vous utilisez des effets Shadertoy, tenez compte des points suivants :

• Qt Quick Effect Maker ne prend pas en charge les fonctionnalités suivantes de Shadertoy :
  • Effets multipasses (onglets « Buffer »)
  • Audio
  • Cartes cubiques
  • textures 3D
• Shadertoy ne prend en charge que les shaders de fragment et les textures intégrées. Pour améliorer les performances des effets dans Qt Quick Effect Maker, déplacez certains calculs vers le shader de sommet et utilisez des images personnalisées afin de simplifier le code du shader.
• Le système de coordonnées diffère entre Shadertoy et l'Effect Maker d'Qt Quick. Dans Shadertoy, l'origine (0,0) se trouve dans le coin inférieur gauche, tandis que dans l'Effect Maker d'Qt Quick, elle se trouve dans le coin supérieur gauche.

Utilisation d'un effet Shadertoy dans l'Effect Maker d'Qt Quick

Pour utiliser un effet Shadertoy dans Effect Maker d’ Qt Quick:

1. Dans l’Effect Maker d’ Qt Quick, créez un nouvel effet.
2. Dans l'éditeur de nœuds, sélectionnez « Add node », puis, sous « Common », sélectionnez « Custom ». Cela crée un nœud vide.

   

3. Dans Shadertoy, copiez tout le code de l'onglet « Image ».
4. Dans Qt Quick Effect Maker, double-cliquez sur le nœud « Custom » dans l'éditeur de nœuds. L'éditeur de code s'ouvre.
5. Collez le code Shadertoy dans l’onglet « Frag ».
6. Recherchez la fonction « Main » dans le code ; elle ressemble à ceci :

   void mainImage( out vec4 fragColor, in vec2 fragCoord )

7. Remplacez cette ligne par :

   @main

   Remarque : vous ne pouvez pas avoir « @main » et le { qui suit sur la même ligne.

8. Facultatif. Si l'effet dépend du système de coordonnées, il apparaît à l'envers. Pour résoudre ce problème, vous devez inverser la coordonnée y :
   1. Accédez à l'onglet « Vert ».

      

   2. Dans le menu déroulant, sélectionnez « Main ».
   3. Recherchez la ligne « fragCoord » ; elle devrait ressembler à ceci :

      fragCoord = qt_Vertex.xy;

   4. Remplacez cette ligne par :

      fragCoord = vec2(qt_Vertex.x, iResolution.y - qt_Vertex.y);

   5. De la même manière, vous devrez peut-être modifier les valeurs de « texCoord » et « iMouse ».

Désormais, l'effet s'exécute et ressemble à celui de Shadertoy.