Windows Phone Developer Tool Release

Windows Mobile 7 2010. 9. 30. 22:28 Posted by 알 수 없는 사용자

MSDN 영문 사이트의 Main Page에 보면 Windows Phone Developer Tool Release 라는 내용에 대한 이미지를 볼 수 있습니다. 릴리스 시점은 추석 연휴 시작하기 전인 9 16일입니다.

아직 관련 소식에 대한 업데이트가 없어 릴리스에 대한 내용을 알아보도록 하겠습니다.

이미지를 클릭하면 블로그로 이동해서 내용을 살펴보시면 여러 유용한 정보를 알려주고 있으니 Windows Phone 7에 관심 있는 분은 방문해보시기 바랍니다.

http://windowsteamblog.com/windows_phone/b/wpdev/archive/2010/09/16/windows-phone-developer-tools-are-final.aspx

 

도구가 새로 릴리스 되었으니 다운로드 받아 설치해보도록 하겠습니다. 개발도구 등의 사이트는 아래 사이트를 방문하면 됩니다.

http://developer.windowsphone.com/windows-phone-7/

이전 버전의 도구(Beta) 가 설치되어 있다면 제거합니다. 도구를 다운로드 받아 설치를 진행합니다. 이전 버전보다는 더 많은 구성요소가 설치됩니다. Expression Blend 4 가 있다면 Expression Blend 4 Add-in for Windows Phone 도구도 설치됩니다.

현재는 Windows Phone Developer Tool 은 영문 버전만 제공되고 있습니다.

설치가 다 되고 나면 Visual Studio 2010에서 새 프로젝트를 생성하려고 하면 Silverlight for Windows Phone에 대한 내용을 볼 수 있으며 아래와 같은 프로젝트 템플릿을 확인할 수 있습니다.

Expression Blend 4 에서도 마찬가지로 Windows Phone에 대한 프로젝트 템플릿을 확인할 수 있습니다.


프로젝트 템플릿을 보면 이전 버전(Beta)와 다르게 CodePlex에서 소개하던 Panorama, Pivot 에 대한 프로젝트 템플릿이 나타나는 것을 알 수 있습니다.

 

아직 설치를 하지 않으셨다면 설치해서 Windows Phone 개발을 시작해보시기 바랍니다.

앞으로의 블로깅은 모바일에 대한 새로운 기능 위주로 작성할 예정입니다.

 





이번 시간에 해 볼 내용은 동적으로 컨트를들을 생성하는 작업입니다.




모두 이렇게 아무것도 없는 상태로 프로젝트를 만들어 주시기 바랍니다.
지금부터 아무 것도 없는 화면에서 동적으로 컨트롤들을 생성해서 배치할 것입니다.
즉, 애플리케이션 실행 중에 컨트롤을 만들 것입니다.

가장 단순한 것이 버튼 컨트롤일 것입니다.
동적으로 버튼 컨트롤을 생성하기 위해서는 당연한 얘기지만,
폰 페이지가 생성되는 시점에 컨트롤을 만들어주는 코드를 추가해 주면 됩니다.
*.cs 파일을 열어서 다음과 같이 내용을 추가해 줍니다.




이들은 블렌드 툴에서 컨트롤 속성을 설정하는 부분을,
프로그램 소스 상에서 속성을 제어하는 부분입니다.
속성 정보는 중에 제가 현재 이벤트를 연결한 부분이 있습니다.
pStartCtrl.Click += OnStartButtonClick 와 pEndCtrl.Click += OnEndButtonClick 부분입니다.
이벤트도 코드 상에서 이렇게 연결해 줄 수 있습니다.


현재 예제에서는 간단히 메시지 박스를 출력하는 것은 마무리 했습니다.
대부분의 컨트롤들은 위의 방법과 같이 동적으로 생성해 줄 수 있습니다.
여기까지가 예제 샘플 작업의 끝입니다.^^






