IT/C#

[C#] 윈도우 그림판 만들기 3탄(?) 테이블 그리기 (PictureBox Draw Table with Col, Row)

Ella.J 2023. 4. 7. 15:43
728x90
반응형

 

2020.10.16 - [IT/C#] - [C#] 윈도우 그림판 기능 구현해보기 (PictureBox 그리기 기능, Undo/Redo 기능, 단축키 사용 방법)

 

[C#] 윈도우 그림판 기능 구현해보기 (PictureBox 그리기 기능, Undo/Redo 기능, 단축키 사용 방법)

그림판에 여러 기능들 중에서 크게 두 가지 기능을 구현해보겠습니다. 1. 도형(사각형, 원형, 선형직선) 그리기 기능과 2. 실행 취소(Undo)/다시 실행(Redo) 기능 두 가지 입니다. 그리고 흔히들 사용

ella-devblog.tistory.com

 

그림판 포스팅을 쓴지 새삼 오래됐네요.

전에 작성했던 포스팅에 이어서 표 그리기 기능을 추가로 만들어봤습니다.

위 링크의 코드 설명이랑 같이 보시면 됩니다.

표 그리기는 아주아주 간단합니다.

 

저는 이렇게 메뉴에 Table을 추가했고, 선택하면 Col/Row 열과 행을 선택하도록 했습니다.

 

그럼 이렇게 사용자가 드래그 하는 대로 표가 만들어집니다.

 

이전 포스팅에 이어 작성하는 거라 이전 포스팅을 같이 보시면 이해하실 수 있습니다.

 

이전처럼 툴 선택 했을 때 Table 툴로 변경해 주고,

저는 Form 위에 Panel을 하나 만들어서 Col/Row 선택해 주도록 했기 때문에,

panel1을 처음엔 숨겨두고, 버튼을 클릭했을 때 나오게 해 주었습니다.

private void tableToolStripMenuItem_Click(object sender, EventArgs e)
{
    toolType = PaintTools.Table;
    panel1.Visible = true;
}

이건 만드는 개발자 마음대로~ 행과 열을 지정할 창은 입맛대로 만들면 됩니다.

 

그리고 panel에서 Col/Row 선택하고 Create 버튼을 누르면 전역변수로 지정해 놓은

int tableCol, tableRow 변수에 저장해 줍니다.

private void button1_Click(object sender, EventArgs e)
{
    tableCol = nupCol.Value;
    tableRow = nupRow.Value;
    panel1.Visible = false;
}

 

 

다음에는 사용자가 마우스 Drag로 Rectangle 영역을 그릴 건데,

이때는 MouseMove 이벤트에서 Rectangle과 동일하게 위치만 잡아줍니다.

그리고, 최종적으로 마우스 왼쪽버튼을 뗐을 때(MouseUp 이벤트 안의 DrawBitmap() 함수) 표를 그립니다.

using (Graphics g = Graphics.FromImage(DrawBmp))
{
    //...
    else if (listTool[i] == PaintTools.Table)
    {
        g.DrawRectangle(pn, rect);
        for (int c = 0; c < tableCol - 1; c++)
        {
            g.DrawLine(pn, new Point(rect.X + (int)((rect.Width / tableCol) * (c + 1)), rect.Y), 
            new Point(rect.X + (int)((rect.Width / tableCol) * (c + 1)), rect.Y + rect.Height));
        }
        for (int r = 0; r < tableRow - 1; r++)
        {
            g.DrawLine(pn, new Point(rect.X, rect.Y + (int)((rect.Height / tableRow) * (r + 1))), 
            new Point(rect.X + rect.Width, rect.Y + (int)((rect.Height / tableRow) * (r + 1))));
        }
    }
}

먼저 사용자가 마우스로 그린 사각형 rect로 외곽 사각형을 먼저 그려주고,

Col 개수에 맞게 전체 rect.Width를 Col으로 나눈 값을 이용해서 열을 그려주고,

Row 개수에 맞게 전체 rect.Height을 Row로 나눈 값을 이용해 행을 그려줍니다.

그럼 위와 같이 표 그림이 그려집니다.

 

이렇게 하면 끝!!이지만,,,

 

✨✨중요한 포인트✨✨

이 표 그리기는 전에 그림판 만든 것처럼 실행취소, 되돌리기 기능은 사용하기 어려운 점이 있습니다.

왜냐면, tableCol/tableRow 값도 rectangle 값 저장하듯이 같이 저장해줘야 하기 때문입니다.

행열값이 다른 Table을 두 개를 그리고 싶은데 전역변수 값은 하나만 있으니깐요.

지난 포스팅에 이렇게 List 만든 것처럼 Col, Row 값도 저장해줘야 하는데

그럼 일일이 List를 추가해줘야 한다는 단점이 있습니다.

List를 하나만 사용해서 전부 관리를 하고 싶으면 Struct 구조체를 사용하는 방법이 있는데,

이는 다음 포스팅에서 간단히 구조체를 이용해서 List를 사용하는 방법에 대해 알려드리겠습니다.

 

혹시나 수정이 필요하거나 설명이 추가로 필요하면 댓글 달아주세요 : )

 

 

2023.04.07 - [IT/C#] - [C#] 윈도우 그림판 만들기 심화편 (Struct 구조체 이용하기 + List 사용방법)

 

[C#] 윈도우 그림판 만들기 심화편 (Struct 구조체 이용하기 + List<Struct> 사용방법)

이전 포스팅 보러 가기. 2020.10.16 - [IT/C#] - [C#] 윈도우 그림판 기능 구현해보기 (PictureBox 그리기 기능, Undo/Redo 기능, 단축키 사용 방법) [C#] 윈도우 그림판 기능 구현해보기 (PictureBox 그리기 기능, Un

ella-devblog.tistory.com

 

728x90
반응형