[C#] WPF를 이용하여 C# 개발하기

 안녕하세요. 진득코딩입니다. 저번 시간까지는 winForm으로 C# 개발을 해왔습니다. 하지만 많은 개발자들이 C#을 개발할 때에 winForm에서 WPF로 넘어가는 추세라고 합니다. 이번 시간에는 WPF를 이용하여 어떤 식으로 C#을 개발하는지 살펴보도록 하겠습니다.

WPF란

 WPF란 Windows Presentation Foundation의 약자로 마이크로소프트에서 2006년에 만든 UI 프레임워크입니다. .NET으로 빌드가 가능하고 Visual Studio에서 작업해야 합니다.

 이제껏 사용하던 WinForm은 실행할 때부터 이미 디자이너 툴이 만들어져 있기 때문에 개발이 쉽고 개발 시간이 짧습니다. 하지만 이미 만들어져 있는 툴을 사용해야하기 때문에 확장성이 떨어집니다. 반면에 WPF은 XAML코드로 자유롭게 코드를 작성할 수 있기 때문에 확정성이 상대적으로 높습니다. 또한 백터 형식 UI로 해상도 변경에 따른 화질 저하가 없습니다. 하지만 WinForm보다는 개발 시간이 좀 더 걸린다는 단점이 있습니다.

MVVM 패턴

 기존에 사용하던 WinForm에서는 spring에서도 사용하는 MVC 패턴을 사용하는 반면에 WPF는 MVVM 패턴을 사용합니다.

 MVC 패턴은 사용자의 action을 controller에서 받아서 Model을 업데이트해서 Model에 데이터를 실어서 View에 갖다주게 되면 View는 Model에 있는 데이터를 꺼내서 화면내 나타내주게 됩니다.

 하지만 MVVM에는 controller가 사라지고 view와 딱 붙어있는 View Model이 생겼습니다. 개발 속도 향상보다는 유지보수 비용 감소에 목적을 두었기 때문에 MVC 패턴을 사용하는 WinForm보다는 개발 속도가 느립니다.

 여기에서 View Model이 View와 Model의 중간에서 데이터를 전달해주는 역할을 합니다. 사용자의 Action은 View로 들어오게 되고 해당 Action은 Command 패턴으로 View Model에 전달하게 됩니다. 해당 Action을 받은 View Model은 Model에 데이터를 요청하게 되고 응답하게 됩니다. View Model은 해당 데이터를 가공하여 저장하면 View가 View Model과 binding하여 화면을 그리게 됩니다.
* 바인딩 : 데이터와 UI 요소 간의 연결을 설정하는 과정

XAML

 XAML은 HTML과 같이 마크업 언어입니다. WPF에서 View를 그리기 위한 언어로 HTML과 같이 태그를 사용합니다.

 HTML과 XML과 비교하면 HTML은 정해진 태그만 사용할 수 있지만 XML은 태그를 직접 제작하여 사용하게 됩니다. XAML은 마이크로소프트에서 개발한 XML이라고 보면 되고 UI와 데이터를 주고 받는 목적으로 사용하는 언어입니다.

wpf 시작하기

 본격적으로 WPF로 프로젝트를 시작해보도록 하겠습니다. Visual Studio에서 프로젝트를 생성하고 WPF를 검색하게 되면 WPF 애플리케이션이라고 나옵니다. .Net 프레임워크 말고 그냥 WPF Application이라고 써져 있는 항목을 선택하고 다음을 클릭해줍니다.

 다음을 누르게 되면 추가 정보가 나오면서 프레임워크의 버전을 선택할 수 있는데 장기 지원중인 .NET 8.0을 사용해주시면 됩니다. 전 시간까지 사용하던 WinForm도 많이 사용하고 있지만 WPF로 넘어가는 추세입니다. WinForm은 4.8버전 이후로 업데이트를 중단하기로 한 것도 WPF에 많이 힘이 실리는 것을 알 수 있습니다.

간단한 애플리케이션 만들어보기

 WPF를 시작하였으니 간단한 애플리케이션을 만들어보도록 하겠습니다. 위 사진은 해당 애플리케이션을 실행하게 되면 나오는 화면입니다. 라디오 버튼과 이미지를 확인하실 수 있습니다.

 햄버거의 사진이 단품으로 변경을 누르면 단품 햄버거의 사진이 나오고 다시 누르면 원래 사진으로 돌아갈 수 있도록 bool타입으로 변수를 하나 선언해두었습니다. 그 이후 각각의 사진의 경로를 담기 위한 변수를 두 가지 선언해두고 생성자의 각가그이 경로를 담아두었습니다.

 Display 버튼에 대해서 먼저 살펴보도록 하겠습니다. Display 버튼이 눌렸을 때의 이벤트에 if문으로 어떤 라디오 버튼이 클릭되어있는지 감지한 후에 메세지박스를 나오게 하였습니다.

 다음으로 단품으로 변경 버튼을 살펴보도록 하겠습니다. 해당 버튼이 눌렸을 때의 이벤트에 대한 메서드에 bool 타입의 변수가 true인지 false인지에 대해서 감지한 후에 버튼과 이미지박스의 사진을 바꿔주도록 코드를 작성하였습니다. 그 이후 bool 타입의 변수를 바꿔주었습니다.

배포해보기

 다음으로는 배포하는 방법에 대해선 살펴보도록 하겠습니다. 먼저 Debug 모드에세 Release로 바꿔주고 실행하게 되면 위와 같이 창이 뜨게 됩니다. 중지를 하게 되면 그냥 배포 파일만 생성되게 되고 디버깅 계속하게 되면 디버깅도 실행하게 됩니다.

 release 모드로 실행하게 되면 해당 프로젝트의 bin을 들어가게 되면 Release 폴더가 추가로 생긴 것을 확인하실 수 있습니다. 해당 폴더를 누르게 되면 위와같이 세개의 파일과 json파일이 들어가있게 되는데 해당 파일들을 압축한 뒤 다른 환경에서 .exe 파일을 실행하게 되면 해당 프로젝트를 실행시키실 수 있습니다. 필자는 프로젝트를 그냥 WPF가 아니라 .NET 프레임워크 버전으로 만들어서 json 파일은 생성되지 않았습니다.

---

 이번 시간에는 다른 개발 환경인 WPF에 대해 살펴보았습니다. WinForm과 비교했을 때 장단점도 있고 MVC 패턴이 아닌 MVVM 패턴으로 개발한다는 것이 인상적이었습니다. 다음 시간에는 WPF에 대해서 좀 더 자세히 살펴보도록 하겠습니다. 끝까지 봐주셔서 감사합니다.😀