그런데 한가지 생소한 부분이 있을 것이라 생각을 합니다.
바로 ContentPanel.Children.Add( XXX ) 부분입니다.
어딘가에 현재 우리가 생성한 컨트롤들을 추가해주고 있습니다.
과연 이 패널은 무엇일까요?

프로그램 작성을 마치고, 다시 디자인 폼 수정 화면으로 돌아옵니다.



위의 화면을 확인해 보실 수 있겠죠?
앞에서 언급한 낯선 이름이 보입니다.
'ContentPanel' 보이시죠?

여기에 버튼을 하나 만들어 봅니다.
이번에는 소스 코드 레벨이 아니라, 디자인 폼 상에서 버튼을 바로 배치해 봅니다.




디자인 폼 상에서 버튼을 배치시키면,
바로 ContentPanel 의 하위 계층에 추가되어지는 것을 확인할 수 있습니다.
즉, 앞선 언급했던 ContentPanel.Children.Add( XXX ) 소스 코드는 바로
이 작업을 해준 것입니다.

조금 더 정확히 얘기하자면,
윈도우폰7의 레이아웃은 크게 TitlePanel과 ContentPanel 로 나눠져 있습니다.
그래서 이들 패널에 컨트롤을 추가했던 것입니다.

패널( Panel )이 무엇인지 모르시겠다구요?
패널은 이후의 시간에 언급될 기회가 있을 것입니다만,
지금은 단순히 컨트롤들을 그룹화 시켜서
자동으로 관리시켜주는 것 정도로 생각하시면 될 것입니다.^^


샘플 파일 첨부해드립니다..^^



이번 시간에는 간단하게 페이지 간의 전환을 해보려고 합니다.
그러기 위해서는 최소 2개 이상의 페이지가 존재해야 합니다.
그래서 첫 작업은 페이지를 추가하는 작업입니다.
역시나 이번에도 VisualStudio가 아닌, 블렌드를 실행합니다.

그리고 프로젝트에서 아래 그림과 같이 새로운 아이템을 추가합니다.








이렇게 하면 새로운 페이지가 추가되어져 있을 것입니다.
그리고 첫번째 페이지에 간단히 버튼을 추가합니다.
버튼은 Asset 패널에 컨트롤 메뉴에 있습니다.
버튼을 배치하면, 각종 속성을 제어할 수 있도록 화면 우측에 여러 윈도우가 활성화 되는 것을 볼 수 있습니다.





버튼만 화면에 있으니깐 너무 단순한 것 같아, 이미지를 화면에 배치시키겠습니다.
이미지를 위해서 프로젝트 내부에 폴더를 만듭니다.



그렇게 폴더가 만들어진 후에는 'Add Existing Item...' 메뉴를 통해서 이미지를 추가합니다.



이 때, 이미지 파일 어느 곳에 있든 상관이 없습니다.
왜냐하면, 현재 작업중이 프로젝트로 이미지 파일을 새롭게 복사를 해오기 때문입니다.
현재 작업 중인 프로젝트를 열어서 확인해 보시기 바랍니다.
이미지 파일이 자동적으로 생성되어서 복사되었음을 확인할 수 있을 것입니다.

이제 이미지를 배치해 보겠습니다.
이미지 역시 컨트롤이기 때문에 Assets 탭에서 Image 컨트롤을 선택해서 적당히 배치하시기 바랍니다.
같은 방법으로 두번째 페이지에도 추가해 주시면, 결과 확인이 쉽겠죠? ^^



이미지의 경우에는 컨트롤만 연결되었지, 아무런 변화가 없을 것입니다.
즉, 이미지 리소스를 연결해 주어야 합니다.
아래 그림처럼 현재 연결 가능한 리소스 리스트에서 하나를 선택해서 연결해 주시면 됩니다.




각 페이지마다 이미지가 잘 등장했으리라 예상이 됩니다.

