How to use textures as input?

[MindStudioOfficial]

Hi, I am trying to use these shaders for image processing. I've read in the flutter documentation that sampler2D is a valid uniform as an input to the shader. However I cannot find a way to generate that uniform in dart since it is not just a double. Is there a specific type for that exposed in the API?

[felixblaschke]

I haven't tried it myself, but from documentation you should be able to pass List<ImageShader> into the shader(...) of the FragmentProgram. See: https://api.flutter.dev/flutter/dart-ui/FragmentProgram/shader.html

And ImageShader can be created from an Image, which should be straight forward: https://api.flutter.dev/flutter/dart-ui/ImageShader-class.html

If you are successful, it would be cool to report back your experience or a minimalist example (e.g. link to Git repo).

[MindStudioOfficial]

Thats exactly what I could not find. Thanks a lot. I will report back soon.

[MindStudioOfficial]

I've done it! Thanks a lot. Feel free to use any of this as an example in your project:

https://github.com/MindStudioOfficial/texshader_test

[felixblaschke]

Well done! Now we can also use RepaintBoundary to post-process the rendered ui 😄
See: https://api.flutter.dev/flutter/rendering/RenderRepaintBoundary/toImage.html

[MindStudioOfficial]

Oh wow, I didn't even think of that.

But then you would need to overlay the processed image of the ui on top of the ui. Do gestures and such still work behind the ShaderPainter?

[felixblaschke]

Yes you can place AbsorbPointer (https://api.flutter.dev/flutter/widgets/AbsorbPointer-class.html) where you like.