如何在 Flutter 中用图像屏蔽文本？

Question

Hello does anyone know how i can mask a text and photo in flutter? I already have my image with text on the screen. For example: my text would be Lion and my photo of these lions are behind it. How can i make a mask like you can in photoshop?

See this photo for example:

Answer 1

I'm not sure this answers your question. It's a simple version of text masking but instead of masking an image this MIN REPRO EXAMPLE shows masking gradient colors:

 ShaderMask(
                        shaderCallback: (bounds) => RadialGradient(
                          colors: [
                            Colors.red,
                            Colors.green,
                          ],
                        ).createShader(bounds),
                        child: const Text('exclusive'),
                      ),

Unfortunately, as of writing ShaderMask is not supported yet for web online for iOS/Android. Check out more here: https://github.com/flutter/flutter/issues/44152

You may find these answers useful (just again they may not be supported on web yet I don't know about other solutions):

• Is there a way to show image inside text in flutter
• texture (image) on text in flutter