Windows 8 store app - xaml 개발에 사용되는 기술 정리 중

[카키104]

기술 정리 중입니다. 완료된 것이 아니니 참고만 해주시면 되겠습니다. 궁금한 내용은 리플로 남겨주시면 해당 내용에 대한 설명을 추가하도록 하겠습니다. 이 페이지를 스터디 로드 맵 처럼 사용할 예정입니다.

스터디는 총 6개월 정도 예상 하고 있습니다.

1. 기본용어 정리

1) Xaml(제물) :

앱에서 화면을 구성하는 일을 담당합니다.

2) c# :

비지니스 로직과 기능을 담당합니다. 주로 OOP의 개념으로 접근을 하게 됩니다.

3) MVVM pattern : (기존에 사용해 보신 적이 없는 분들은 아마 이 부분이 제일 어려울 것이라 생각됩니다.)

* Model-View-ViewModel의 관계를 사용해서 프로그램하는 패턴으로, 스터디 앱 개발에 기본이 됩니다.

기존프로그램 개발방법과의 차이점에 대해서 미리 숙지를 해주시면 도움이 될 것이라고 생각합니다.

http://kaki104.tistory.com/entry/kaki104-is-using-that-MVVM-pattern

* 스터디를 하는 MVVM 패턴은 별도의 패키지를 사용하지는 않습니다. 하지만, 갈라소프트의 MVVM Light(http://www.galasoft.ch/mvvm/)에서 사용하는 패턴의 일부를 사용합니다. ViewModelLocator

4) LINQ (지연쿼리)

뷰 모델에서 모델을 관리하는 용도로 사용이 됩니다. (LINQ To Object)

비슷한 기능으로 Lambda가 있지만, LINQ는 지연 쿼리이며, 아주 복잡한 쿼리도 만들기가 용이합니다.
http://code.msdn.microsoft.com/101-LINQ-Samples-3fb9811b
http://msdn.microsoft.com/ko-kr/library/bb397933.aspx

5) Lambda Expression‎ (즉시쿼리)

뷰 모델에서 모델을 관리하는 용도로 사용되며, 사용이 간편하여 간단한 경우에 사용합니다.

2. 각 부분별 사용하는 기술정리
각 기술에대한 기본 페이지링크 및 사용셈플링크

1) ViewModelLocator 사용 이유 및 방법

1-1) 타입 네비게이션

스토어 앱의 네비게이션은 타입 네비게이션으로, 뷰가 항상 생성이 되는 구조를 가지고 있다. 그래서, 뷰 모델을 뷰 모델 로케이터에서 생성해 두고, 뷰가 생성된 후 연결해 주는 구조를 가지면 데이터는 그대로 보존이 되어 있기 때문에 새로 받아올 필요가 없게된다.

1-2) 바인딩

뷰에서 바인딩을 할 때 기본적으로는 DataContext에 있는 뷰 모델과 바인딩을 하지만, 다른 뷰 모델의 데이터를 바인딩을 해야하는 경우 StaticResource로 만들어져 있는 뷰 모델 로케이터를 이용한다.

2) 전체 앱 개발 단계
2-1) 기획 - 기존 서비스를 이용할 것인지(OpenAPI 사용), 신규 서비스를 만들것인지(WebAPI 등의 서비스 개발)
2-2) 디자인 설계 - 전문 디자이너가 있으면 좋치만.. 스터디는 일단 시작하고 생각 (Blend를 다룰 수 있으면 좋음)
2-3) 코딩 - 기본적인 뷰, 뷰모델, 모델을 이용해서 디자인 타임에서 보여지도록 만든 후 런타임에서도 동작이 되도록 세부적으로 다듬는다.
2-4) 디자인 적용 - 여러가지 템플릿을 수정해서 디자인 적용(기본 컨트롤의 템플릿들을 사용해서 작업한다.)
2-5) 테스트 - Kit을 이용해서 기본 테스트(앱을 스토어에 올리기 전에 필수 체크)
2-6) 앱스토어 승인요청 - 개발자 등록을 하고 앱스토어에 등록 요청

* 스토어 등록 관련 내용
http://kaki104.tistory.com/entry/Windows-8-Store-app-registing
2-7) 앱스토어 등록완료 - 버전업, 관리 모드

3. 코딩의 일반적인 단계 ( 필자 기준 작성 )

셈플 제작 동영상 참고

4. 코딩시 사용되는 용어 및 설명

4-1) App.xaml :

앱의 시작을 담당한다. 매우 중요한 파일 중 하나임

4-2) Type 네비게이션 :

