Microsoft MVP성태의 닷넷 이야기
[.NET 3.0] NET 3.0 : 36. WPF - Grid 컨트롤의 ShowGridLine 개선 [링크 복사], [링크+제목 복사]
조회: 12978
글쓴 사람
정성태 (kevin13@chol.net)
홈페이지
첨부 파일

WPF - Grid 컨트롤의 ShowGridLine 개선


지난 번에는 HTML 테이블의 Cell Padding에 해당하는 기능을 구현해 보았는데요.

WPF - CellPadding 속성을 구현하는 Grid Layout
; http://www.sysnet.pe.kr/Default.aspx?mode=2&sub=0&detail=1&wid=734

역시나, HTML Table 태그를 사용해보신 분들은 또 한가지 아쉬운 기능이 있을 것입니다. 바로 Cell 간의 Border 속성이 그것인데요.

예를 들어, 다음과 같은 HTML Table의 경우,

<table style="width: 300px; height: 300px;" border="1">
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td rowspan=2>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td colspan=2>&nbsp;</td>
    </tr>
</table>

아래와 같은 식으로 나오게 됩니다.

[그림 1: Border가 지정된 HTML Table]
wpf_grid_show_grid_line_1.png

이제 WPF에서 제공되는 Grid Panel과 비교해 볼까요?
다행히, WPF Grid 역시 Border와 비슷한 기능을 제공합니다. "ShowGridLines" 의존속성을 지원하는데, 이를 지정하면 다음과 같은 식으로 보이게 됩니다.

[그림 2: ShowGridLines="True" 가 지정된 Grid]
wpf_grid_show_grid_line_2.png

불행히도, 보시는 것처럼 ShowGridLines속성이 왜 있을까 하는 의문이 들 정도입니다. 사실, Microsoft에서는 이 기능을 사용하지 말라고 권고하고 있습니다.

.NET Framework Class Library - Grid.ShowGridLines Property
; http://msdn.microsoft.com/en-us/library/system.windows.controls.grid.showgridlines.aspx

Only dotted lines are available because this property is intended as a design tool to debug layout problems and is not intended for use in production quality code. If you want lines inside a Grid, style the elements within the Grid to have borders.



스타일로 해결하라는데, ... 그건 디자인 잘 하시는 분들이 해결해 주시고. ^^ 저는 프로그래밍으로 접근해 보겠습니다.

일단, 검색을 해보죠.

How can I change the color of the gridlines of a Grid in WPF?
; http://stackoverflow.com/questions/606220/how-can-i-change-the-color-of-the-gridlines-of-a-grid-in-wpf

위의 글은 원인은 분석하였으나 답을 내주지 못했습니다. 그래서 좀더 ^^ 찾아보면,

WPF Grid Question
; http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/74e36c60-b93a-47c7-8214-79669ec6b121/

오... 그나마 괜찮은 대답입니다.

코드는 그저 Grid 에 OnRender부분만 다음과 같이 재정의해주면 됩니다.

public class CustomGrid : Grid  
{  
    Pen line = new Pen(Brushes.Black, 1);  
    protected override void OnRender(System.Windows.Media.DrawingContext dc)  
    {  
        base.OnRender(dc);  
        dc.DrawRectangle(null, line, new Rect(0,0,this.ActualWidth, this.ActualHeight));  
        double height = 0;  
        foreach (var r in this.RowDefinitions)  
        {  
            height += r.ActualHeight;  
            dc.DrawLine(line, new Point(0, height), new Point(this.ActualWidth,height));  
        }  
        double width = 0;  
        foreach (var c in this.ColumnDefinitions)  
        {  
            width += c.ActualWidth;  
            dc.DrawLine(line, new Point(width, this.ActualHeight), new Point(width, 0));  
        }  
    }  
}  

와~~~ 간단하지요. ^^ 그런데, 정작 적용해 보면 다양한 상황을 고려하지 않았음을 알 수 있습니다. 예를 들어, 아래의 그림과 같이 나옵니다.

[그림 3: RowSpan/ColumnSpan이 고려되지 않은 Cell Border]
wpf_grid_show_grid_line_3.png

그럼, 이 부분을 다듬으면 문제는 해결이 되는데요. 생각 자체는 그리 어렵지 않습니다. 예를 들어, 가로선을 그을 때(Row별로) 컬럼 단위만큼 그리며 진행하다가 다음번 그려야 될 곳이 RowSpan으로 되어 있으면 그 구획은 긋지 말고 건너뛰면 됩니다. 세로선도 마찬가지겠지요.

그렇게 생각한 데로 구현해서 보정하면, 최종적으로 아래와 같이 나옵니다. 이 정도면... 괜찮지 않나요! ^^

[그림 4: RowSpan/ColumnSpan영역을 고려한 Cell Border]
wpf_grid_show_grid_line_4.png

보정된 소스 코드는 첨부된 솔루션 압축 파일에 있습니다.




[이 토픽에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]





[최초 등록일: ]
[최종 수정일: 6/8/2009 ]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:kevin13@chol.com

비밀번호

댓글 쓴 사람
 



