Resizing a rotated BufferedImage

Question

Hi everybody,
I am currently developing a graphical figure editor. Users can drop several 'objects' on a JPanel.
These objects are represented on screen by BufferedImages. The objects are resizable, rotatable
and movable.
Rotating is implemented using AffineTransform. This works fine.
However, imagine one of the objects that has been rotated 90 degrees. Its north face will be facing east in
the viewport. When a user resizes the object by grabbing the east-side (i.e. the north handle before rotation)
resize-handle and dragging it to the east it is essentially resizing the object in a northwise direction.
This means that the height of the object is increased and that its origin (top left point) is decreased. However,
this will be drawn on screen exactly as stated: the height is increased and the origin is decreased and afterwards
the image is rotated. All this results in an object with the correct size, but drawn at the wrong location (I draw the
BufferedImage at the origin-point which was just decreased).
Might be a long and akward story, so here I will post a small example application which illustrates the behaviour
of my program. The program shows a BufferedImage. On this image a rectangle is drawn, along with an ellipse that
indicates the north face of the rectangle. Pressing 'R' results in a rotation of 90 degrees, whereas pressing any
of the four arrow-keys results in a 5-pixel increase in size. Just pressing R once and then an arrow key will
illustrate my problem.
My question is simple: how should I go about resizing (not rescaling, I really want to increase the
number of paintable pixels for my BufferedImage!) a BufferedImage that's been rotated using AffineTransform.
Any suggestions are greatly appreciated!
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Point;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.awt.image.BufferedImage;
import javax.swing.JFrame;
import javax.swing.JPanel;
* Creates a BufferedImage that displays a simple image.
* This Image will can be rotated 1/2 PI degrees by pressing 'R'.
* By pressing any of the arrow-keys, the image is resized as if stretching
* the top of the image. (i.e. in the original, non-rotated, image it
* simply moves the origin of the image and increases the height).
public class ImageTest extends JPanel implements KeyListener
   double theta = 0.0; // rotation angle
   Point origin = new Point(50,50); // origin of the image
   Dimension size = new Dimension(100,100); // size of the image
   public static void main(String[] args)
      JFrame mainFrame = new JFrame("Image Tester");
      ImageTest imageTest = new ImageTest();
      mainFrame.getContentPane().add(imageTest);
      mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      mainFrame.setSize(400,400);
      mainFrame.show();
      mainFrame.addKeyListener(imageTest);
   // draw the image on the JPanel
   public void paintComponent(Graphics g)
      super.paintComponent(g);
      // create a BufferedImage and draw something on it (a rectangle)
      BufferedImage image =
         new BufferedImage(size.width, size.height, BufferedImage.TYPE_INT_ARGB);
      Graphics g2 = image.createGraphics();
      g2.drawRect(0, 0, size.width - 1, size.height - 1);
      g2.fillOval(size.width / 2, 0, 3, 3); // draw a little 'north' indicator
      g2.dispose();
      // now rotate g
      Graphics2D g2d = (Graphics2D)g;
      g2d.rotate(theta,
                 origin.x + size.width / 2.0,
                 origin.y + size.height / 2.0);
      // and draw the image on the specified origin
      g2d.drawImage(image, origin.x, origin.y, null);
    * @see java.awt.event.KeyListener#keyPressed(java.awt.event.KeyEvent)
   public void keyPressed(KeyEvent arg0)
      switch(arg0.getKeyCode())
         case (KeyEvent.VK_R):
            // rotate! add 1 / 2 PI degrees of rotation
            theta += Math.PI / 2;
            repaint();
            break;
         case (KeyEvent.VK_LEFT):
         case (KeyEvent.VK_RIGHT):
         case (KeyEvent.VK_DOWN):
         case (KeyEvent.VK_UP):
            // make the image 5 pixels larger
            origin.y = origin.y - 5;
            size.height += 5;
            repaint();
            break;
    * @see java.awt.event.KeyListener#keyReleased(java.awt.event.KeyEvent)
   public void keyReleased(KeyEvent arg0)
    * @see java.awt.event.KeyListener#keyTyped(java.awt.event.KeyEvent)
   public void keyTyped(KeyEvent arg0)
}

Answer 1