페이지와 페이지를 이동하는 네비게이션이 특정 파일을 지정하는 것이 아니라 그 페이지의 타입을 넘겨주면 네비게이션 동작이 이루어 진다. 이 것은 모든 화면은 네비게이션 될 때 새로 만들어지고, 네비게이션 백이 될때도 새로 만들어 진다는 것을 의미한다.

-> ViewModel의 상태를 계속 유지하기 위해서 ViewModelLocator를 이용해서 한번 인스턴스 한 후 사용한다.

4-3) 데이터 관련
* 점진적 조회기능

컨트롤에서 스크롤을 하면 다음 데이터를 조회하도록 구현한 예제인데..현재는 CommonILC를 만들어서 사용 중
http://kaki104.tistory.com/entry/ISupportIncrementalLoading-Sample

* 데이터의 로컬 스토리지에 저장/복구

셈플에서 제공하는 저장 복구 기능을 사용하는 방법
http://kaki104.tistory.com/entry/Metro-style-app-data-save-in-app-local-folder-Windows-8-RP

4-4) Converter (컨버터) :

모델의 데이터를 실제로 변경하지 않고, 화면에 다른 형태나 내용으로 표시할 수 있도록 하는 것

셈플 제작 동영상 참고

4-5) Encoding(인코딩) :
Text file encoding
http://kaki104.tistory.com/entry/Text-file-encoding-sample

4-6) XElement(엑스엠엘엘리먼트)

4-7) Portable Class Library

* 스토어 앱이 아닌 WPF나 WP에서도 라이브러리를 함께 사용할 수 있음(스터디의 범위에는 포함하지 않음)

* Portable Class Library와 MVVM
http://kaki104.tistory.com/entry/Using-MVVM-Pattern-in-Portable-Library

* Portable Class Library Tip
http://kaki104.tistory.com/entry/Portable-Class-Library-Tips

4-8) 필자가 사용하는 Nuget Package 모음

* VS2012에서 제공하지 않는 여러 라이브러리를 사용할 수 있다.
http://kaki104.tistory.com/entry/Recommend-Nuget-Packages

4-9) Debuging 팁

* VS2012에서 디버깅을 할 때 유용한 팁
http://kaki104.tistory.com/entry/Visual-Studio-2012-Debuging-tip

4-10) .Net 4.5 팁
http://kaki104.tistory.com/entry/Windows-8-Net-45-tips

5. 컨트롤의 디자인적인 요소 수정
Control Style(컨트롤스타일) :
ItemTemplate(아이템 템플릿) :
ItemsPanel(아이템패널) :
ItemContainer(아이템컨터이너) :
TemplateSelecter(텀플릿셀렉터) :

6. 사용자 정의 컨트롤, 팝업
Popup sample
http://kaki104.tistory.com/entry/InputPanel-using-Popup-sample

7. 앱의 기능 추가
7-1) 검색
7-2) 설정참
7-3) Live-Tile(백그라운드테스크)

* Live-Tile 만들기
http://kaki104.tistory.com/entry/Tile-BackgroundTask-LiveTile

* 백그라운드 파일 다운로드
http://kaki104.tistory.com/entry/BackgroundDownloader-Sample-Windows-8-RP

8. 확장 기능(기본 앱을 만든 후 추가 하면 좋은 기능 들)
8-1) Custom Behavior
http://kaki104.tistory.com/entry/Custom-Behavior-Sample

8-2) File base database ( 앱에서 로컬 db를 사용 할 예정이라면 SQLite와 함께 고려 해본다)
http://kaki104.tistory.com/entry/WinRT-File-Based-Database-sample

8-3) 다중언어 제공 앱개발
http://kaki104.tistory.com/entry/Create-multi-language-support-app-Multilingual-App-Toolkit-Windows-8-RP

9. 기본 컨트롤 활용

GridView item dragdrop
http://kaki104.tistory.com/entry/GridView-item-dragdrop-move-sample

 

[퓨전마법사]

커억~~~ 저걸 다 알아야 스터디 듣을 자격이 생기는건 아니겠죠? 덜덜더덜..

[카키104]

위의내용들을 공부하는것이 스터디의 목표입니다. 단계적으로 준비를하도록 하겠습니다. 그리고 리스트의 완성은 아직한참후에나 가능할것 같은데용

[닷넷디벨]

WPF 의 그 XAML 이라면 의외로 적응하시기 쉬우실지도 몰라요

[카키104]

Wpf, silverlight개발경험이있으시면 접근하시기는 좋습니다.

[스이]

우와.. 멋지십니다. 로드맵일라니...

[로엔그린]

흥미 진진해요 ^^. .아는 것도 있고 잘모르는것도 있고.
스킬 증진에 좋을것 같아 기대 됩니다.
(작심삼일로 안끝났으면 합니다. 나 자신을 이겨라~! ㅠㅠ)