C#을 활용한 Windows Forms와 WPF 애플리케이션 만들기 🖥️✨

반응형

C#은 강력한 UI 개발 프레임워크를 제공하여 데스크톱 애플리케이션 제작을 쉽게 만들어줍니다. 이번 포스팅에서는 Windows Forms와 **WPF (Windows Presentation Foundation)**를 활용한 UI 개발 방법을 살펴보겠습니다. 특히 실무에서 자주 활용되는 데이터 바인딩과 MVVM 패턴까지도 알아보세요! 🚀

---

1. Windows Forms 기본 구성 🏗️

Windows Forms는 간단한 UI를 빠르게 개발할 수 있는 C#의 전통적인 프레임워크입니다.

첫 번째 Windows Forms 애플리케이션 만들기 💻

using System;
using System.Windows.Forms;

public class MainForm : Form
{
    public MainForm()
    {
        // 폼의 제목 설정
        Text = "Windows Forms Example";

        // 버튼 생성
        Button button = new Button();
        button.Text = "Click Me!";
        button.Location = new System.Drawing.Point(50, 50);

        // 버튼 클릭 이벤트 핸들러 등록
        button.Click += (sender, e) => MessageBox.Show("Hello, Windows Forms!");

        // 폼에 버튼 추가
        Controls.Add(button);
    }
}

public static class Program
{
    [STAThread]
    public static void Main()
    {
        Application.EnableVisualStyles();
        Application.SetCompatibleTextRenderingDefault(false);
        Application.Run(new MainForm());
    }
}

위 코드는 간단한 Windows Forms 애플리케이션을 보여줍니다. 버튼 클릭 시 메시지 박스가 표시됩니다. ✨

---

2. WPF로 UI 개발하기 🎨

WPF는 Windows Forms의 진화된 형태로, 데이터 바인딩, 스타일링, 애니메이션 등 더 강력한 기능을 제공합니다.

첫 번째 WPF 애플리케이션 만들기 🌟

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="WPF Example" Height="200" Width="300">
    <Grid>
        <Button Content="Click Me!" HorizontalAlignment="Center" VerticalAlignment="Center" Click="Button_Click"/>
    </Grid>
</Window>

using System.Windows;

namespace WpfApp
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Hello, WPF!");
        }
    }
}

위 코드는 XAML과 C# 코드를 사용하여 버튼 클릭 시 메시지를 표시하는 기본적인 WPF 애플리케이션입니다. 😄

---

3. 데이터 바인딩과 이벤트 처리 🔗

WPF의 핵심은 데이터 바인딩입니다. UI와 데이터를 효과적으로 연결하여 코드의 복잡도를 줄일 수 있습니다.

데이터 바인딩 예제 🌐

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Data Binding Example" Height="200" Width="300">
    <Grid>
        <TextBox Text="{Binding Path=UserName}" Margin="10"/>
        <TextBlock Text="{Binding Path=UserName}" Margin="10,50,10,10" FontSize="16"/>
    </Grid>
</Window>

using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;

namespace WpfApp
{
    public partial class MainWindow : Window, INotifyPropertyChanged
    {
        private string _userName;
        public string UserName
        {
            get => _userName;
            set { _userName = value; OnPropertyChanged(); }
        }

        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;
        }

        public event PropertyChangedEventHandler PropertyChanged;
        protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

위 예제는 사용자가 텍스트 박스에 입력한 값을 실시간으로 바인딩하여 화면에 표시합니다. 🎯

---

4. MVVM 패턴 소개 🛠️

MVVM(Model-View-ViewModel)은 WPF 개발에서 권장되는 아키텍처입니다. 데이터 바인딩과 명령(Command) 패턴을 활용하여 UI와 로직을 분리합니다.

MVVM 패턴의 기본 구조 🏛️

1. Model: 데이터와 비즈니스 로직을 처리합니다.
2. View: XAML로 정의된 UI입니다.
3. ViewModel: View와 Model 사이의 중간 다리 역할을 합니다.

MVVM 적용 예제 ⚙️

Model:

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
}

 

ViewModel:

using System.Collections.ObjectModel;

public class MainViewModel
{
    public ObservableCollection<Person> People { get; set; }

    public MainViewModel()
    {
        People = new ObservableCollection<Person>
        {
            new Person { Name = "Alice", Age = 30 },
            new Person { Name = "Bob", Age = 25 }
        };
    }
}

 

View (XAML):

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MVVM Example" Height="300" Width="400">
    <Grid>
        <ListBox ItemsSource="{Binding People}" DisplayMemberPath="Name"/>
    </Grid>
</Window>

 

Code-behind:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new MainViewModel();
    }
}

이 패턴을 사용하면 코드의 유지보수성과 테스트 가능성이 크게 향상됩니다! 🏆

---

마무리 🌟

Windows Forms와 WPF는 각각의 장점이 있으며, 프로젝트 요구사항에 따라 적합한 프레임워크를 선택하면 됩니다. 특히 WPF의 데이터 바인딩과 MVVM 패턴은 현대적인 UI 개발에 매우 유용하므로 꼭 익혀두세요! 💡

UI 개발은 사용자 경험을 직접적으로 좌우하는 중요한 요소입니다. 지금까지 배운 내용을 토대로 더 나은 사용자 중심 애플리케이션을 만들어 보세요! 🚀