2017-08-27 06시16분
[Lyn] 안녕하세요. 해당 코드 잘 참고 하여 감사의 인사를 드립니다. 제가 사용하기 위해 수정 한 코드를 https://lunapiece.net/Article/14007914 에 올려놓았습니다
[손님]
2017-08-28 08시34분
[정환나라] 성태님 혹시나 해서 말씀드리는데 코드같은것들을 첨부하지마시고 Github에 공개해서 진행하시는건 어떨지 여쭤봅니다.
[손님]
2017-08-28 09시23분
@Lyn 글 잘봤습니다. ^^ 그러고 보니, 벌써 8년 가량이 흘렀군요.

@정환나라 이게 워낙 별다르게 큰 묶음이 아니라서... ^^; 일일이 올리는 것도 참 애매합니다. repo 생성도 그렇고.
정성태

[1]  2  3  4  5  6  7  8  9  10  11  12  13  14  15  ...
NoWriterDateCnt.TitleFile(s)
11396정성태12/8/201770개발 환경 구성: 351. Visual Studio - 리눅스 용 프로젝트의 인텔리센스를 위한 헤더 파일 처리 방법
11395정성태12/8/201735오류 유형 : 438. 이벤트 로그 - Time Provider NtpClient: No valid response has been received from domain controller
11394정성태12/8/201767개발 환경 구성: 350. 비주얼 스튜디오에서 실행하던 ASP.NET Core (.NET Framework) 응용 프로그램을 명령행에서 실행하는 방법
11393정성태12/7/201797Windows: 85. 윈도우 10 빌드 17046부터 WSL에서 백그라운드 작업 지원 [2]
11392정성태12/7/201738개발 환경 구성: 349. openSUSE에 닷넷 코어 설치
11391정성태12/7/201740개발 환경 구성: 348. WSL을 이용해 윈도우 PC 1대에서 openSUSE 응용 프로그램을 Visual Studio로 개발하는 방법
11390정성태12/7/2017138개발 환경 구성: 347. WSL을 이용해 윈도우 PC 1대에서 Linux 응용 프로그램을 Visual Studio로 개발하는 방법 [1]
11389정성태12/7/201738오류 유형 : 437. .NET Core 오류 - 0x80131620 Unable to load DLL 'libuv'
11388정성태12/6/2017139개발 환경 구성: 346. WSL 또는 Ubuntu에 닷넷 코어 설치 [1]
11387정성태12/6/201754오류 유형 : 436. 이벤트 로그 - Data Sharing Service 서비스의 %%3239247874 오류 메시지
11386정성태12/5/201765오류 유형 : 435. Hyper-V - '...' failed to add device 'Virtual CD/DVD Disk'
11385정성태12/5/201798VC++ : 95. DXGI를 이용한 윈도우 화면 캡쳐 소스 코드(Visual C++)파일 다운로드1
11384정성태12/5/201760오류 유형 : 434. Visual C++ - Cannot open include file: 'SDKDDKVer.h'
11383정성태12/4/2017119Debug Features : 108. 비동기 코드 실행 중 예외로 인한 ASP.NET 프로세스 비정상 종료 현상
11382정성태12/4/2017103오류 유형 : 433. System.Data.SqlClient.SqlException (0x80131904): Connection Timeout Expired 예외 발생 시 "[Pre-Login] initialization=48; handshake=1944;" 값의 의미
11381정성태11/30/2017182.NET : 547. 한글이 포함된 바이트 배열을 나눈 경우 한글이 깨지지 않도록 다시 조합하는 방법(두 번째 이야기)파일 다운로드1
11380정성태11/30/2017159Debug Features : 107. windbg - (x64에서의 인자 값 추적을 이용한) Thread.Abort 시 대상이 되는 스레드를 식별하는 방법
11379정성태11/30/2017127오류 유형 : 432. System.Web.HttpException - Session state has created a session id, but cannot save it because the response was already flushed by the application.
11378정성태11/29/2017267.NET : 546. 한글이 포함된 바이트 배열을 나눈 경우 한글이 깨지지 않도록 다시 조합하는 방법 [1]파일 다운로드1
11377정성태11/29/2017276.NET : 545. CommonOpenFileDialog 사용 시 사용자가 선택한 파일 목록을 구하는 방법 [3]파일 다운로드1
11376정성태11/28/2017169VS.NET IDE : 85. Visual Studio 편집기의 \r\n (crlf) 개행을 \n으로 폴더 단위로 설정하는 방법
11375정성태11/28/2017109오류 유형 : 431. Visual Studio로 ASP.NET 디버깅 중 System.Web.HttpException - Could not load type 오류
11374정성태11/27/2017164Linux 3: 라즈베리 파이 - (윈도우의 NT 서비스처럼) 부팅 시 시작하는 프로그램 설정
11373정성태11/27/2017162오류 유형 : 430. Raspberry Pi/Windows 다중 플랫폼 지원 컴파일 관련 오류 기록
11372정성태11/26/2017166개발 환경 구성: 345. 윈도우즈 사용자를 위한 라즈베리 파이 제로 W 모델을 설정하는 방법
[1]  2  3  4  5  6  7  8  9  10  11  12  13  14  15  ...