[WP7] 'Hello World' App 만들기!

( Image : http://channel9.msdn.com )

 

* 본 포스팅은 < Channel 9 >의 동영상 강좌, 'Windows Phone 7 Development for Absolute Beginners'을 바탕으로 실습하고 기록한 Windows Phone 7 개발강좌입니다.

 

WP7 강좌 - 두번째
Level 1 Quest : 'Hello World' App 만들기

프로그램을 하는 사람이라면 그 누구도 비켜갈 수 없다!!
지금은 용을 한손으로 잡는 전사라도 그 언젠가 반드시 거쳐갔던, 'Hello, World' 출력하기! ^_^

  지난 시간에는 Windows Phone 7의 개발 환경을 구축해 보고, 혼자서도 공부할 수 있는 훌륭한 동영상 교재, < Windows Phone 7 Development for Absolute Beginners (이하 WP7D for AB) >에 대해서 소개했었습니다.
  오늘은 < Day1-Part3 : Writing your First Windows Phone 7 Application >을 참조하여, 'Hello World' App을 만들어 봅시다. 우리의 첫 앱이 되겠군요~

지난 강좌 보기 : [WP7] Windows Phone 7 개발을 해보자! (WP7 개발환경 구축)

  WP7에서 'Hello World'를 출력하는 것은 정말로 간단합니다.
  이 App을 만들면서 우리가 할 일은, 

• ToolBox에서 Button 하나 선택
• TextBlock (TextBox가 아님에 유의!) 하나 선택
• Button을 Double-Click해서 자동생성되는 이벤트 안에 코딩 한줄

이 세가지 밖에 없습니다.
동영상 강좌를 보면서 진행해볼까요?

Writing your First Windows Phone 7 Application (Day1-Part3)

Visual Studio WP7 개발화면 들여다 보기

  첫 App이니 만큼, 잠깐 Visual Studio의 WP7 개발창에 대해서 간단하게 살펴봅시다.

1. Windows Phone 용 Controls
  일반적인 C#의 ToolBox와는 조금 다르네요. 짧고 간결한 편이라고 해야되나... 조금은 생소했지만 각각의 컨트롤들의 명칭을 읽어보니, 어떤 기능을 하는지는 어느 정도 감이 옵니다. Control에 대해서는 앞으로 천천히 알아가게 되겠죠?

2. Main Page 화면
  " What You See is What You Get! "
  내가 이 App을 만들어서 폰에 실행시키면 내가 지금 보고 있는 화면이 나오게 될 것입니다. Visual Studio의 GUI 디자인 화면은 여전히 강력하네요~ 필요한 Control 들을 드래그앤드랍(Drag and Drop)해서 적당한 위치만 마우스로 잡아주기만 하면 어느 정도 내가 만들고픈 화면이 완성이 됩니다. 안드로이드 개발시, 이클립스(Eclipse)를 쓰면서 제일 답답하고 하기 싫었던 부분이 이 부분인데요, 새삼 고마운 마음이 듭니다.

3. Main Page 코딩 화면
   저와 같은 초보들은 당분간, 혹은 앞으로 더 오랫동안 건드리지 않을 부분입니다. 아니, 건드릴 필요가 거의 없는 부분입니다. 2번의 Main Page 화면을 구성하고 수정할 때마다, Main Page를 구성하는 코드들을 자동으로 생성해줍니다. '우리는 그림을 고치고, 컴퓨터(엄밀히 말해서는 개발툴)은 그 그림에 알맞는 코드를 수정해준다!'라고 생각하시면 되겠습니다. 직접 코딩을 좋아하시는 분들은 어떻게 생각하실지 모르겠지만, 저는 이런 방식이 맘에 듭니다.

4. Property(속성) 창
  우리가 자주 건드리게 될 부분입니다. 일반적인 control의 속성은 이 곳에서 전부 수정이 가능합니다. '잘 배운 한 property가 열 method 안 부럽다'는 말이 있을 정도로 알면 알수록 도움이 되는, 그러나 너무 내용이 방대해서 다 외우기는 좀 뭣한... 그런 창입니다. 틈틈히 Reference를 옆에 끼고 봐가면서 진행하면 되는 부분으로 너무 부담가질 필요는 없는 것 같습니다.

  WinForm C# 코딩이 그러하듯, 우리는 주로 2번 창을 확인하면서, 필요한 기능을 1번에서 2번 창으로 추가하고, 4번의 속성들을 수정하고, 2번의 control 등을 건드렸을 때, 발생하는 이벤트 들을 코딩하는 방식으로 모든 코딩이 진행이 됩니다.




드디어 완성된 당신의 첫 App : Hello, World!

  코딩이 끝났다면, 이제 실행을 시켜볼 차례입니다.
  화면 상단에 있는 Play버튼(Debugging Start버튼)을 눌러봅시다. < F5 >키를 눌러도 동일한 기능이 실행됩니다.

프로그램 실행화면
  실행하면 WP7 에뮬레이터가 자동으로 실행되면서, 우리가 코딩한 내용이 반영된 화면이 나타나게 됩니다. 우리가 보게 될 화면은 아래와 같습니다. 'Click Me'라고 되어 있는 버튼을 클릭해봅시다.

  어라? 뭔가 내가 코딩한 것과 결과가 다른가요?
  그건 제가 임의로 상단의 빈칸에 'Pandora's Box'라는 글을 처넣고, Click Me 버튼을 클릭했을 때 출력되는 문자열의 크기를 보기 좋게 수정했기 때문입니다. 여러분도 해보세요~

  다음 강좌에서는 WP7 에뮬레이터에 대해서 이것저것 알아보겠습니다.

fin.


                                       아시죠? 아래 원츄 버튼 꾹~!!! ^_^  므흐흐흐!!