[WPF] MVVM 패턴으로 WPF 시작하기 - 01 프로젝트 만들기

WPF 시리즈 포스팅을 진행하고 있습니다. 아래 링크를 클릭하시면 연관된 다른 포스트들을 보실 수 있습니다.

 

목록

  1. MVVM 패턴으로 WPF 시작하기 - 02 UI 구성 (Grid, ListView, StackPanel)
  2. MVVM 패턴으로 WPF 시작하기 - 03 ViewModel 구성
  3. MVVM 패턴으로 WPF 시작하기 - 04 Textbox와 ComboBox
  4. MVVM 패턴으로 WPF 시작하기 - 05 Converter

안녕하세요 오늘부터 WPF 프로젝트를 하나 만들어 볼까 합니다.

 

한국은 아직 WPF가 유명하지않아 사람들에게 빛을 못 바라고 있는데 조금이라도 기여하기 위해 글을 작성해보도록 할게요.

 

먼저 WPF를 시작하기 앞서 WPF에 대한 정의를 한번 보고 갈께요.

 

    WPF란?
  • WPF(Windows Presentation Foundation) Microsoft사에서 2006년에 개발한 데스크톱 클라이언트 애플리케이션을 만드는 UI 프레임워크입니다. 
  • WPF를 사용하면 시각적으로 뛰어난 사용자 환경을 통해 Windows용 데스크톱 클라이언트 애플리케이션을 만들 수 있습니다.

 

닷넷이 현재 7.0 (C#11)까지 진입하면서 WPF에도 사실 많은 업데이트가 되었는데요, 여러 윈도우 프로그램 프레임워크들(Qt, MFC, Java Swing 등)이 존재하지만 (요즘은 파이썬으로도...) 제 생각엔 WPF가 가장 윈도우스럽고 안정되며 세련된 UI와 프로그램을 만드는데 최고라고 생각합니다. <- 제 주관입니다.

 

오늘부터는 WPF의 장점중 하나인 MVVM 패턴을 활용하여 간단한 WPF 어플리케이션을 만들어 보도록하 겠습니다.

 

MVVM (Model - View - ViewModel) 패턴은 WPF에서는 빼놓을 수 없는 룰입니다. 이것때문에 참 간단하면서도 복잡하기도 도 한데 그래도 다른 매력을 제 윈도우 개발을 즐겁게 해주는거 같아 너무 좋아요.


최종적으로 회사 임직원 정보를 표기하는 간단한 프로그램을 만들어 보도록하겠습니다

 

 

 

 

1. 프로젝트 만들기

먼저 Visual Studio를 켭니다. (Visual Studio 2022 기준)

 

 

"새 프로젝트 만들기"를 클릭해주세요.

 

 

검색창에 WPF를 입력해주시고 "WPF 애플리케이션"을 눌러주세요.


여기서 잠깐!

이 두개의 차이를 아시나요?

 

첫번째 "WPF 애플리케이션"은 .NET 6.0, .NET 7.0 그리고 .NET Core 3.1을 지원하는 프로젝트이며

두번째 "WPF 앱(.NET Framework)"는 .NET Framework 4.8 이하 버전들을 지원하는 프로젝트입니다.

 

즉, 첫번째가 최신 닷넷을, 두번째는 옛날 닷넷을 지원한다고 보면되겠네요.

 

저희는 2023년이니 최신 닷넷을 사용하도록 하겠습니다.


프로젝트 이름을 "MyFirstWPFApp"으로 하시거나 여러분이 원하시는 이름으로 만들시고

위치도 지정해 줍니다.

 

 

프레임워크도 .NET 7.0으로 선택해주시고 다음을 눌러주세요.

 

 

그러면 이렇게 프로젝트가 생성이 완료되었습니다.

 

 

2. 프로젝트 살펴보기

  • 솔루션 탐색기

솔루션 탐색기에서는 현재 솔루션에 등록된 프로젝트에 대한 정보들을 볼 수 있으며 각 프로젝트의 구조들을 살펴 볼 수 있습니다. 

 

( * 솔루션은 프로젝트들을 담는 하나의 큰 프로젝트입니다. 프로젝트들의 프로젝트라고 보면 되겠네요)

 

  • 솔루션 탐색기 파일 구성

파일 구성을 설명하기 전, C# 프로젝트에서 가장 많이 사용하는 마크업 파일인 XAML(자믈)을 살펴볼게요.

  • xmal이란?
    - Extensible Application Markup Language의 약자입니다.
    - MS에서 개발한 XML 기반의 언어이며 WPF, Xamarin, UNO에서 사용하는 UI 인터페이스 객체 (Window, Button, Grid 등)을 XML 형태로 정의하였습니다.
    - 웹 페이지에서는 HTML을 사용하여 시각적 표현을 사용한다면, 닷넷 기반의 응용 프로그램에서는 XAML을 사용합니다.
    - XML 태그를 사용하여 디자이너가 직접 UI를 구성할 수 있으며, 로직을 담당하는 부분과 분리할 수 있습니다.
    - 필수로 필요한 파일을 아니며, C#만 사용하여 웹 어플리케이션을 개발할 수 있습니다.
    - XAML을 사용하여 애니메이션 구현할 수 있고 이벤트 트리거를 추가로 구현하여 응답하도록 구성할 수 있습니다.
    - WPF는 벡터 방식 이미지를 지원하며, 크기를 변경시켜도 계단현상이 발생하지 않습니다.

 

App.xaml

   - 현재 프로젝트의 시작점이 되는 xaml파일이며, 리소스들을 미리 선언하여 관리하는 곳입니다. App.xaml.cs 파일 코드 비하인드를 사용하여 동적으로 제어할 수 있습니다.

 

MainWindow.xmal

   - 현재 프로젝트의 메인 화면 xaml 파일이며, MainWindow.xmal.cs 파일 코드 비하인드를 사용하여 동적으로 제어할 수 있습니다.

 

AssemblyInfo.cs 

   - 해당 프로젝트의 어셈블리 정보를 포함하고 있습니다. 보통 특별한 상황 아닌 이상, 이 파일은 건드리지 않습니다.

 

종속성

   - 현재 프로젝트에서 참조하는 라이브러리 혹은 다른 프로젝트를 표시하고 있습니다.


오늘은 WPF 프로젝트를 만들어 보았습니다.

다음 포스팅때 MVVM의 뼈대인 UI를 구현하는 시간을 가져보도록 하겠습니다~