I need to Implement shader mask in flutter to the image

0

I am trying to implement the ShaderMask to only the background image in the container below with color Color(0xFFFF0000) and transparency 29% but I am not able to do so, the below code I have implemented it is masking all the elements of the container, but I want only the background image in the below code to be masked, please guide me how should I do that?

ShaderMask
 ( shaderCallback: (rect){
                  return LinearGradient(

                      begin: Alignment.center,
                      end: Alignment.center,
                      colors: [

                        Colors.transparent,
                        Color(0xFFFF0000),

                      ]
                  ).createShader(Rect.fromLTRB(0, 0, rect.width, rect.height));

                },
                blendMode: BlendMode.color,
             child: Container(
                     width: MediaQuery.of(context).size.width,
              height: MediaQuery.of(context).size.height,
              decoration: new BoxDecoration(
                image: DecorationImage(
                  image: AssetImage('images/background.jpg',),
                  fit: BoxFit.cover,
    ),

              )
                     child:Container()
                    )
)
flutter
dart
image-masking
flutter-image
asked on Stack Overflow Aug 31, 2020 by Jimmy Anderson

1 Answer

-1

You can use Stack widget. Then on top of that your background container. On top of that your own widget.

answered on Stack Overflow Aug 31, 2020 by Rajesh

User contributions licensed under CC BY-SA 3.0