혹시나 컨트롤이 잘 선택이 안되어지는 경우에는 아래와 같은 패널을 이용하시기 바랍니다.
이 패널은 컨트롤을 가장 확실하게 선택할 수 있습니다..^^





이제는 속성 창에 대한 설명을 뒤로 한채 간단하게 저 버튼들에 이벤트를 연결해 보겠습니다.
아래 그림에서 빨간색 타원 영역이 보이십니까?
그 영역에서 번개 모양의 아이콘을 클릭하면 이벤트를 연결할 수 있습니다.
버튼이 선택되어진 상태에서 해야, 버튼에 관련한 이벤트를 연결할 수 있습니다.





번개 모양의 아이콘을 클릭하면 다음과 같은 이벤트 속성 창이 등장합니다.



저는 Click 속성에 Next 를 입력한 후에 엔터키를 쳤습니다.
그러면 Next 라는 이벤트용 함수가 만들어 집니다.
각각의 상황을 모두 제어하고 싶다면,
바로 이렇게 이벤트 속성에서 함수명을 입력하고 제어하면 되는 것입니다.
아래와 같이 친절하게 함수를 만들어 줍니다.^^




페이지 전환을 위해서 저는 아래와 같이 코드를 추가했습니다.



두번째 페이지에서도 동일한 방법으로 페이지 파일명만 교체해서 추가해 주었습니다.
제가 만든 결과는 다음과 같습니다.^^



버튼을 클릭할 때마다, 페이지 이동이 발생합니다.^^
실행 프로젝트는 첨부를 하니, 참고해 주시기 바랍니다.^^
이번 시간에 Uri가 무엇인지, NavigationService 가 무엇인지 등 코드에 대한 설명하지 않습니다.^^
실제 코드 개발 관련 내용은 다른 분들이 다루어 주실 것입니다.





얼마전 윈도우 폰 개발 툴 베타 버전( Windows Phone Developer Tools Beta )이 배포되기 시작했습니다.


http://www.microsoft.com/downloads/details.aspx?FamilyID=c8496c2a-54d9-4b11-9491-a1bfaf32f2e3&displaylang=en


이번 개발 툴 버전의 가장 큰 특징 중 하나는
'Microsoft Expression Blend for Windows Phone Beta'의 포함입니다.
지난 버전까지는 별도의 애드인 작업을 거쳐야 했는데, 이번 버전부터는 포함되어 있습니다.

윈도우폰7 개발에 많은 관심이 있으신 분들 중에는
Expression Blend( 이하 블렌드 ) 라는 소프트웨어에 대해서 굉장히 생소할 수 있습니다.
이 소프트웨어는 마이크로소프트에서 개발되었으며,
실버라이트나 WPF 와 같은 마이크로소프트 플랫폼에서 손쉬운 그래픽 디자인을 위해서 탄생했습니다.
처음 공개적으로 배포된 것이 2007년 1월이니, 정말 최신 소프트웨어라고 할 수 있습니다.
( 현재는 4.0까지 출시되었으며, 이것이 2010년 6월의 일입니다. )

알려진 바와 같이 윈도우폰7 개발 방법은 크게 2가지로 나누어져 있습니다.
실버라이트를 기반으로 한 일반 애플리케이션 분야와
XNA 를 기반으로 한 게임 분야입니다.



아주 불행하게도 XNA와 블렌드는 연동되지 않습니다.
( 이것은 블렌드를 조금이라도 아는 분들이라면, 정말 불행한 일이라고 생각하실 것입니다. )

무슨 말이 더 필요하겠습니까?
지금 당장 윈도우폰 개발 베타 버전을 설치하신 후에 Visual Studio가 아닌,
Microsoft Expression Blend for Windows Phone Beta 실행하시기 바랍니다.




아마 위와 같은 화면이 실행되어졌을 것입니다.
실행 후에는 이 블렌드를 통해서 윈도우폰7 프로젝트를 생성합니다.







