제공: 한빛 네트워크
저자: 한동훈
닷넷 프레임워크 3.0 정식 버전이 발표되었고, 윈도 비스타에도 기본으로 포함됩니다. 닷넷 프레임워크 3.0은 닷넷 프레임워크 2.0 위에 추가되는 성격으로 발표되었습니다. 따라서, 컴파일러는 닷넷 프레임워크 2.0의 것을 사용합니다.
닷넷 프레임워크 3.0 준비하기
닷넷 프레임워크 3.0을 윈도 XP/2003 등에서 사용하려면
닷넷 프레임워크 3.0 런타임 을 설치해야 합니다.
닷넷 프레임워크 3.0을 기반으로 개발하기 위해서는
SDK 를 추가로 설치합니다.
여기서는 비주얼 스튜디오 2005(이하 VS2005)에서 닷넷 프레임워크 3.0 프로그래밍을 할 것이므로
VS 2005에서 사용할 확장팩 을 설치해야 합니다.
WPF 프로젝트 생성하기
세 가지를 모두 설치했으면 VS 2005를 실행합니다. VS2005에서 [파일] -> [새로 만들기] -> [프로젝트]를 선택하면 다음 대화상자를 볼 수 있습니다. 이 대화상자에서 [Visual C#] -> [.NET Framework 3.0]을 선택하면 오른쪽에 WPF 프로젝트 템플릿을 볼 수 있습니다. 여기서 [Windows Application(WPF)]를 선택합니다.
[그림1] WPF 프로젝트 생성
WPF 프로젝트를 생성하면 위에는 UI 디자이너가 표시되고, 아래에는 XAML 코드가 생성되는 것을 볼 수 있습니다. WPF에서 UI를 구성하는 코드를 XML을 기반으로 하는 XAML을 사용합니다. 처음 생성된 XAML 코드는 아래와 같습니다.
XAML에서 각각의 태그는 .NET 클래스에 해당합니다. 태그는 Window 클래스와 매핑됩니다. x:Class에서는 XAML 코드를 지정하는 클래스를 정의합니다. 닷넷 클래스와 매핑되지 않는 경우는 XML 네임스페이스를 가리키는 xmlns 속성뿐입니다. 태그는 XAML에서 사용하는 레이아웃 관리자(Layout Manager)를 의미합니다.
여기서 관심을 가질 것은 StartupUri 속성입니다. StartupUri 속성에서 시작 페이지를 설정합니다. Window1.xaml 파일이 설정되어 있으므로 응용프로그램을 실행할 때 Window1.xaml 페이지를 보여주게 됩니다. 다시 Window1.xaml로 돌아갑니다. 도구 상자에서 Button을 끌어다가 폼에 올려둔 모습은 다음과 같습니다.
Button
태그는 Button 클래스에 해당합니다. 속성들을 보면 대부분 어떤 의미인지 알 수 있습니다. 각 태그와 속성은 모두 대소문자를 구분한다는 점에만 주의하면 됩니다. 버튼을 클릭했을 때 호출할 함수의 이름은 Click 속성에 지정하면 됩니다. Click 속성을 추가하면 다음과 같습니다.
Button
Window1.xaml.cs에는 다음과 같은 코드를 추가합니다.
void Button1Click(object sender, RoutedEventArgs arg)
{
button1.Content = "Hello";
}
아직은 버튼을 두 번 클릭해서 이벤트 코드가 생성되거나 하는 기능은 지원하지 않습니다. WPF를 위한 VS 2005 확장팩은 개발중인 CTP 버전이므로, 이 부분은 정식버전이 나타나면 나아지리라 생각합니다. 이벤트 핸들러의 코드를 보면 윈폼에서 사용하면 EventArgs 대신 RoutedEventArgs 클래스를 사용하는 것을 알 수 있습니다.
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
마찬가지로 클래스도 윈폼을 상속받는 대신 System.Windows.Window 클래스를 상속받습니다.
태그로 정의하고, CDATA 섹션안에 C# 코드를 작성합니다. 앞의 예제에서 C# 코드를 XAML에 정의하면 다음과 같습니다.
Button
XAML 안에 직접 작성하면 코드 자동 완성 기능(인텔리센스)을 사용할 수 없습니다. XAML을 사용하는 이유는 UI와 코드의 분리이므로 XAML 안에 직접 코드를 작성하는 일은 거의 없겠지만 위와 같은 방법으로 작성하는 것은 가능합니다.
레이아웃 관리자
UserName
Username
Username
username
실행한 결과는 다음과 같습니다.
태그를 사용해서 경계를 정의했습니다. 패널안에 다양한 컨트롤을 추가하고, 윈도우 창의 크기를 변경해보면 DockPanel의 크기가 그에 따라 배열되며, 컨트롤들의 위치도 제대로 유지되는 것을 볼 수 있습니다.
0,0
0,100
50,100
100,100
0,0
0,100
50,100
100,100
두 개의 Canvas 컨트롤을 배치하고, Label 컨트롤을 사용해서 각각 (0,0), (50, 100), (0,100), (100,100)의 좌표에 좌표값을 출력하게 설정하고 있습니다. 실행 결과는 다음과 같습니다.
스크롤 사용하기
The ScrollViewer element encapsulates a content element and up to two ScrollBar controls.
Physical scrolling is used to scroll content by a predetermined physical increment,
typically by a value that is declared in pixels. Logical scrolling is used to scroll
to the next item in the logical tree. If you require physical scrolling instead of
logical scrolling, wrap the host Panel element in a ScrollViewer and set its
CanContentScroll property to false. Physical scrolling is the default scroll
behavior for most Panel elements.
Because the scroll bars for a ScrollViewer element are defined in the default
style of the element, scroll bars will no longer appear if you apply a custom
style to a ScrollViewer. Scroll bars must be defined in the custom style for
them to appear. For an example of how to implement scroll bars in a custom style,
see Style the ScrollViewer Element.
WPF에서 화면에 표시하는 텍스트는 또는 을 사용합니다. 안에 표시할 텍스트는 을 사용하고 있습니다. 컨트롤의 크기에 따라 텍스트를 줄바꿈하기 위해 TextWrapping="Wrap"으로 설정하고 있습니다. 위 예제를 실행한 결과는 다음과 같습니다.
참고자료
