블랜드의 툴바를 보시면 디자인 하시는 분들은 대충 이 툴이 뭘 하는지 가늠하실 수 있을 거에요.
(포토샵이나 플래쉬에서 썼던 툴과 다 비슷하니까요.)
화살표같이 생긴건 선택할 수 있는 툴이고, 돋보기는 확대 축소, 스포이드는 색을 찍는 것, 펜 툴, 도형 툴, T 글씨 쓸 수 있는 툴 등...
<----- 근데 우리가 모르는 것이 보입니다. 바로 저 Layout Panel입니다.
Layout Panel? 어떻게 이해하면 될까요?
레이아웃 패널은 그룹으로 한데 묶는 기능으로 주로 씁니다.
그냥 포토샵이나 플래쉬에서 묶기만 했던 그룹 기능과 더불어 더 다른 기능까지 가지고 잇답니다.
레이어그룹 안에 도형 위치를 칸칸마다 구분하도록 하는(Grid) 것도 있고,
레이어그룹에 아무렇게나 도형을 막 두어도 되는(?)것(Canvas)도 있고,
레이어그룹 안에 도형을 여러개 넣으면 순서대로 배열되는 (Stack) 것도 있고,
레이어그룹 크기에 따라서 도형 배열되는 것(Wrap)도 있고요..
[레이어를 묶은 특징이 있는 그룹] 라고 이해하니 저는 편해지더군요 -_-;
WPF와 실버라이트를 각 켰을 때 메뉴가 약간씩 다른데요.
실버라이트보다 WPF가 더 많은 패널을 가지고 있습니다. 옆에 메뉴가 WPF가 가지고 있는 패널입니다.
그중에 실버라이트도 쓰고 WPF도 가장 많이 쓰는 Grid 패널과 Canvas 패널을 설명하도록 하겠습니다.
1) Grid 패널
그리드라는 것을 생각하면 우리는 대략 사각형을 그리기 위해 도와주는 자(가이드선) 같은 역할로만 생각합니다.
<- 포토샵에서나 플래쉬 같은 경우에는 그냥 그림을 정확하게 그리기 위해, 혹은 위치를 맞추기 위해 씁니다.
그리드가 많던 적던, 있던 없던~ 전혀 아웃풋에 영향을 미치지 않고 단지
위치 맞추기 위한 선 일 뿐이던 그리드가,
<- 블랜드에서는 그리드가 없으면 위치 배열이며 정확하게 창을 분배해주는
이렇게 중요한 역할이 아닐 수가 없습니다.
드림위버에서 Table, 표 만들기 같은 역할이라고 보시면 될 듯 합니다.
한번 사각형을 넣어보겠습니다.
Row : 열 / Column : 행
RowSpan : 열의 폭 영역 범위
(그리드에 사각형을 기본으로 넣으면 1이 됩니다, 그러나 사각형이 그리드의 두군데에 걸쳐 있으면 Span을 2로 지정합니다)
ColumnSpan : 행의 폭 영역범위 (마찬가지) <- 빨간 사각형이 예를 듭니다.
Ex> 사각형이 맨 오른쪽 맨위에 있으면 그 사각형의 위치는 열 위치는 0 에 행 위치는 2번째에 있는것입니다.
오른쪽에 속성창 > 레이아웃 을 보시고 마진 및 Row 숫자를 조절 하면서 테스트를 해 보시면 더 수월하게 이해하시리라 봅니다.
처음에는 그리드를 쓰는 개념이 잘 안 잡히실 겁니다. 그리드를 잘못 지정하거나 위치만 바꿔도 이미지가 잘리거나 안보이는 경우라던지,
나는 분명히 제대로 한 가운데에 잘 넣었는데 위치가 조금이라도 어긋나 있다던지.. 사용하시면 꼭 한번쯤 이런 경우가 발생할 것입니다.
그리드를 안써도 잘만 디자인 되는데 왜 쓰는지 이해가 안 되기도 했지요.
(한때는 단지 그룹화할 때만 필요했던 그리드였었지요.... 참고로 Ctrl+G를 누르게 되면 여러객체가 Grid패널로 묶이게 됩니다.)
하지만 잘만 활용하면 마우스로 일일이 위치 조정하지 않고, 오차 없는 정렬을 할 수 있습니다. 익숙해지면 캔버스보다 그리드가 참 편해지지요.
챠트같은 표를 그리는 경우가 많지요. 캘린더 및 계산서 같은 것들 말입니다.
Grid에 대한 설명은 기회가 되면 더 진행하도록 하겠습니다.
다음 번엔 촘 쉬운 Canvas 를 배우도록 하겠습니다. :)
