Color Dodge blending

XverhelstX

Well-Known Member
Licensed User
Longtime User
Hey everyone,

I just released my latest library called RSImageProcessing that let's you do a lot of things with Bitmaps like inverting, grayscaling, blurring, etc.

Now i want to follow this pseudo-code on how to convert photo-to-sketch images:

[Done] s = Read-File-Into-Image("/path/to/image")
[Done] g = Convert-To-Gray-Scale(s)
[Done] i = Invert-Colors(g)
[Done] b = Apply-Gaussian-Blur(i)
[Unfinished] result = Color-Dodge-Blend-Merge(b,g)

All the [Done]-methods could be done with my library, the only thing i can't seem to find/make is the color dodge blending.

Does anyone have an idea, source code (B4A / Java (Android then java.awt is not supported by Android!) on how to do this?

Here are some links:
My Technical Scratch Pad.: How I wrote [java]code to give Pencil Sketch effect to a picture

Blend modes - Wikipedia, the free encyclopedia

Thanks,
Tomas
 

XverhelstX

Well-Known Member
Licensed User
Longtime User
Woot, I found it :eek:

I checked how photoshop did it with their calculations and converted the colordodge to Java.
Finally I can do a Photo-to-sketch. :D

Here's the Java code if someone can improve (not nec, but works slow with large images.)
B4X:
private int colordodge(int in1, int in2) {
      float image = (float)in2;
       float mask = (float)in1;
       return ((int) ((image == 255) ? image:Math.min(255, (((long)mask << 8 ) / (255 - image)))));

   }
   
   /**
    * Blends 2 bitmaps to one and adds the color dodge blend mode to it.
    */
   public Bitmap ColorDodgeBlend(Bitmap source, Bitmap layer) {
       Bitmap base = source.copy(Config.ARGB_8888, true);
       Bitmap blend = layer.copy(Config.ARGB_8888, false);

       IntBuffer buffBase = IntBuffer.allocate(base.getWidth() * base.getHeight());
       base.copyPixelsToBuffer(buffBase);
       buffBase.rewind();

       IntBuffer buffBlend = IntBuffer.allocate(blend.getWidth() * blend.getHeight());
       blend.copyPixelsToBuffer(buffBlend);
       buffBlend.rewind();

       IntBuffer buffOut = IntBuffer.allocate(base.getWidth() * base.getHeight());
       buffOut.rewind();

       while (buffOut.position() < buffOut.limit()) {
           int filterInt = buffBlend.get();
           int srcInt = buffBase.get();

           int redValueFilter = Color.red(filterInt);
           int greenValueFilter = Color.green(filterInt);
           int blueValueFilter = Color.blue(filterInt);

           int redValueSrc = Color.red(srcInt);
           int greenValueSrc = Color.green(srcInt);
           int blueValueSrc = Color.blue(srcInt);

           int redValueFinal = colordodge(redValueFilter, redValueSrc);
           int greenValueFinal = colordodge(greenValueFilter, greenValueSrc);
           int blueValueFinal = colordodge(blueValueFilter, blueValueSrc);

           int pixel = Color.argb(255, redValueFinal, greenValueFinal, blueValueFinal);

           buffOut.put(pixel);
       }

       buffOut.rewind();

       base.copyPixelsFromBuffer(buffOut);
       blend.recycle();

       return base;
   }

c++ - How does photoshop blend two images together? - Stack Overflow

All possible with my new library:

s = Read-File-Into-Image("/path/to/image")
g = Convert-To-Gray-Scale(s)
i = Invert-Colors(g)
b = Apply-Gaussian-Blur(i)
result = Color-Dodge-Blend-Merge(b,g)

=

B4X:
Sub mnuGrayscale_Click
   btmpGrayScale = sketch.GreyScale(btmpFlower)
   ImageView1.Bitmap = btmpGrayScale
   ToastMessageShow("Done grayscaling.",False)
End Sub

Sub mnuInvert_Click
   btmpInvert = sketch.Invert(btmpGrayScale)
   ImageView1.Bitmap = btmpInvert
   ToastMessageShow("Done inverting.",False)
End Sub

Sub mnuBlur_Click
   btmpBlur = sketch.Blur(btmpInvert,16,0)
   ImageView1.Bitmap = btmpBlur
   ToastMessageShow("Done blurring.",False)
End Sub

Sub mnuBlend_Click
   btmpBlend = sketch.ColorDodgeBlend(btmpBlur, btmpGrayScale)
   ImageView1.Bitmap = btmpBlend
   ToastMessageShow("Done blending.",False)
End Sub

Result looks like this:
tajmahal_sketch.png
 
Upvote 0

vb1992

Well-Known Member
Licensed User
Longtime User
I got close to that... picture above

I also got lost (dizzy) setting all the different
parameters of each, one change of one effect
does something to the overall other effect,
reminds me of mixing music....

but let me see if I
can find a stable decent result,
and upload a sample project.
 
Upvote 0

vb1992

Well-Known Member
Licensed User
Longtime User
B4X:
btmpEngrave = IO.Engrave(ImageView1.Bitmap )
   ImageView1.Bitmap = btmpEngrave

   'btmpEngrave = IO.Blur(ImageView1.Bitmap,11,11 )
   'ImageView1.Bitmap = btmpEngrave
 
   btmpEngrave = IO.Brightness(ImageView1.Bitmap,200 )
   ImageView1.Bitmap = btmpEngrave

   btmpEngrave = IO.Contrast(ImageView1.Bitmap,.92 )
   ImageView1.Bitmap = btmpEngrave
 
Upvote 0
Top