UWP 본격 탁상시계 만들기1

윈도우 폰을 뭔가 유용하게 사용하기 위해 앱을 하나 만들기로 하였습니다.

가장 쉬운게 시계 만들기지요 ㅎㅎ

결국 최종으로 만들 앱은 아래의 앱 입니다.



화면에 큼지막하게 날짜 시간 날씨가 표시되는 매우 간단한 앱이지요..

각 단계별로 해당 앱을 만들기 위한 방법을 설명합니다.


0. Visual Studio를 실행하고 UWP 프로젝트를 생성합니다.




1. 날짜, 시간 표시를 위한 라벨 UI에 추가 하기



 MainPage.xaml (메인뷰)에 날짜를 표기할 TextBlock 두개를 추가 합니다.

도구 상자를 통해서 드래그 해서 추가하거나 직접 입력하여 추가 할 수 있습니다.


2. 타이머 추가하기

기존에 C# 네이티브 개발을 하셨다면 Windows.Forms의  Timer를 사용하시거나Thread 쪽 타이머를 사용하셨겠지만 Windows RT Framework 에서는 이를 사용할 수 없습니다.

Windows RT 에서는 DispatchTimer라는 타이머 클래스를 제공합니다.

MainPage.xaml.cs 파일을 열어 생성자에 Loaded / UnLoaded이벤트를 추가 합니다.
이는 메인페이지가 로드 되었을때 라벨에 날짜 텍스트를 뿌려주기 위함입니다.




이벤트 핸들러를 작성합니다.

Loaded 이벤트에 코드를 추가 합니다.




Timer tick 이벤트를 추가 합니다.



날짜와 시간을 아까 생성했던 텍스트 라벨에 뿌려 주도록 코딩합니다.




Unloaded 이벤트에 타이머를 정지하도록 코딩합니다.

윈도우 폰을 연결하고 F5키를 누르면 자동으로 배포되어 자동으로 실행 됩니다.

UWP 플랫폼 이해

새로운 플랫폼에서 개발하기 위해서는 해당 플랫폼의 기본적인 이해가 필수이다.

해당 플랫폼에 대해서 완전히 이해 하기 위해서는 이것만으로도 매우 많은 포스팅이 이루어 져야 하겠지만
개발을 시작하는 입장에서 모든것을 알고 시작할 필요가 없기 때문에

필수로 봐야 할 부분만 추려서 설명해 본다.



1. 플랫폼 블럭 다이어그램



대부분의 새로운 플랫폼 설명 프리젠테이션에 빠지지 않는 부분이 해당 플랫폼의 블럭 다이어그램이다.

블럭 다이어그램을 꼭 보아야 하는 이유가 전반적인 플랫폼의 구조를 알 수 있기 때문이다.
이는 모바일이나 기타 개발뿐이 아니라 순수하게 윈도우프로그래밍 부분도 마찬가지이다.

윈도우 10 PC의 경우 기존의 윈도우 네이티브앱(레거시앱)과 윈도우 스토어 앱이 둘 다 실행가능하다.
UWP 플랫폼의 좌측에는 기존의 네이티브앱의 각각의 런타임 및 개발 플랫폼이 나와있고
UWP의 윗쪽에 위치한 부분들이 UWP프로그램의 플랫폼에 대해서 설명하고 있다.



2. 라이브 사이클


여느 모바일 플랫폼과 비슷한 라이프 사이클을 가집니다.



3. UI



마이크로 소프트가 WPF시절부터 밀고 있는 Xaml 형식의 View를 통해서 UI 를 작성할 수 있습니다.
마소가 밀고 있는 부분이 MVVM 패턴을 잘 알고 있다면 바로 이해 하실 수 있을 것입니다.
마소는 예전부터 MVC 패턴을 변형하여 데이터 바인딩이라는 개념을 적용하여 Model View ViewModel
패턴을 적용하여 UI 부분을 코드에서 분리하고자 하는 노력을 기울여 왔습니다.

이는 안드로이드에서도 XML 형식으로 UI 와 비즈니스 로직을 분리하고자 하였습니다.
이는 애플의 앱에서도 마찬가지 입니다. Xcode 의 경우는 스토리 보드 개념을 적용하여 조금 더 앞선 모습을 보여 줍니다.

