오늘은 WPF(Windows Presentation Foundation)를 활용하여 변환기를 개발하는 방법에 대해 알아보겠습니다.
WPF는 마이크로소프트에서 제공하는 GUI 애플리케이션을 개발하기 위한 프레임워크로, 디지털 사용자 인터페이스를 구현하는 데 있어
강력한 기능들을 제공합니다. 이번 강좌에서는 WPF의 기본 개념부터 시작하여 변환기의 기능을 구현하는 과정을 자세히 설명하겠습니다.
1. WPF란 무엇인가?
WPF는 .NET 프레임워크의 일부분으로서, 고급 사용자 인터페이스를 구현하기 위해 사용됩니다.
WPF의 주요 특징 중 하나는 XAML(Extensible Application Markup Language)을 사용하여 UI를 정의할 수 있다는 점입니다.
XAML을 사용하면 UI 구성 요소들을 직관적으로 기술할 수 있으며, C#과 같은 .NET 언어와 함께 사용하여 로직을 구현할 수 있습니다.
이러한 점은 WPF를 사용하여 복잡한 UI를 개발하는 데 있어 유리합니다.
2. 변환기 애플리케이션의 개요
이번 강좌에서 개발할 변환기는 기본적으로 두 가지 형식의 변환을 수행하는 작은 애플리케이션입니다.
예를 들어, 온도 변환(섭씨에서 화씨로, 화씨에서 섭씨로)과 길이 변환(미터에서 피트로, 피트에서 미터로) 기능을 제공할 것입니다.
사용자는 입력 필드에 값을 입력하고 변환 버튼을 클릭하여 결과를 확인할 수 있습니다.
3. 개발 환경 설정
WPF 애플리케이션을 개발하기 위해서는 Visual Studio가 필요합니다.
Visual Studio Community 버전은 무료로 사용할 수 있으며, 쉽게 설치하여 WPF 애플리케이션을 시작할 수 있습니다.
설치 후, 새 프로젝트를 생성하고 WPF 앱(.NET Core 또는 .NET Framework)을 선택합니다.
4. 프로젝트 구조
WPF 프로젝트의 기본 구조는 다음과 같습니다:
- MainWindow.xaml: UI 요소를 정의하는 XAML 파일입니다.
- MainWindow.xaml.cs: UI 로직을 구현하는 C# 코드 파일입니다.
- App.xaml: 애플리케이션의 시작점 및 리소스를 정의합니다.
5. XAML을 통한 UI 설계
<Window x:Class="ConverterApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="변환기" Height="350" Width="525">
<Grid>
<Label Content="온도 변환기" FontSize="24" HorizontalAlignment="Center" Margin="10"/>
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBox x:Name="InputValue" Width="200" Margin="5" />
<ComboBox x:Name="InputUnit" Width="200" Margin="5">
<ComboBoxItem Content="섭씨" />
<ComboBoxItem Content="화씨" />
</ComboBox>
<Button Content="변환" Width="200" Margin="5" Click="ConvertButton_Click"/>
<TextBlock x:Name="ResultText" FontSize="16" Margin="5"/>
</StackPanel>
</Grid>
</Window>
위의 XAML 코드는 기본적인 UI를 생성합니다. 사용자로부터 온도를 입력받고, 섭씨 또는 화씨를 선택할 수 있는 콤보박스를 제공합니다.
변환 버튼을 클릭하면 입력된 값을 기반으로 변환 결과가 표시됩니다.
6. C# 코드 구현
다음은 변환 로직을 구현하는 C# 코드입니다. MainWindow.xaml.cs 파일에 작성합니다.
using System;
using System.Windows;
namespace ConverterApp
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void ConvertButton_Click(object sender, RoutedEventArgs e)
{
double inputValue;
bool isValid = double.TryParse(InputValue.Text, out inputValue);
if (!isValid)
{
ResultText.Text = "유효한 숫자를 입력하세요.";
return;
}
if (InputUnit.SelectedIndex == 0) // 섭씨
{
double result = (inputValue * 9 / 5) + 32;
ResultText.Text = $"{inputValue} °C는 {result} °F입니다.";
}
else // 화씨
{
double result = (inputValue - 32) * 5 / 9;
ResultText.Text = $"{inputValue} °F는 {result} °C입니다.";
}
}
}
}
위의 C# 코드에서는 변환 버튼이 클릭될 때 호출되는 ConvertButton_Click 메서드를 정의합니다.
사용자가 입력한 값을 읽고, 선택된 단위에 따라 적절한 변환을 수행합니다.
입력값이 유효하지 않을 경우, 경고 메시지를 표시하여 사용자에게 알려줍니다.
7. 길이 변환기 추가
다음으로 길이 변환 기능을 추가해봅시다. UI를 수정하여 길이 변환 버튼을 추가하고, 변환 로직을 작성합니다.
<Label Content="길이 변환기" FontSize="24" HorizontalAlignment="Center" Margin="10"/>
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBox x:Name="LengthInputValue" Width="200" Margin="5" />
<ComboBox x:Name="LengthInputUnit" Width="200" Margin="5">
<ComboBoxItem Content="미터" />
<ComboBoxItem Content="피트" />
</ComboBox>
<Button Content="변환" Width="200" Margin="5" Click="LengthConvertButton_Click"/>
<TextBlock x:Name="LengthResultText" FontSize="16" Margin="5"/>
</StackPanel>
위와 같은 방식으로 길이 변환UI를 각각 추가한 후, 길이 변환 로직을 MainWindow.xaml.cs에 추가합니다.
private void LengthConvertButton_Click(object sender, RoutedEventArgs e)
{
double inputLengthValue;
bool isLengthValid = double.TryParse(LengthInputValue.Text, out inputLengthValue);
if (!isLengthValid)
{
LengthResultText.Text = "유효한 숫자를 입력하세요.";
return;
}
if (LengthInputUnit.SelectedIndex == 0) // 미터
{
double lengthResult = inputLengthValue * 3.28084;
LengthResultText.Text = $"{inputLengthValue} 미터는 {lengthResult} 피트입니다.";
}
else // 피트
{
double lengthResult = inputLengthValue / 3.28084;
LengthResultText.Text = $"{inputLengthValue} 피트는 {lengthResult} 미터입니다.";
}
}
8. 애플리케이션 실행 및 테스트
모든 기능이 구현된 후, 애플리케이션을 실행하여 변환기가 올바르게 작동하는지 테스트합니다.
다양한 값과 단위를 입력하여 변환이 제대로 이루어지는지 확인합니다.
필요에 따라 UI를 개선하거나 추가적인 기능을 붙일 수 있습니다.
9. 결론
이번 강좌에서는 WPF를 사용하여 기본적인 변환기 애플리케이션을 개발하는 과정을 살펴보았습니다.
WPF의 장점인 XAML을 통한 UI 구성과 C#을 통한 로직 구현을 활용하여 사용자와 상호작용할 수 있는 애플리케이션을 만들 수 있었습니다.
앞으로 더욱 다양한 WPF 프로젝트를 통해 이 기술을 심화하여 나가길 바랍니다.