Using a matrix to rotate rectangles individually

Orthmius picture Orthmius · Apr 18, 2012 · Viewed 19.4k times · Source

Having a bit of a drawing complication you would call it. My math is a bit rusty when it comes to Matrices and drawing rotations on shapes. Here is a bit of code:

private void Form1_Paint(object sender, PaintEventArgs e)
    {
        g = e.Graphics;
        g.SmoothingMode = SmoothingMode.HighQuality;
        DoRotation(e);
        g.DrawRectangle(new Pen(Color.Black), r1);
        g.DrawRectangle(new Pen(Color.Black), r2);

        // draw a line (PEN, CenterOfObject(X, Y), endpoint(X,Y) )
        g.DrawLine(new Pen(Color.Black), new Point((r1.X + 50), (r1.Y + 75)), new Point((/*r1.X + */50), (/*r1.Y - */25)));

        this.lblPoint.Text = "X-pos: " + r1.X + " Y-pos: " + r1.Y;

        //this.Invalidate();
    }
    public void DoRotation(PaintEventArgs e)
    {
        // move the rotation point to the center of object
        e.Graphics.TranslateTransform((r1.X + 50), (r1.Y + 75));
        //rotate
        e.Graphics.RotateTransform((float)rotAngle);
        //move back to the top left corner of the object
        e.Graphics.TranslateTransform(-(r1.X + 50), -(r1.Y + 75));
    }
    public void Form1_KeyDown(object sender, KeyEventArgs e)
    {
        case Keys.T:
                rotAngle += 1.0f;
    }

when I rotate (what I think should be r1) both r1 and r2 rotate. I need to be able to rotate each shape individually as I add more shapes.

Answer

LarsTech picture LarsTech · Apr 18, 2012

I would use a function similar to this:

public void RotateRectangle(Graphics g, Rectangle r, float angle) {
  using (Matrix m = new Matrix()) {
    m.RotateAt(angle, new PointF(r.Left + (r.Width / 2),
                              r.Top + (r.Height / 2)));
    g.Transform = m;
    g.DrawRectangle(Pens.Black, r);
    g.ResetTransform();
  }
}

It uses a matrix to perform the rotation at a certain point, which should be the middle of each rectangle.

Then in your paint method, use it to draw your rectangles:

g.SmoothingMode = SmoothingMode.HighQuality;
//g.DrawRectangle(new Pen(Color.Black), r1);
//DoRotation(e);
//g.DrawRectangle(new Pen(Color.Black), r2);

RotateRectangle(g, r1, 45);
RotateRectangle(g, r2, 65);

Also, here is the line to connect the two rectangles:

g.DrawLine(Pens.Black, new Point(r1.Left + r1.Width / 2, r1.Top + r1.Height / 2),
                       new Point(r2.Left + r2.Width / 2, r2.Top + r2.Height / 2));

Using these settings:

private Rectangle r1 = new Rectangle(100, 60, 32, 32);
private Rectangle r2 = new Rectangle(160, 100, 32, 32);

resulted in:

enter image description here