과거에는 blend라는 툴을 통하여 디자이너로 하여금 UI 를 직접 개발 할 수 있도록 제공하였지만
이는 비쥬얼스튜디오 2015에 통합되었습니다.

 xaml 을 전혀 모르신다면 간단히 말해서 Html과 유사하다고 생각하시면 됩니다. 어짜피 마크업 랭귀지 이니까요... 대략 이걸 사용하신다고만 알고 계신면 됩니다.



제대로된 개발 입문을 하기 위해서는 microsoft에서 운영하는 Virtual Academy를 참고 하기를 추천합니다.

https://mva.microsoft.com/

UWP App 개발 환경 구축

UWP app 개발하기 위해서는 windows 10 가 설치된 pc 와 visual studio가 필요하다.

visual studio는 community edition 을 사용하면 무료로 설치 가능하므로

부담 없이 사용 할 수 있다.. 

전통적으로 마소는 모바일 개발자의 진입 장벽을 해소하기 위해

Express edition을 무료로 제공해 왔지만 몇년전부터는 Professional 기능을 완전히 포함하는

커뮤니티 에디션을 배포한다.

개발툴 설치 이외에는 매우 간단한 설정한 해주면 된다. 개발자 모드 설정만 하면 모든게 완료된다. 

휴대폰 설정

설정 -> 업데이트 및 보안 -> 개발자용-> 개발자 모드를 선택한다.

PC 설정

설정 -> 업데이트 및 복구 -> 개발자용 -> 개발자 모드 선택

개발한 앱 배포를 위해 진행하다보니.. 휴대폰 전용으로 앱을 개발하여도 PC 자체도 개발자 모드로 설정해야 한다는 점이 다소 이상하지만 사실 저 설정은 설치 가능한 앱의 서명과 관련한 부분으로 보이는데..

정작 실행되는 휴대폰이 아닌 피씨 자체에도 저 설정을 하지 않으면 안되는 이유를 모르겟지만..

앱 자체에 테스트용 서명을 하기 위함이 아닌가 싶다. 게다가 에뮬레이터를 쓰면 필요할 테니까..

UWP(Universal Windows Platform) 앱

윈도우 10 버전이 출시되면서 마이크로 소프트는 PC와 타블렛 휴대폰 XBOX 통합 플랫폼 형식의
스토어 운영 및 개발 플랫폼을 출시 하였는데 (사실 윈8 부터 시작했으나 플랫폼을 다시 갈아엎음)
이는 마이크로소프트의 다양한 플랫폼 대응의 전략 중 하나로 생각된다.

사실 이는 오래전부터 (서피스 프로 / RT 준비 시기) 부터 진행 중인 전략인데 이를 위해
마이크로 소프트는 기존의 Windows CE 기반의 임베디드 플랫폼과 PC플랫폼 으로 구분되던 카테고리를
윈도우 10 에 모두 포함시키고 (에디션별 구분으로 나눔) 각 플랫폼별 특성에 맞는 서브 버전을 제공한다.

기존에 CE 플랫폼은 윈도우 10 IOT 버전으로 계승되는듯하며, 이를 확장한 모바일 버전과 arm 버전을
거의 포기한 저전력 x86 위주의 윈도우 타블렛 시리즈, 울트라북 수준의 Cpu를 장착한 2 in 1 계열 타블렛과 노트북 또는 데스크탑 으로 나뉘어 지는 듯 하다.

윈도우 8 시절부터의 소비자들은 잦은 정책 변화와 플랫폼 변경으로 민심을 잃었지만 (마소의 뒤통수) 
개발자 입장에서는 개발하기 편한 부분이 있다.  Visual studio , c# or javascript or c++ 사용 가능 등

기존의 윈도우 개발자가 다소 익숙한 환경에서 개발할 수 있다는 장점이 있다.

루미아 640을 이용하여 탁상 시계 앱을 만드는 과정을 작성할 예정이다.

Windows 10 phone 구입

AT&T에서 windows 10 시장 확대를 위한 모바일폰 폭풍 세일이 시작되었는데
가장 유명한 폰이 바로 루미아 640모델이다.
29.9 불에 판매중인 이 모델은 스냅드래곤 400 프로세서에 1기가 램, LTE를 지원한다.
화면은 720p IPS 디스플레이이다.

마케팅 비용이 포함되었겠지만 이 가격에 이 성능에 이 완성도라니...

장난감으로 이만한게 없으리라... 딱히 쓸 용도가 없으면 탁상시계로 써도 충분