CodeLab - First Steps (Dragan Effect)

[ReMake]

This simple effect is based on the Method 2 of my tutorial Create the Dragan effect in Paint.NET.

 

Open and start CodeLab (Effects-> Advanced-> CodeLab). Choose New in the menu File. In a dialogue box Script Editor click a No button. The dialogue box New Source (Template) will be presented to you. In the drop-down list choose Sharpen. From the drop-down list Blend choose Overlay. Click the Generate Code button.

 

http://rubekon.ru/gallery/images/dragan1.png

 

We will get the following script of effect:

 

// Name:
// Submenu:
// Author:
// Title:
// Version:
// Desc:
// Keywords:
// URL:
// Help:
#region UICode
IntSliderControl Amount1=2; // [1,20] Amount
#endregion

// Setup for using Overlay blend op
private BinaryPixelOp overlayOp = LayerBlendModeUtil.CreateCompositionOp(LayerBlendMode.Overlay);

// Here is the main render loop function
void Render(Surface dst, Surface src, Rectangle rect)
{
    // Setup for calling the Sharpen effect
    SharpenEffect sharpenEffect = new SharpenEffect();
    PropertyCollection sharpenProps = sharpenEffect.CreatePropertyCollection();
    PropertyBasedEffectConfigToken SharpenParameters = new PropertyBasedEffectConfigToken(sharpenProps);
    SharpenParameters.SetPropertyValue(SharpenEffect.PropertyNames.Amount, Amount1);
    sharpenEffect.SetRenderInfo(SharpenParameters, new RenderArgs(dst), new RenderArgs(src));
    // Call the Sharpen function
    sharpenEffect.Render(new Rectangle[1] { rect }, 0, 1);

    // Now in the main render loop, the dst canvas has a sharpened version of the src canvas

    for (int y = rect.Top; y < rect.Bottom; y++)
    {
        if (IsCancelRequested) return;
        for (int x = rect.Left; x < rect.Right; x++)
        {
            ColorBgra CurrentPixel = dst[x,y];

            // TODO: Add additional pixel processing code here

            CurrentPixel = overlayOp.Apply(src[x,y], CurrentPixel);


            dst[x,y] = CurrentPixel;
        }
    }
}

In the line

SharpenParameters.SetPropertyValue(SharpenEffect.PropertyNames.Amount, Amount1);

replace Amount1 to 20.

 

In BoltBait's CodeLab Tutorial Part 3 - Complex find and copy a code of the Gaussian Blur effect. Paste this code before the line:

    for (int y = rect.Top; y < rect.Bottom; y++)

// Setup for calling Gaussian Blur
GaussianBlurEffect blurEffect = new GaussianBlurEffect();
PropertyCollection bProps = blurEffect.CreatePropertyCollection();
PropertyBasedEffectConfigToken bParameters = new PropertyBasedEffectConfigToken(bProps);
bParameters.SetPropertyValue(GaussianBlurEffect.PropertyNames.Radius, Amount1); // fix
blurEffect.SetRenderInfo(bParameters, new RenderArgs(dst), new RenderArgs(src));
// Call Gaussian Blur
blurEffect.Render(new Rectangle[1] {rect},0,1); 

 

In BoltBait's CodeLab Tutorial Part 3 - Complex find and copy the code of unary pixel operation and paste it below the line #endregion. Add a comment to this block of code:

// Setup for using pixel op
private UnaryPixelOps.Desaturate desaturateOp = new UnaryPixelOps.Desaturate();
private UnaryPixelOps.HueSaturationLightness saturationOp;
private UnaryPixelOps.Invert invertOp = new UnaryPixelOps.Invert();

 

Below this comment

// Setup for using Overlay blend op

add the Normal blending mode and correct a comment:

// Setup for using blending modes
private BinaryPixelOp overlayOp = LayerBlendModeUtil.CreateCompositionOp(LayerBlendMode.Overlay);
private BinaryPixelOp normalOp = LayerBlendModeUtil.CreateCompositionOp(LayerBlendMode.Normal);

 

Open the designer interface (File -> User Interface Designer). Rename the control name of Amount1 to Sharpen. Set value by default to 5, the minimum value to 1, maximum - to100 and click button Update. In the drop-down list Control Type select the Integer Slider. In the Control name box write Hue. Set value by default to 0, the minimum value to -20, maximum - to 20. Click the Add button, then click button Ok.

 

