안녕하세요, 이재웅입니다.
오늘 새로운 WPF 튜토리얼 영상을 업로드했습니다.
SmartDate는 DatePicker 컨트롤과 같은 데이트 셀렉터 기능을 CustomControl 구조로 구현합니다. 내부적으로도 복잡한 템플릿 요소들을 어떻게 CustomControl 방식으로 처리하는지 자세하게 나와 있으니 한번 흥미 있게 살펴보시면 좋을 것 같습니다.
자세한 기술적인 리뷰도 닷넷데브 Slog를 통해 공유 해보도록 하겠습니다.
언제가 될지…
튜토리얼 소개
WPF SmartDate 튜토리얼은 영상과 GitHub 레포지터리를 통해 소스코드로 제공되며, Code Project, 커뮤니티, 페이스북, 블로그 등을 통해 학습 내용과 소식을 자세하고 풍부하게 제공하기 위해 노력하고 있습니다.
- YouTube: 영어 음성, 한글 자막
- BiliBili: 중국어 음성
- GitHub: 소스코드, README.md 제공
- Code-Project: 프로젝트 리뷰 승인 대기 중.
Overview
이번 영상은 ThemeSwitch로 시작해 어느덧 다섯 번째 WPF 튜토리얼 시리즈에 이르렀습니다. 그동안 Button, Slider, ListBox와 같은 ContentControl 및 ItemsControl에서 파생된 단일 또는 계층 형태의 템플릿 기반 컨트롤에 대한 내용을 주로 다루었으나, 이번에는 DatePicker처럼 복합적인 기능을 구현하기 위해, 보다 복잡한 내용을 다루게 됩니다. 따라서 이번 시리즈는 기존 영상들보다 난이도가 높아 고생의 여정이 될 것입니다.
하지만 전혀 걱정할 필요 없습니다. 이 튜토리얼 영상은 여러 번 반복해서 학습할 수 있도록 모든 과정의 순서와 내용, 그리고 설명 구성을 신경 써서 준비했습니다. 단지 익숙해지고 숙련될 때까지 반복하면 됩니다.
WPF SmartDate
WPF가 생겨난 지 20년 가까이 된 지금까지도 Template을 포함하는 Control, ContentControl, ItemsControl에서 파생된 대부분의 컨트롤들은 클래스와 인터페이스, 제공되는 Dependency Property 속성까지 크게 부족함 없이 널리 사용되고 있습니다. 이는 WPF의 설계가 매우 정교하게 이루어졌음을 보여줍니다. 특히 WPF의 Template과 계층에 특화된 설계 구조는 Button, ComboBox, ListBox 등의 대부분 컨트롤과 잘 어울립니다.
하지만 DatePicker와 같이 기능적으로나 내부적으로 복잡하고 세부적인 커스터마이징을 요구하는 컨트롤의 경우, 기본으로 제공되는 컨트롤의 한계를 느낄 수밖에 없었습니다. 이전 튜토리얼 영상에서 다룬 Riot Slider는 Slider 컨트롤의 기능이 단조롭고 Template 구성이 간단하여 기본으로 제공되는 Template 구조를 분석하고 커스터마이징하는 것이 의미 있는 방식이었습니다. 반면, DatePicker는 내부적으로 여러 동작과 단계를 거치며 작은 애플리케이션처럼 동작하는 구조로, 기본 Template 구조를 추출하고 분석하는 것은 매우 고된 작업이 될 것입니다. 그리고 이는 WPF의 연구와 분석적인 면에서 볼 때 훌륭한 학습 훈련이 될 것입니다.
만약 여러분이 DatePicker 기본 컨트롤의 구성을 분석하고 연구하려 한다면 이는 매우 좋은 접근입니다. 더불어 이번 튜토리얼 영상에서 다루는 SmartDate 컨트롤 방식을 함께 살펴보시는 것을 권합니다. 이번 영상의 주요 과정과 내용은 다음과 같습니다.
| 순서 | 주요 작업 | 주요 내용 요약 |
|---|---|---|
| 1 | WPF Application | 프로그램 시작 진입 구조 생성 및 Application 인스턴스 생성, 실행 Run() |
| 2 | WPF Class Library | CustomControl 기본 구조 구성: AssemblyInfo.cs, Generic.xaml, CustomControl |
| 3 | SmartDate | DatePicker를 대체하는 Control로부터 파생된 CustomControl |
| 6 | CalendarSwitch | SmartDate 컨트롤의 팝업 스위칭을 담당하는 ToggleButton으로부터 파생된 CustomControl |
| 7 | Popup | 캘린더 달력을 감싸는 기본 컨트롤 구성 |
| 4 | CalendarBox | 달력의 날짜를 표현하는 ListBox로부터 파생된 CustomControl, ItemsPanelTemplate을 통해 ItemsPresenter의 Container 형태를 UniformGrid로 지정, ControlTemplate 내부에 ItemsPresenter 외에 달력 이동 버튼 등 포함 |
| 5 | CalendarBoxItem | CalendarBox의 ItemsContainer에 해당하는 ListBoxItem으로부터 파생된 CustomControl |
| 7 | ChevronButton | 이전 달, 다음 달로 이동하는 Button으로부터 파생된 CustomControl |
| 8 | DayOfWeek | 월/화/수/목/금/토/일 요일을 표현하는 Label로부터 파생된 CustomControl |
주요 작업들을 살펴보면 SmartDate 뿐만 아니라 그 안의 하위 컨트롤에서도 CustomControl이 사용되는 것을 볼 수 있습니다. 이러한 설계는 WPF의 CustomControl 설계의 철학을 엿볼 수 있는 좋은 예시입니다.
이번 튜토리얼 영상을 통해 CustomControl의 세부적인 구현에 대해 자세하게 이해할 수 있기를 바라며, Template 개념에 대해 좀 더 자세한 선행 학습이 필요한 경우, 이전 영상인 RiotSlider 튜토리얼 영상을 먼저 학습해 보시기를 바랍니다.
소통 및 응원하기
언제든지 소통하기 위한 채널을 다양하게 열어두고 있습니다.
- GitHub: 팔로우(Follow), 포크(Fork), 별(Stars) 받기
- YouTube, BiliBili: 좋아요, 댓글, 구독, 공유
- Facebook, 이메일: james@jamesnet.dev
오리지널 튜토리얼 시리즈
튜토리얼 시리즈는 지금까지 총 5편이 공개되었습니다.
| No. | Platform | Title | YouTube | BiliBili |
|---|---|---|---|---|
| 1 | WPF | Theme Switch |  Link |
Link |
| 2 | WPF | Riot PlayButton | Link |
Link |
| 3 | WPF | Magic Navigation Bar | Link |
Link |
| 4 | WPF | Riot Slider | Link |
Link |
| 5 | WPF | Smart Date | Link |
Link |
여섯 번째 영상 예고
다음으로 준비 중인 여섯 번째 튜토리얼 영상은 의존성 주입과 CustomControl을 포함하여 프로젝트 분산화를 통해 구현하는 작은 WPF 프레임워크 애플리케이션이 될 것입니다.
기여자 소개
구양(Vicky)과 이재웅(James)은 한국과 중국에서 활동하고 있는 개발자 부부입니다. 주제 선정, 샘플 소스코드 준비, 애플리케이션 구현 과정 녹화, 영어/중국어 더빙, 한국어 자막, 영상 편집, 썸네일과 영상 업로드까지 모든 과정을 직접 해나가고 있습니다. 저희는 본업으로 개발을 하고 있기 때문에 때로는 업로드가 늦어지기도 합니다. 그러나 이 일에 재미와 사명감을 느끼고 있어 행복하게 즐기며 하고 있습니다.
아이디어 & 의견
새로운 튜토리얼 주제, 아이디어 및 의견들을 언제나 기다리고 있습니다!