Perform 'Transparency Vignette' in Flutter-CodePudding

The

Any idea how should I modify the code below? Or is it even the same thing at all?? I am sorry but I really badly need this.

Thanks a lot

Note: The code below is from the Image library https://github.com/brendan-duncan/image

Image vignette(Image src, {num start = 0.3, num end = 0.75, num amount = 0.8}) { final h = src.height - 1; final w = src.width - 1; final num invAmt = 1.0 - amount; final p = src.getBytes(); for (var y = 0, i = 0; y <= h; y) { final num dy = 0.5 - (y / h); for (var x = 0; x <= w; x, i = 4) { final num dx = 0.5 - (x / w); num d = sqrt(dx * dx dy * dy); d = _smoothStep(end, start, d); p[i] = clamp255((amount * p[i] * d invAmt * p[i]).toInt()); p[i 1] = clamp255((amount * p[i 1] * d invAmt * p[i 1]).toInt()); p[i 2] = clamp255((amount * p[i 2] * d invAmt * p[i 2]).toInt()); } } return src; } num _smoothStep(num edge0, num edge1, num x) { x = ((x - edge0) / (edge1 - edge0)); if (x < 0.0) { x = 0.0; } if (x > 1.0) { x = 1.0; } return x * x * (3.0 - 2.0 * x); }

CodePudding user response：

Given that you want "transparency", you need the alpha channel. The code you provide seems to only have 3 bytes per pixel, so only RGB, without alpha channel.

A solution may be:

Modify the code such that it has alpha channel, i.e. 4 bytes per pixel.

Instead of modifying the RGB to make it darker, i.e. p[i] = ..., p[i 1] = ..., p[i 2] = ..., leave RGB unchanged, and modifying the alpha channel to make alpha smaller. For example, say, p[i 3]=... (suppose you are RGBA format instead of ARGB).

CodePudding user response：

Here you go - the widgetless approach based on my previous answer:

Canvas(PictureRecorder()).drawImage( your_image, //here is the image you want to change Offset.zero,// the offset from the corner of the canvas Paint() ..shader = const RadialGradient( radius: needed_radius, // the radius of the result gradient - it should depend on the image dimens colors: [Colors.black, Colors.transparent], ).createShader( Rect.fromLTRB(0, 0, your_image_width, your_image_height), // the portion of your image that should be influenced by the shader - in this case, I use the whole image. ) ..blendMode = BlendMode.dstIn); // for the black color of the gradient to be masking one

I will add it to the previous answer, also