Magick.NET - Fade to transparent

[Bert]

Hello

I'm currently writing a C# application which should print (wordwrapped) text over a predefined height and width where the extreme edges should fade into transparency.

I am using the latest C# MagickImage package (AnyCpu, Q8, 7.5.0) at the time of writing.

These parameters are provided (shortened to the ones needed for this question):

PointY (int)
MaxHeight (int)
FadeHeight (int)

Now let's say PointY is zero, MaxHeight is 100 and FadeHeight is 120.

What this means is that the text should be shown up until 120 pixels down, while height 100 to 120 should fade from completely visible to completely transparent.

Here is some ASCII representation of my goal (the blabla parts that are losing letters ==> more transparent)

Code: Select all

       PointY ._____________________
           ^  |blablablablablablabla|
MaxHeight  |  |blablablablablablabla|
           |  |blablablablablablabla|
           v  |blablablablablablabla|
           ^  |blabl blabl blabl bla|
FadeHeight |  |b abl b abl b abl b a|
           |  |b   l   a   b   l   a|
           v  |_____________________|

I have read here that the best way to do this is to apply a mask to the 'text item' so the correct part fades into transparency.

I have tried some code, but I have no idea how to translate this into valid Magick.NET code and I think I'm going about it all wrong.

Code: Select all

using (var image = new MagickImage(MagickColor.FromRgb(0, 159, 227), 320, 240))
{
    text = "caption:This is a very long test string aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"

    using (var completeMask = new MagickImage(MagickColors.Black, 100, 120))
    {
        using (var maskTransparent = new MagickImage($"gradient:black-white", 100, 20))
            completeMask.Composite(maskTransparent, 0, 100);       

        using (var mText = new MagickImage(MagickColors.Transparent, 100, 120))
        {
            mText.Read(text);

            mText.Composite(completeMask, 0, 0 CompositeOperator.Dissolve, "100");
            image.Composite(mText, 0, 0, CompositeOperator.Dissolve, "100");
        }
    }
}

Any help would be greatly appreciated.

[dlemstra]

What is the exact command that you are trying to translate?

[Bert]

No idea, I've been trying to 'translate' the command used for overlapping photos here:

https://www.imagemagick.org/Usage/photos/#overlap

I'm trying to combine a caption 'text-box' and an empty, transparent image with a masking image so that the text at the predefined edges start to fade into nothing (because of the transparent image being combined with it).

[Bert]

I've managed to solve it, I had to set the masking color to the font color instead of black, and the font color to white.

My mask was also a gradient from black to white, and it should be from the color you want the font to be to transparent (none).