ShaderMask widget and Attributes

The ShaderMask widget in Flutter is used to apply a shader-based mask to its child, creating various visual effects such as gradients, patterns, or custom effects. It's a powerful widget for adding complex visual effects to UI components.

Attributes:

1. blendMode (BlendMode):

   • The blend mode used to combine the shader and the child. Options include BlendMode.srcIn, BlendMode.srcOut, BlendMode.dstIn, etc.

2. shaderCallback (ShaderCallback):

   • A callback function that returns a Shader object defining the shader to be applied. It receives the size of the child widget as an argument.

3. child (Widget):

   • The child widget to which the shader mask is applied.

Example:

import 'package:flutter/material.dart';

class CustomShaderMask extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('ShaderMask Example'),
      ),
      body: Center(
        child: ShaderMask(
          blendMode: BlendMode.srcIn,
          shaderCallback: (Rect bounds) {
            return LinearGradient(
              colors: [Colors.red, Colors.blue],
            ).createShader(bounds);
          },
          child: Image.asset(
            'assets/flutter_logo.png',
            width: 200,
            height: 200,
          ),
        ),
      ),
    );
  }
}

void main() {
  runApp(
    MaterialApp(
      home: CustomShaderMask(),
    ),
  );
}

In this example, a ShaderMask is used to apply a gradient mask to an Image widget. The blendMode is set to BlendMode.srcIn, and the shaderCallback creates a linear gradient shader. This creates a visual effect where the image is masked with a gradient, resulting in a colorful overlay. The ShaderMask widget allows you to experiment with various shaders and blend modes to achieve unique visual effects in your Flutter app.