[WP7 개발 기초] xaml이 아닌 cs로 화면 채우기

2012/03/19 - [About WP7] - [WP7 개발 기초] ScrollViewer

오랜만에 WP7 관련 포스팅을 합니다. 물론 잡지에 기고하는 것으로 간단한 WP7에 대한 이야기를 했었지만, 다시 공부해볼 필요성을 느끼고 조금씩 나아가렵니다. 지난 포스트에서는 단순히 xaml코드상에 자신이 원하는 문구를 삽입해서 scrollViewer로 내용을 확인할 수 있는 것을 시연했습니다. 이번에는 xaml은 쓰지 않고 cs상에서 문구를 받아와서 표현하는 것을 구현해보고자 합니다. 우선 평상시에 하던 것처럼 윈도우폰 프로젝트를 생성합니다. 이번 프로젝트의 이름은 PublicClasses입니다.

 

 

물론 단순한 폰 화면이 디자인뷰를 나타나겠지만 이번에는 xaml상에서 개체를 삽입할 것이 아니라 외부의 어셈블리의 클래스를 열거하는 예제를 다뤄보고자 합니다. 일단 xaml 상의 코드는 다음과 같이 구현합니다.

 

 

물론 시각적으로는 변하는게 아무것도 없습니다. 우리가 단순히 ContentPanel에 삽입한 것은 ScrollViewer, 즉 내용이 넘칠때 화면의 가장자리를 드래그하면 나타나는 스크롤인 겁니다. 하지만 지난 포스트에서는 VerticalScrollBarVisibility인데 이번에 삽입한 내용은 Horizontal 즉 수평적으로 내용이 많을 경우 스크롤 바가 등장하는 겁니다. 

 이제부터는 모두 cs파일에서만 다룹니다. 우선은 어셈블리에 속해있는 자식들을 나열할 수 있도록 List가 포함된 클래스를 하나 생성해줍니다. 클래스 생성 방법은 단순히 Solution Explorer에서 Add-class를 통해서 할 수 있습니다.

 

 

이름은 ClassAndChild라고 하고 다음과 같이 구성합니다. 참 우선은 지금은 단순한 자료의 모음으로써 사용할 것이기 때문에 System.Collections.Generic을 using 지시자로 불러야 합니다.

 

 

 

어떻게 보면 위의 class라는 구조는 c나 C++에서 나왔던 struct의 개념과 유사합니다. 똑같이 하위 개체를 생성하고 그걸 판별할 수 있는 type과 List를 가지고 있는 면에서 말입니다. 조금더 깊게 접근하자면 struct는 값을 호출하는 형태, 즉 call by value의 꼴이고 class는 reference를 호출하는 형태( call by reference)를 취합니다. 물론 불러오는 값이 틀려지겠지요. call by value를 통해서 불러오면 해당 변수만 가지고도 값을 제어할 수 있는 반면 call by reference는 변수가 저장된 주소로 제어하는 것이기 때문에 조금 복잡한 감이 있습니다. 물론 조금더 궁금하신 점이 있다면 링크를 통해서 살펴 보셔도 좋을 것 같습니다. 아무튼 결론만 말씀드리자면 ClassAndChild로 지정된 변수는 하위로 type과 List 형을 가진다는 겁니다.

 

ClassAndChild.cs는 이정도에서 마치고 다음은 MainPage.xaml.cs를 채울 차례입니다. 우선은 여기에도 System.Reflection이란 네임스페이스를 추가해줘야합니다.

 

 

어셈블리로부터 값을 읽어오고 표현하기 위해서는 위의 네임스페이스가 필요합니다.

일단 기본적으로 포함된 강조 스타일인 PhoneAccentBrush를 accentBrush로 정의해줍니다.

 

 

그리고 읽어올 어셈블리를 List에 넣어주는 것을 구현합니다. 간단하게 Microsoft.Phone과 Microsoft.Phone.Controls에 대한 어셈블리를 List에 삽입하도록 하겠습니다.

 

 

 이제 리스트안에 내용물이 들어갔으니 이걸 type별로 나눠서 하나의 트리로 형성하고자 합니다. 물론 이것도 하나의 리스트화시키면 좋겠지요. 우선은 그전에 정해진 리스트안에 type별로로 나눠서 포함시키는 구문은 다음과 같습니다.

 

 

지금은 마구잡이로 포함된거니까 다시 이 내부에서 새로운 타입으로 정렬해줄 필요가 있습니다. 이때 새로운 변수로 TypeCompare로 선언하고 다음과 같이 정의합니다.

 

 

 정렬을 했으니까 이제는 트리로 계층적으로 쌓아가는 것이 필요합니다. 이에대한 메서드를 AddToTree라고 하겠습니다.

 

 

여기서 AddToTree함수를 보면 조금 이상합니다. 함수안에 자기 함수가 또 호출된 겁니다.  이런 함수를 recursive method 즉 재귀함수라고 합니다.

 

 

위 이미지가 어떻게보면 재귀적 상황의 대표적인 예입니다. 계속 자기자신을 참조하는 꼴이 되는 겁니다. 똑같습니다. 위의 AddToTree 메서드도 classes 속의 type이 일정한 것끼리 모아가면서 하나의 subclass를 구성하게 되는 겁니다. 물론 메인에서 한번 이 메서드를 호출함으로써 한번에 계층적으로 class가 쌓이게 되겠지요.

자 이렇게 쌓았으니까 이제 보여줘야 합니다. 이에 대한 메서드는 Display로 정의되고 메인단의 맨 하단에서 불러옵니다.

 

 

 

이제 parentClass에는 우리가 원하는 type이 담겨있습니다. 이걸 string형으로 전환시켜서 보여주는게 Display 메서드의 역할이 되겠습니다.  

 

 

이 Display 메서드도 재귀함수입니다. 첫번째 str1에선 해당 parentClass의 이름과 클래스의 종류가 뜰 것이고 두번째는 이 parentclass가 어느 어샘블리에서 나왔는지를 표현해주는 문자열입니다. 그대신 글자색은 맨앞에서 언급한 accentBrush 즉 강조하는 색이 될것입니다. 이런식으로 클래스가 쌓이면서 indent가 1씩 증가하게 되고, 당연히 첫번째 parentClass보다 하위 개념의 class는 indent가 1인 상태에서 다시 이 Display가 시작될겁니다. 보시면 아시겠지만 indent의 의미는 계층적인 구조를 보여주기 위한 띄워쓰기의 일환입니다. 이런 값들이 이제 stackPanel의 child로 들어가게 됩니다. 결과를 한번 보시죠.

* 그런데 Microsoft.Phone.Control에 대한 정보는 없다고 뜨네요... 대신 System.Windows에 대한 어셈블리를 열어보았습니다.

 

 

자 옆에 보이는 것처럼 하위 계층일수록 indent로 인한 들여쓰기가 되고 있다는 것을 확인할 수 있습니다. 물론 맨앞에서 지정한 것처럼 HorizontalScrollBar가 드래그할때는 나타나는 것도 보입니다. 마지막에 상속된 네임스페이스의 색상도 빨갛게 즉 AccentBrush 효과를 나타내고 있습니다.

 이렇게 xaml상에서 아무것도 안했는데도 child의 개념으로 삽입을 함으로써도 폰을 채울 수 있습니다.