Thanks Olek for your suggestion.
I took your advice (kind-of) and tried something.
Now I create a BufferedImage on which I draw a rectangle. The resulting Image is transformed to a rotated version of
this image. To do so, a new BufferedImage is created based on an AffineTransformOp.
This resulting (rotated) image is then shown on screen.
However, it still does not work correctly.
I have to state that this is a very simplified version of my problem. The original program features 8 resize handles, along with one rotation handle above
the object. When no rotation has been applied everything works fine (i.e. the object can be resized using the handles). However, if someone uses
the rotation handle to rotate the object 90 degrees (for example), resizing does no longer work correctly.
This sample program that I provided intends to mimic the case in which a user is stretching a rectangle to the north (without rotation) and to the
east (with 90 degrees of rotation). As you can see, if you press the UP-arrow if the object is not rotated, it does exactly what it needs to do:
stretch to the north (i.e. update the origin and increase the height). If you press R once and then try the UP-arrow again, you see that it still does what it needs to do. However, since I update the origin, the BufferedImage is moving up.
This all is very logical and the program does exactly what I ask it to do. However, it is not what I want it to do and I do not know how to implement what I really want.
Maybe someone can sketch some solution to this problem:
1 - Display a buffered image of size 30 x 30 (with some north-indicator)
2 - Stretch this image to the north a few pixels
3 - Rotate the buffered image 90 degrees clockwise around its center (north indicator is pointing east)
4 - Stretch this image to the east a few pixels (which, I think, corresponds to the operation in 2, but it clearly does not!)
This might be the little kick I need to set me off in the right direction again. I think I might have been thinking about this too long to see the solution
myself.
Listed here is my own updated version of the sample I provided in my first post. Clockwise rotation is still key R, counter clockwise rotation is E,
stretching the image to the north is UP-arrow and decreasing the image from the north is down (i.e. up and down mimic the case in which a user uses
the northern resize-handle to resize the image; in case of rotation this northern resize-handle is obviously displayed east or whatever).
Any help is appreciated as always!
package test;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Point;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.awt.geom.AffineTransform;
import java.awt.image.AffineTransformOp;
import java.awt.image.BufferedImage;
import javax.swing.JFrame;
import javax.swing.JPanel;
* Creates a BufferedImage that displays a simple image.
* This Image will can be rotated 1/2 PI degrees by pressing 'R'.
* By pressing any of the arrow-keys, the image is resized as if stretching
* the top of the image. (i.e. in the original, non-rotated, image it
* simply moves the origin of the image and increases the height).
public class ImageTest extends JPanel implements KeyListener
   double theta = 0.0; // rotation angle
   Point origin = new Point(50,50); // origin of the image drawing
   Dimension size = new Dimension(100,100); // size of the image
   public static void main(String[] args)
      JFrame mainFrame = new JFrame("Image Tester");
      ImageTest imageTest = new ImageTest();
      mainFrame.getContentPane().add(imageTest);
      mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      mainFrame.setSize(400,400);
      mainFrame.show();
      mainFrame.addKeyListener(imageTest);
   public void paintComponent(Graphics g)
      super.paintComponent(g);
      // get the BufferedImage in its rotated version;
      BufferedImage image = getImage();
      // display the image
      g.drawImage(image, origin.x, origin.y, null);
   private BufferedImage getImage()
      BufferedImage result =
         new BufferedImage(size.width, size.height, BufferedImage.TYPE_INT_ARGB);
      // draw a nice rectangle
      Graphics g = result.createGraphics();
      g.fillRect(0, 0, size.width, size.height);
      // and a north indicator
      g.setColor(Color.BLACK);
      g.fillOval(size.width / 2 - 3, 0, 6, 6);
      return applyRotation(result);
   private BufferedImage applyRotation(BufferedImage source)
      // create the rotation
      AffineTransform transform =
         AffineTransform.getRotateInstance(
                  theta,
                  source.getWidth() / 2,
                  source.getHeight() / 2);
      // make an Operation to create the new buffered image
      AffineTransformOp transformOp =
         new AffineTransformOp(transform, AffineTransformOp.TYPE_BILINEAR);
      // create dest image
      BufferedImage dest =
         transformOp.createCompatibleDestImage(source, source.getColorModel());
      // apply the filter
      transformOp.filter(source, dest);
      return dest;     
    * @see java.awt.event.KeyListener#keyPressed(java.awt.event.KeyEvent)
   public void keyPressed(KeyEvent arg0)
      int key = arg0.getKeyCode();
      switch(key)
         case KeyEvent.VK_R:
            // rotate clockwise
            theta += Math.PI / 2;
            break;
         case KeyEvent.VK_E:
            // rotate counter-clockwise
            theta -= Math.PI / 2;
            break;
         case KeyEvent.VK_UP:
            // scale up
            origin.y -= 5;
            size.height += 5;
            break;
         case KeyEvent.VK_DOWN:
            // scale down
            origin.y += 5;
            size.height -= 5;
            break;
      repaint();
    * @see java.awt.event.KeyListener#keyReleased(java.awt.event.KeyEvent)
   public void keyReleased(KeyEvent arg0)
    * @see java.awt.event.KeyListener#keyTyped(java.awt.event.KeyEvent)
   public void keyTyped(KeyEvent arg0)
}