Welcome to the Java Programming Forums


The professional, friendly Java community. 21,500 members and growing!


The Java Programming Forums are a community of Java programmers from all around the World. Our members have a wide range of skills and they all have one thing in common: A passion to learn and code Java. We invite beginner Java programmers right through to Java professionals to post here and share your knowledge. Become a part of the community, help others, expand your knowledge of Java and enjoy talking with like minded people. Registration is quick and best of all free. We look forward to meeting you.


>> REGISTER NOW TO START POSTING


Members have full access to the forums. Advertisements are removed for registered users.

Results 1 to 9 of 9

Thread: Image processing tutorial

  1. #1
    Forum VIP
    Join Date
    Jun 2011
    Posts
    317
    My Mood
    Bored
    Thanks
    47
    Thanked 89 Times in 74 Posts
    Blog Entries
    4

    Default Image processing tutorial

    Introduction
    Hi, my name is Chris and I love to program. I was inspired to write this tutorial because Java is an excellent language for manipulating images yet the information on how do so is scattered and incomplete. Basically, I would like to share the critical code and concepts involved in simple image processing and the code for an application to view the results. I will be using a BufferedImage of TYPE_INT_ARGB exclusively and the javax.imageio package to read and write to a PNG file.


    The outcomes

    Original Image
    image.jpg

    Pixelatation
    image-pixelate2.jpg

    Flip/Mirror
    image-flip.jpg

    Greyscale
    image-greyscale.jpg

    Color Invert
    image-invert.jpg

    Noise
    image-nosie.jpg


    The theory
    As I mentioned above, we will be using a TYPE_INT_ARGB BufferedImage to store the image in memory. Every pixel in the image is represented by one 32bit integer with 8bits of information for each of the alpha, red, green and blue channels (RGB). We will not be using the alpha channel in this tutorial but just be aware that it is there. Now I am certain that you have already come across RGB before in HTML or image editors so I will keep this brief. The primary colors of red, green and blue can be added together to create a broad spectrum of colors. With 8bits we can specify a range of values in decimal 0..255 or in hexadecimal 0x00..0xFF. In binary it looks like this:

    0000 0000   0000 0000   0000 0000    0000 0000
    alpha       red         green        blue

    Let's say we want to look at just the red value. To extract this value we will need to remove the other channels and shift the bits so they are sitting on their own. For the red channel this is achieved by shifting the bits 24 places to the right and then performing a logical AND on the rightmost 8bits:

    int px = img.getRGB(x, y);
    int alpha = (px >> 24) & 0xFF;
    int red = (px >> 16) & 0xFF;
    int green = (px >> 8) & 0xFF;
    int blue = px & 0xFF;

    We can reassemble the pixel from the constitute channels by shifting the bits back to place and adding them together.
    int pixel = (alpha<<24) + (red<<16) + (green<<8) + blue;

    These two code snippets allow us to alter and analyse the color of a pixel. What about the entire image I hear you ask. Well we simply use a nested for loop to iterate over every pixel as though it were a 2D array of size [WIDTH][HEIGHT].

    for (int x = 0; x < img.getWidth(); x++) {
    	for (int y = 0; y < img.getHeight(); y++) {
    		int px = img.getRGB(x, y);
    	        //do something with the pixel
                    img.setRGB(x, y, px);
            }
    }


    The transformation algorithms
    Greyscale is the easiest of the color transformations so we will start there. All we do is set each color to the average of all three. Advanced programs like Gimp or Photoshop will do a weighted average on the values since this technique generally produces a dark image.
    //average of RGB
    int avg = (red + blue + green) / 3;
     
    //set R, G & B with avg color
    int grey = (alpha<<24) + (avg<<16) + (avg<<8) + avg;

    Flip/Mirror is the only positional transformation I will cover. This time we set the pixel in the destination image to the opposite location it came from.
    //Flip vertical and horizontal
    for (int x = 0; x < img.getWidth(); x++) {
    	for (int y = 0; y < img.getHeight(); y++) {
    		int px = img.getRGB(x, y);
    		int destX = img.getWidth() - x - 1;
    		int destY = img.getHeight() - y - 1;
     
                    destImage.setRGB(destX, destY, px);			
    	}
    }

    Pixelation involves a more complicated iteration method. Instead of incrementing our nested loops by 1, we increment it by the size of the desired pixelation block size and inside the loop we have another two nested loops. One which iterates over the block size averaging the value of the pixel and another which sets every pixel in the block to the average.
    for (int x = 0; x < img.getWidth(); x+=size) {
    	for (int y = 0; y < img.getHeight(); y+=size) {
     
    		int px = 0;
     
    		for (int xi = 0; xi < size; xi++) {
    			for (int yi = 0; yi < size; yi++) {
    				px += img.getRGB(x, y);
    				px = px / 2;  //not a true average but it's close
    			}
    		}
     
    		for (int xi = 0; xi < size; xi++) {
    			for (int yi = 0; yi < size; yi++) {
    				dest.setRGB(x+xi, y+yi, px);
    			}
    		}
    	}
    }

    The application
    This is taking longer that I thought it would so it's time to finish up. These four source files will allow you to quickly load an image from the command line, transform it, view the results and save them to file.

    Main.java
    import java.io.File;
    import java.io.IOException;
    import java.io.FileNotFoundException;
     
     
    public class Main
    {
      	/**
    	* Entry point
    	*/
    	public static void main(String[] args) {
     
     
    		try {
    			final String filename = args[0];
    			final File imageFile = new File(filename);
     
    			//Start the JFrame
    			java.awt.EventQueue.invokeLater(new Runnable() {
    				public void run() {
    					new ImageJFrame(imageFile);
    				}
    			});
     
     
    		} catch (ArrayIndexOutOfBoundsException e) {
    			System.err.println("Usage: java -jar ImageProcessor.jar <filename>");
    			System.exit(-1);
    		}
     
    	}
    }

    ImageJFrame.java
    import javax.swing.JFrame;
    import java.io.File;
     
     
    public class ImageJFrame extends JFrame
    {
    	public ImageJPanel panel;
     
    	/**
    	 *  Constructor
    	 * 
    	 *  Sets up a JFrame which contains an image
    	 */
    	public ImageJFrame(File imageFile) {
    		super("Image processing frame");
     
    		panel = new ImageJPanel(imageFile);  
     
    		getContentPane().add(panel);
    		setSize(panel.getWidth(), panel.getHeight());
            setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    		setResizable(false);
    		setVisible(true);
    	}
    }

    ImageJPanel
    import java.awt.Graphics;
    import java.awt.Graphics2D;
    import java.awt.image.BufferedImage;
    import javax.swing.JPanel;
    import java.io.File;
    import java.io.IOException;
    import javax.imageio.*;
     
    public class ImageJPanel extends JPanel {
     
    	public BufferedImage image;
     
    	public int getWidth() {
    		return image.getWidth();	
    	}
     
    	public int getHeight() {
    		return image.getHeight();
    	}
     
    	public void paintComponent(Graphics g)
        {
            super.paintComponent(g);
            g.drawImage(image, 0, 0, null);  //draws the image
        }
     
    	public void loadImage(File imageFile) {
    		try {
    			image = ImageIO.read(imageFile);
    		} catch (IOException ex) {
    			String directory = new File(".").getAbsolutePath();
    			System.err.println("Could not open " + imageFile.getAbsolutePath() + " at " + directory);
    			System.exit(-1);
    		}	
    	}
     
    	public void saveToFile(String filename) {
            try {
                // Save as PNG
                String fn = filename + ".png";
                File file = new File(fn);
                ImageIO.write(image, "png", file);
            } catch (IOException e) {}
        }
     
     
    	public ImageJPanel(File imageFile) {
    		loadImage(imageFile);
    		image = Transformations.flipVertical(image);		
    		String filename = imageFile.getAbsolutePath() + "1";
    		saveToFile(filename);
     
    	}
    }

    You can see the call to the transformation here in the ImageJPanel constructor. The final file Transformations.java has a set of public static methods which accepts a BufferedImage as a parameter and returns a new BufferedImage. This will allow you to chain together different transformations and try out new ones with little fuss.


    Transformations.java
    import java.awt.image.BufferedImage;
    import java.util.Random;
     
     
    public class Transformations
    {
     
     
    	public static BufferedImage noise(BufferedImage img, int quantity, int threshold) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		//good values are
    		//quantity = 10;
    		//threshold = 50;
     
    		Random r = new Random();
     
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
    				int ran = r.nextInt(quantity);
    				if (ran <= 1) {
     
    					int amount = r.nextInt(threshold);
    					int red = ((px >> 16) & 0xFF) + amount;
     
    					amount = r.nextInt(threshold);
    					int green = ((px >> 8) & 0xFF) + amount;	
     
    					amount = r.nextInt(threshold);			
    					int blue = (px & 0xFF) + amount;
     
    					//Overflow fix
    					if (red > 255) { red = 255; }
    					if (green > 255) { green = 255; }
    					if (blue > 255) { blue = 255; }
     
    					px = (0xFF<<24) + (red<<16) + (green<<8) + blue;
    				}
     
    				dest.setRGB(x, y, px);
    			}
    		}
     
    		return dest;
    	}
     
     
     
     
     
     
    	public static BufferedImage pixelate(BufferedImage img, int size) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		for (int x = 0; x < img.getWidth(); x+=size) {
    			for (int y = 0; y < img.getHeight(); y+=size) {
     
    				int px = 0;
     
    				for (int xi = 0; xi < size; xi++) {
    					for (int yi = 0; yi < size; yi++) {
    						px += img.getRGB(x, y);
    						px = px / 2;
    					}
    				}
     
    				for (int xi = 0; xi < size; xi++) {
    					for (int yi = 0; yi < size; yi++) {
    						dest.setRGB(x+xi, y+yi, px);
    					}
    				}
    			}
    		}
     
    		return dest;
    	}
     
     
     
     
     
    	public static BufferedImage histogramThreshold(BufferedImage img, int threshold) {
     
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		int reds[] = new int[256];
    		int greens[] = new int[256];
    		int blues[] = new int[256];
     
     
    		//Count the occurance of each pixel's red, green and blue
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
     
    				int red = ((px >> 16) & 0xFF);
    				reds[red]++;
     
    				int green = ((px >> 8) & 0xFF);
    				greens[green]++;
     
    				int blue = (px & 0xFF);
    				blues[blue]++;
     
    				dest.setRGB(x, y, px);
    			}
    		}
     
    		//Analyse the results
    		int mostCommonRed = 0;
    		int mostCommonBlue = 0;
    		int mostCommonGreen = 0;
     
    		for (int i = 0; i < 256; i++) {
    			if (reds[i] > mostCommonRed) {
    				mostCommonRed = i;
    			}
     
    			if (blues[i] > mostCommonBlue) {
    				mostCommonBlue = i;
    			}
     
    			if (greens[i] > mostCommonGreen) {
    				mostCommonGreen = i;
    			}
    		}
     
    		//Set the destination to pixels that are in a range +/- threshold from mostCommon value
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
    				int red = ((px >> 16) & 0xFF);
    				int green = ((px >> 8) & 0xFF);				
    				int blue = (px & 0xFF);
    				int val = 0;
     
     
    				if (((red - 20 < mostCommonRed) && (red + threshold > mostCommonRed)) || ((blue - threshold < mostCommonBlue) && (blue + threshold > mostCommonBlue)) || ((green - threshold < mostCommonGreen) && (green + threshold > mostCommonGreen))) {
    					val = (0xFF<<24) + (red<<16) + (green<<8) + blue;
    				} else {
    					val = (0xFF<<24) + (0xFF<<16) + (0xFF<<8) + 0xFF;
    				}
     
     
    				dest.setRGB(x, y, val);
    			}
    		}
     
    		return dest;
    	}
     
     
     
    	public static BufferedImage invert(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
    				//Subtracting the channels value from 0xFF effectively inverts it
    				int red = 0xFF - ((px >> 16) & 0xFF);
    				int green = 0xFF - ((px >> 8) & 0xFF);
    				int blue = 0xFF - (px & 0xFF);
     
    				int inverted = (0xFF<<24) + (red<<16) + (green<<8) + blue;
    				dest.setRGB(x, y, inverted);
    			}
    		}
     
    		return dest;
    	}
     
     
     
    	public static BufferedImage greyScale(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
     
    				int px = img.getRGB(x, y);
     
    				int alpha = (px >> 24) & 0xFF;
    				int red = (px >> 16) & 0xFF;
    				int green = (px >> 8) & 0xFF;
    				int blue = px & 0xFF;
     
    				//average of RGB
    				int avg = (red + blue + green) / 3;
     
    				//set R, G & B with avg color
    				int grey = (alpha<<24) + (avg<<16) + (avg<<8) + avg;
     
    				dest.setRGB(x, y, grey);
    			}
    		}
     
    		return dest;
    	}
     
     
    	public static BufferedImage burn(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
    				int burn = px << 8; //this was a lucky guess. not sure why it works
     
    				dest.setRGB(x, y, burn);
    			}
    		}
     
    		return dest;
    	}
     
     
    	public static BufferedImage gaussianFilter(BufferedImage img) {
    		int cuttoff = 2000;
    		double magic = 1.442695;
    		int xcenter = img.getWidth() / 2 - 1;
    		int ycenter = img.getHeight() / 2 - 1;
     
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
     
    				double distance = Math.sqrt(x*x+y*y);
    				double value = px*255*Math.exp((-1*distance*distance)/(magic*cuttoff*cuttoff));
    				dest.setRGB(x, y, (int) value);	
     
    			}
    		}
     
    		return dest;
     
    	}
     
     
    	public static BufferedImage flipVerticalHorizontal(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		//Flip vertical and horizontal
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
    				int destX = img.getWidth() - x - 1;
    				int destY = img.getHeight() - y - 1;
    				dest.setRGB(destX, destY, px);			
    			}
    		}
     
    		return dest;
    	}
     
     
     
    	public static BufferedImage flipVertical(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		//Flip vertical and horizontal
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
    				dest.setRGB(x, img.getHeight() - y - 1, px);			
    			}
    		}
     
    		return dest;
    	}
     
     
    	public static BufferedImage flipHorizontal(BufferedImage img) {
    		BufferedImage dest = new BufferedImage(img.getWidth(), img.getHeight(), BufferedImage.TYPE_INT_ARGB);
     
    		//Flip horizontal
    		for (int x = 0; x < img.getWidth(); x++) {
    			for (int y = 0; y < img.getHeight(); y++) {
    				int px = img.getRGB(x, y);
    				dest.setRGB(img.getWidth() - x - 1, y, px);			
    			}
    		}
     
    		return dest;
    	}
     
    }


    Well I hope you enjoyed the tutorial (it was the first one I have written). Please feel free to write your own transformation and post them for all to enjoy.

    Regards,

    Chris
    Attached Images Attached Images

  2. The Following 8 Users Say Thank You to ChristopherLowe For This Useful Post:

    andreasdr (April 7th, 2013), copeg (June 18th, 2011), DataMaN (February 25th, 2014), doritos (July 11th, 2012), JavaPF (June 18th, 2011), Norm (June 18th, 2011), ondedark (May 24th, 2012), votienkhoanghau (September 18th, 2013)


  3. #2
    mmm.. coffee JavaPF's Avatar
    Join Date
    May 2008
    Location
    United Kingdom
    Posts
    3,336
    My Mood
    Mellow
    Thanks
    258
    Thanked 294 Times in 227 Posts
    Blog Entries
    4

    Default Re: Image processing tutorial

    Great tutorial Chris! I have promoted this thread to an Article

    Java Programming Articles - Image Processing Tutorial
    Please use [highlight=Java] code [/highlight] tags when posting your code.
    Forum Tip: Add to peoples reputation by clicking the button on their useful posts.

  4. The Following User Says Thank You to JavaPF For This Useful Post:

    devanshu89 (December 22nd, 2011)

  5. #3
    Junior Member
    Join Date
    Jul 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    thanks a lot for your great tutorial, I know noise detection is an important concept in image processing. but how your noise Function works?
    can you help me to go deep in this concept?

    Regards
    Marjan

  6. #4
    Junior Member
    Join Date
    Apr 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    Firstly, I want to thank you for writing this tutorial about image processing...

    But when I try to run the main class, the output prints the error message from the ArrayIndexOutOfBoundsException which is

    Usage: java -jar ImageProcessor.jar <filename>
    Java Result: -1


    Can you tell me why it happened?

    Regards,
    Yordan

  7. #5
    Junior Member
    Join Date
    Aug 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    Hope you have got the answer.. Still if not..

    in Main.java, replace following line:

    final String filename = args[0];

    by:

    final String filename = "some-image-file-path";

  8. #6
    Junior Member
    Join Date
    Oct 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    hi. i am beginer and like to work image prosseccing ? can you help me please?

  9. #7
    Junior Member
    Join Date
    Nov 2013
    Posts
    21
    My Mood
    Confused
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    gaussianFilter part not working,Images not blurred how to display images with gaussianFilter??? anybody help please

  10. #8
    Forum VIP
    Join Date
    Jun 2011
    Posts
    317
    My Mood
    Bored
    Thanks
    47
    Thanked 89 Times in 74 Posts
    Blog Entries
    4

    Default Re: Image processing tutorial

    Quote Originally Posted by Mumpy Zinu View Post
    gaussianFilter part not working,Images not blurred how to display images with gaussianFilter??? anybody help please
    Been a while but it looks like what I wrote was a Guassian edge detection, not a Gaussian blur. There is a guassian blur implementation here you can look at.

  11. #9
    Junior Member
    Join Date
    Oct 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: Image processing tutorial

    hi Chris
    thanks a lot for your great tutorial.
    best regards

Similar Threads

  1. Image Processing
    By subash in forum File I/O & Other I/O Streams
    Replies: 4
    Last Post: June 8th, 2011, 08:40 AM
  2. Replies: 2
    Last Post: February 14th, 2011, 05:36 PM
  3. Signal processing API.
    By ivanloes in forum Java Theory & Questions
    Replies: 4
    Last Post: December 18th, 2010, 05:56 PM
  4. token-based processing
    By amandat in forum What's Wrong With My Code?
    Replies: 0
    Last Post: October 21st, 2010, 12:05 AM
  5. ERROR WHILE PROCESSING JSF FILE
    By Pankaj in forum JavaServer Pages: JSP & JSTL
    Replies: 3
    Last Post: July 10th, 2010, 12:42 AM