Search code examples
c#winformsmathgdi+graphics2d

Using a matrix to rotate rectangles individually


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.


Solution

  • 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