Flip coordinates when drawing set of rectangles

问题

I am trying to draw set of squares but the origin(0,0) of squares was in top left corner initially and I wanted squares to render from bottom right corner, and I found this code to flip the co ordinates, but nothing is rendering on winform.

I know that I have gone wrong in Height attribute of TranslateTransform. I dont get as to why Height is required as i am trying to draw a set of 2d squares.

I tried hardcoding the height attribute still of no use.

public void ScaleTransformFloat(PaintEventArgs e,List<Square> lstSquare)
    {
        int Height = 10;
        // Begin graphics container
        GraphicsContainer containerState = e.Graphics.BeginContainer();

        // Flip the Y-Axis
        e.Graphics.ScaleTransform(1.0F, -1.0F);

        // Translate the drawing area accordingly
        //
        e.Graphics.TranslateTransform(0.0F, -(float)Height);

        // Whatever you draw now (using this graphics context) will appear        as
        // though (0,0) were at the bottom left corner

    //User-defined function to draw a square    
        DrawSquare(e,lstSquare);
        // End graphics container
        e.Graphics.EndContainer(containerState);


    }

Method to draw set of squares

  public void DrawSquare(PaintEventArgs e,List<Square> lstSquare)
    {
      foreach(Square s in lstSquare){
        e.Graphics.DrawRectangle(Pens.Black, 0,0 ,s.m_Side, s.m_Side);
      }
    }

回答1:

When doing matrix operation like transformations usually the order does matter.

In your case you need to either translate first, then scale/flip or reverse the direction of the translation. Your code seems to get it right.

The Height is not a 3d height. It is the total Height of the target control you want to draw on.

Imagine laying a sheet of paper on your control; the control is your viewport. Now imagine flipping the paper topwise by the top left edge. It has left the viewport. Now you need to move it down. But by what distance? Answer: The paper's height..

Your code has a Height = 10 pixels. This is certainly not the size of your control, right? Maybe it comes from code you copied; there it probably meant the Form's Height. If you want to draw on the Form also (usually not a good idea), simply delete the line int Height = 10;!

Let's do a simple example: We draw a few rectangles onto a Panel:

private void panel1_Paint(object sender, PaintEventArgs e)
{
    if (checkBox1.Checked)
    {
        e.Graphics.ScaleTransform(1, -1);
        e.Graphics.TranslateTransform(0, -panel1.Height);
    }
    e.Graphics.DrawRectangle(Pens.Violet, 1, 1, 33, 33);
    e.Graphics.DrawRectangle(Pens.OrangeRed, 11, 11, 133, 55);
    e.Graphics.DrawRectangle(Pens.Magenta, 44, 11, 233, 77);
    e.Graphics.DrawRectangle(Pens.Olive, 55, 44, 33, 99);
}

private void checkBox1_CheckedChanged(object sender, EventArgs e)
{
    panel1.Invalidate();
}

After checking the CheckBox the result is flipped:

Also note that your DrawSquare draws all squares at the same location (0,0). Not sure if that is what you want..

Final note: DrawRectangle has a nasty habit of overdrawing the botton and right sides by one pixel. After changing the first loaction from (1,1) to (0,0) the (then) bottom side will be cut off. You might consider translating the graphics coodinates by 1 pixel less..

来源：https://stackoverflow.com/questions/37497929/flip-coordinates-when-drawing-set-of-rectangles

标签

winforms

shapes