적당한 경로에 자신이 원하는 프로젝트 명칭으로 설정해주면 됩니다.
그리고 OK를 클릭하면, 프로젝트가 생성됩니다.




기존의 디자인툴에 익숙하신 분들이라면, 친숙한 모습일 것입니다.
블렌드는 사실 기능이 너무 많습니다.
개인적인 생각이지만, 포토샵 + 플래시 + 드림위버 같은 느낌이였습니다.
여러분들은 어떠신가요? ^^

그러면 코딩은 어디서 해야 할까요?
의구심이 드시겠죠? ^^
실제 코딩은 블렌드 내부에서도 가능하고, Visual Stduio를 별도로 띄워서도 가능합니다.
이것이 제가 Visual Studio 가 아닌, 블렌드를 실행시키라는 진정한 의미입니다.
즉, 개발과 그래픽 디자인이 모두 하나의 툴에서 이루어지는 것입니다.

'Projects' 탭에서 아래 그림처럼 해보시기 바랍니다.
트리 메뉴에서 MainPage.xaml.cs 에서 마우스 오른쪽을 누르시면 됩니다.



위와 같이 실행하면, 별도로 Visual Studio가 실행됩니다.
물론 Visual Studio에서 수정하면, 즉시 블렌드쪽에 결과가 반영이 됩니다.

*.cs 파일을 더블 클릭하면, 블렌드 상에서 바로 수정할 수 있는 창이 실행됩니다. ( 완전 좋다는.... )
*.xaml 파일을 더블 클릭하면, 다시 디자인 폼 수정 상태로 이동할 수 있습니다.



실행은 다음과 같이 수행합니다.








이번 베타버전에서는 빌드 성능도 꽤 많이 좋아졌습니다.
에뮬레이터 모양도 굉장히 예뻐졌습니다..^^


WM7 개발에 들어가기전에

Windows Mobile 7 2010. 6. 28. 18:34 Posted by 알 수 없는 사용자

WM7을 제대로 공부할려고 하다보니, 제가 WM7을 제법 잘못 알고 있다는 것을 알게 되었습니다. 그래서 저 같은 분들을 위해서, 실제로 WM7 개발을 시작하기 전에 간단하게 정리를 한번 할려고 합니다.

먼저 설치 환경입니다.

 OS  Windows Vista 이상
 Tools  Visual Studio 2010 express for windows phone CTP
- 기존에 visual Studio 2010 다른 버전을 설치하지 마시길 권장합니다.
 Language  1. Silverlight
2. XNA Framework

 Native는 불가능하고 위의 두 가지를 이용할 수 있습니다. 일반 어플은 Silverlight를 게임은 XNA 플랫폼을 이용할 수 있습니다.(전, Silverlight 닮은 꼴인줄 알았는데 그냥 Silverlight 입니다. 즉, C,C++ Native 개발자보다, Silverlight를 아는 사람이 더 개발에 유리합니다.)
 Hardware Spec  1. 800x480 WVGA
2. 4-point multi-touch screen
3. Direct-X 9 Support
4. A-GPS, accelerometer, compass, light, proximity
   , phone’s location Service, Digital Camera
5. Start, Search, Back Button
6. 3G and Wi-fi
7. over 256MB RAM, over 8GB flash Storage

원래 Windows Moblie 의 특징은 (정확히는 CE지만) 크게 하드웨어의 제약을 주지 않았지만, WM7 부터는 WM7로 인증을 받기 위해서는 하드웨어의 제약이 생겼습니다. 그리고 프로그램 설치도, MS 마켓을 통해서도 개발이 가능합니다.

 이런 부분들이 WM7의 장점이 될지, 단점이 될지는 아직 알 수 없지만, WM7의 기본 UI,UX 나, 개발 환경은 역시 MS 다 라는 생각이 들게 해주는 것 같습니다.

그럼 다음 부터는 실제 WM7 어플을 간단하게 만들어가보도록 하겠습니다. 