Now we need a code of High Pass effect. I restored it from the High Pass Single Slider effect by Cookies:

    for (int y = rect.Top; y < rect.Bottom; y++)
    {
        if (IsCancelRequested) return;
        for (int x = rect.Left; x < rect.Right; x++)
        {
            ColorBgra SrcPixel = src[x,y];
            SrcPixel = invertOp.Apply(SrcPixel);
            ColorBgra DstPixel = dst[x,y];
            DstPixel.A = Int32Util.ClampToByte((int)(DstPixel.A / 2));
            SrcPixel = normalOp.Apply(SrcPixel, DstPixel);
            SrcPixel = invertOp.Apply(SrcPixel);
            DstPixel = SrcPixel;
            ColorBgra MaxOpacPixel = SrcPixel;
            ColorBgra MinOpacPixel = SrcPixel;
            MaxOpacPixel.A = 255;
            MinOpacPixel.A = 75;
            SrcPixel = overlayOp.Apply(DstPixel, MaxOpacPixel);
            SrcPixel = overlayOp.Apply(SrcPixel, MinOpacPixel);
            SrcPixel.A = src[x,y].A;
            
            dst[x,y] = SrcPixel;
        }
    }

 Insert this code instead of the available cycles for y, for x.

 

Add a line

            SrcPixel = overlayOp.Apply(SrcPixel, src[x,y]);

 after this line SrcPixel.A = src[x,y].A;

 

We need function for adjustment of a hue. In BoltBait's CodeLab Tutorial Part 3 - Complex find and copy this code

// create a saturation operation based on a UI slider
saturationOp = new UnaryPixelOps.HueSaturationLightness(0, Amount1, 0); // fix
CurrentPixel = saturationOp(CurrentPixel);

and paste it before line dst[x,y] = SrcPixel;

 

Replace Amount1 on Amount2 * 2 + 100 and CurrentPixel on SrcPixel. It remains to add some information:

// Name: Dragan Effect
// Submenu: Photo
// Author: ReMake
// Title: Dragan Effect v1.0    ReMake 2016
// Version: 1.0
// Desc: Imitation of Dragan effect 
// Keywords: paint.net|dragan|effect
// URL: http://www.getpaint.net/redirect/plugins.html
// Help:

 

Our final script will look like this:

// Name: Dragan Effect
// Submenu: Photo
// Author: ReMake
// Title: Dragan Effect v1.0    ReMake 2016
// Version: 1.0
// Desc: Imitation of Dragan effect 
// Keywords: paint.net|dragan|effect
// URL: http://www.getpaint.net/redirect/plugins.html
// Help:
#region UICode
int Amount1 = 5; // [1,100] Sharpness
int Amount2 = 0; // [-20,20] Hue
#endregion

// Setup for using pixel op
private UnaryPixelOps.Invert invertOp = new UnaryPixelOps.Invert();
private UnaryPixelOps.Desaturate desaturateOp = new UnaryPixelOps.Desaturate();
private UserBlendOps.NormalBlendOp normalOp = new UserBlendOps.NormalBlendOp();

// Setup for using blending modes
private UserBlendOps.OverlayBlendOp overlayOp = new UserBlendOps.OverlayBlendOp();
private UnaryPixelOps.HueSaturationLightness saturationOp;

