이번 포스팅에서는
1. 팝업창 내부의 구조를 구현하고
2. 작은 사각형들을 동적으로 생성한다.
----------------------------------------------------------
1. 팝업창 내부의 구조
이제 팝업창 내부에 행, 열을 선택하는 화면을 구현해보자.
팝업창 상단에는 현재 선택된 행, 열의 갯수가 보여지도록 TextBlock 을 넣고
하단에는 사각형들을 배치할 'UniformGrid'를 하나 넣어준다.
여기까지 넣으면 간단한 구조는 다음과 같다
<Popup>
<Grid>
<TextBlock />
<UniformGrid />
</Grid>
</Popup>
----------------------------------------------------------
2. 작은 사각형들 생성
작은 사각형들을 생성하여 위에서 생성한 UniformGrid에 차곡차곡 넣어주어야 한다.
간단한 과정은 다음과 같다.
1. 먼저 UniformGrid 에 Row, Column 을 원하는 값으로 지정한다.
2. 해당 UniformGrid에 Row x Column 개 만큼의 사각형을 생성하여 Children으로 추가한다.
이 과정을 실행하는 시점은, Generic.xaml 에 정의된 Template가 적용되는 시점으로 하는 것이 바람직하며
이는 OnApplyTemplate() 함수를 override 하여 사용하면 된다.
이 과정을 코드로 작성하면 다음과 같다.
MaxRows, MaxColumns, RectangleSize, RectangleMargin, RectangleColor 등은 몇 칸을 어느 정도의 크기와 색으로 만들지에 대한 변수이며,
CustomRectangle 은 'Rectangle' 에 2개의 int 형 변수 : Row, Column 을 추가한 객체이다.
----------------------------------------------------------
여기까지 완료하고 실행시켜보면 다음과 같은 화면을 볼 수 있다.