시작하면서

 현재 스마트폰 모바일 환경은 굉장히 다양하고, 다이나믹 하다고 해야할까요? 현재 인기도로 봤을 때 크게 3개의 플랫폼이 시장에 존재하고 있습니다.

iPhone, Android, Windows Mobile 이 그 세 종류입니다.


 이, 세 플랫폼을 모두 개발해본 경험으로 말하자면, 현재 위의 3종류 플랫폼중에서는 Windows Mobile 이 가장 떨어집니다. 단순하게 비교하면 다음과 같습니다.

생산성 : iPhone > Android > Windows Mobile

디버깅 : Windows Mobile > iPhone > Android

단, 디버깅의 경우는 Windows Mobile 이 가장 높지만, 개발의 생산성 면에서 다른 두 플랫폼 보다 많이 떨어지기 때문에, 합쳐서 본다면 가장 떨어진다고 볼 수 있습니다.

 그렇다면, Windows Mobile을 왜 배워? 라는 질문이 나올 듯 합니다. 먼저, 위에서 비교한 Windows Mobile은 6.5 까지 입니다. 즉, Windows Mobile 7에서는 위의 결과는 다를 수 있다는 것입니다.

 또한, 제가 보는 Windows Mobile 7의 최대 장점은, 하나만 개발하면 적은 노력으로, Windows, Windows Mobile 7, XBox 360 에 서로 돌아갈 수 있기 때문입니다.

Windows Mobile 7 입문

결론부터 말하자면, 7.0 전에 Native로 WindowsMobile을 개발하던 개발자가, WindowsMobile 7.0 개발을 할려고한다면, 한마디로 “헉” 하는 소리가 나오게 됩니다.

무엇보다. 사용하던 언어자체가, C/C++ 에서 WPF 기반의 C#으로 바뀌게 되면서, xaml 을 알아야만, 개발을 할 수 있게 됩니다. 그래서, 초반에는 꽤 많은 삽질과, 적응이 필요하게 됩니다.

 

그렇다면, 개발 자체는 더 불편하게 된 것일까요?, 여기에 대해서는 도리어 WindowsMobile 7.0 개발환경이 더 발전되었다고 말할 수 있습니다. 새로운 학습이라는 큰 문제가 생기기는 했지만, WindowsMobile 6.5까지 Native로 개발하시던 분들에게는 UI 등, 각각의 기능 개발에 들어가던 많은 잡일들이, xml 환경으로 간단하게 수정이 가능하게 되었습니다.

개인적으로 WindowsMobile 개발에서 가장 불만이 많았던 부분도, UI 개발에의 불편함이었습니다. 그런 부분이 해결이 되었다고 할까요?

그러나, WindowsMobile 7.0 이상부터 만나게 되는 xaml 역시도 처음에는 꽤 많은 학습이 필요합니다.

앞으로, 저와 함께, WindowsMobile 7.0 개발로 뛰어들어가 보실까요?

제일 먼저 만나게 되는 것은 xaml을 이용해서 UI를 만드는 부분입니다.(6.5까지 Native 로 개발하시 던 분들에게는 거의 노가다와 다름없었던 UI 개발부분이 xml을 통해서 쉽게 구현되도록 바뀌었습니다.)

 

xaml을 수정하면 바로 변경된 UI를 보실 수 있습니다. 다음은 단순히 xaml의 일부 코드를 붙여넣기로 추가한 형태입니다. 바로 UI가 바뀐 모습을 보실 수 있습니다.

 

그리고 오류가 있다면, 바로 오류 부분을 알 수 있습니다.

 Native 개발자가 보기에 일단, 최고의 변화중에 하나는 이 UI 개발 부분이 아닐까 하는 생각이 듭니다.

결론

 간단하게 정리하자면, Windows Mobile 7 는 공부 해 볼만한 이유가 상당히 많은 플랫폼이라는 것입니다. 앞으로는 차근 차근 Windwos Mobile 7을 함께 공부해보도록 하겠습니다. ^^