// Here is the main render loop function
void Render(Surface dst, Surface src, Rectangle rect)
{
    // Setup for calling the Sharpen effect
    SharpenEffect sharpenEffect = new SharpenEffect();
    PropertyCollection sharpenProps = sharpenEffect.CreatePropertyCollection();
    PropertyBasedEffectConfigToken sharpenParameters = new PropertyBasedEffectConfigToken(sharpenProps);
    sharpenParameters.SetPropertyValue(SharpenEffect.PropertyNames.Amount, 20);
    sharpenEffect.SetRenderInfo(sharpenParameters, new RenderArgs(dst), new RenderArgs(src));
    // Call the Sharpen function
    sharpenEffect.Render(new Rectangle[1] { rect }, 0, 1);
    // Now in the main render loop, the dst canvas has a sharpened version of the src canvas

    // Setup for calling Gaussian Blur
    GaussianBlurEffect blurEffect = new GaussianBlurEffect();
    PropertyCollection blurProps = blurEffect.CreatePropertyCollection();
    PropertyBasedEffectConfigToken BlurParameters = new PropertyBasedEffectConfigToken(blurProps);
    BlurParameters.SetPropertyValue(GaussianBlurEffect.PropertyNames.Radius, Amount1);
    blurEffect.SetRenderInfo(BlurParameters, new RenderArgs(dst), new RenderArgs(src));
    // Call Gaussian Blur
    blurEffect.Render(new Rectangle[1] {rect},0,1);
      
    for (int y = rect.Top; y < rect.Bottom; y++)
    {
        for (int x = rect.Left; x < rect.Right; x++)
        {
            ColorBgra SrcPixel = src[x,y];
            SrcPixel = invertOp.Apply(SrcPixel);
            ColorBgra DstPixel = dst[x,y];
            DstPixel.A = Int32Util.ClampToByte((int)(DstPixel.A / 2));
            SrcPixel = normalOp.Apply(SrcPixel, DstPixel);
            SrcPixel = invertOp.Apply(SrcPixel);
            DstPixel = SrcPixel;
            ColorBgra MaxOpacPixel = SrcPixel;
            ColorBgra MinOpacPixel = SrcPixel;
            MaxOpacPixel.A = 255;
            MinOpacPixel.A = 75;
            SrcPixel = overlayOp.Apply(DstPixel, MaxOpacPixel);
            SrcPixel = overlayOp.Apply(SrcPixel, MinOpacPixel);
            SrcPixel.A = src[x,y].A;
            SrcPixel = overlayOp.Apply(SrcPixel, src[x,y]);

            // create a saturation operation based on a UI slider
            saturationOp = new UnaryPixelOps.HueSaturationLightness(0, Amount2*2+100, 0);
            SrcPixel = saturationOp.Apply(SrcPixel);

            dst[x,y] = SrcPixel;
        }
    }
}

Save this code with name DraganEffect (File -> Save or keys Ctrl+S). Create for our effect appropriate icon as a 16 x 16 pixel PNG file, for example like this: http://rubekon.ru/gallery/images/draganeffect.png.

 

Now let's save our effect as a DLL file: File-> Save as DLL... Almost all information is in the dialog box, which presented to you. Click the Select icon link and select the icon. Click the Build button - your new effect is ready!

The user interface of our new effect looks like this.

http://rubekon.ru/gallery/images/dragan2.png

 

The results of the effect, see in the Create the Dragan effect in Paint.NET tutorial  and in the Dragan Effect topic.

[Ego Eram Reputo]

Nice job ReMake!

To add a Plugin Browser preview image...,

Create a new PNG image 200*150 pixels in size.

Use the Dragan effect above to fill the image with an example of the effect.

Save the image to the same directory as your CodeLab source, naming the image DraganEffect.sample.PNG (the first part of the name needs to be the same as your CodeLab source file).

Recompile the effect.

 

 

[Sakana Oji]

It keeps saying "Exception has been thrown by the target of an invocation." HOW DO YOU FIX THIS?! I NEED TO KNOW!

[Pixey]

@Sakana Oji I'm wondering if you have ever read The Rules for the forum?  They can be found here.

 

Especially this one:

 

3) DO NOT SHOUT. We can hear you just fine. Using all capitals is often interpreted as rude, so please don't.

[Sakana Oji]

1 hour ago, Pixey said:

DO NOT SHOUT. We can hear you just fine. Using all capitals is often interpreted as rude, so please don't.

 

That wasn't really helpful, and besides, you used caps too, no offense. I just want to know how to fix my CodeLab error. Oh, and sorry.

[Pixey]

1 minute ago, Sakana Oji said:

 

That wasn't really helpful, and besides, you used caps too, no offense. I just want to know how to fix my CodeLab error. Oh, and sorry.

 

No @Sakana Oji I did not use caps!  If you'd read the Rules you would have seen that @Rick Brewster did that in his screed.

[toe_head2001]

42 minutes ago, Sakana Oji said:

I just want to know how to fix my CodeLab error.

 

We can't help you fix the issue by just seeing the Error message. Please post the code you're using in CodeLab. You must have gone wrong somewhere, as the code from ReMake works fine.

[Sakana Oji]

2 hours ago, Pixey said:

 

No @Sakana Oji I did not use caps!  If you'd read the Rules you would have seen that @Rick Brewster did that in his screed.

I knew that. Still sorry.