연습: DesignInstance를 사용하여 디자이너의 데이터에 바인딩

아티클
08/10/2011

이 연습에서는 WPF Designer for Visual Studio를 사용하여 런타임에 할당되는 데이터 컨텍스트에 대해 디자인 타임에 데이터 바인딩을 만드는 방법을 보여 줍니다. 데이터 바인딩을 만들려면 데이터 바인딩 작성기를 사용하여 특수한 디자인 타임 데이터 컨텍스트를 만들고 DesignInstance를 비즈니스 개체 형식으로 설정합니다. DesignInstance는 디자인 타임 속성입니다.

이 연습에서는 다음 작업을 수행합니다.

프로젝트를 만듭니다.
Customer 클래스 비즈니스 개체를 만듭니다.
TextBox 컨트롤을 데이터 컨텍스트에 있는 Customer 클래스의 디자인 타임 인스턴스에 데이터 바인딩합니다.

연습을 마치면 런타임에 비즈니스 개체에 바인딩된 텍스트 상자가 완성됩니다. 데이터 바인딩은 WPF Designer에서 설정됩니다.

참고

표시되는 대화 상자와 메뉴 명령은 활성 설정이나 버전에 따라 도움말에서 설명하는 것과 다를 수 있습니다. 설정을 변경하려면 도구 메뉴에서 설정 가져오기 및 내보내기를 선택합니다. 자세한 내용은 설정에 대한 작업을 참조하십시오.

사전 요구 사항

이 연습을 완료하려면 다음 구성 요소가 필요합니다.

Visual Studio 2010.

프로젝트 만들기

첫 번째 단계로 WPF 응용 프로그램 프로젝트를 만들고 디자인 타임 속성을 설정합니다.

프로젝트를 만들려면

Visual Basic 또는 Visual C#에서 DataBindingDemo라는 새 WPF 응용 프로그램 프로젝트를 만듭니다. 자세한 내용은 방법: 새 WPF 응용 프로그램 프로젝트 만들기를 참조하십시오.

WPF Designer에 MainWindow.xaml이 열립니다.
디자인 뷰에서 MainWindow 오른쪽 아래에 있는 루트 크기 조정 태그 ()를 클릭하여 루트 크기를 자동 크기 조정으로 설정합니다.

XAML 뷰에서 DesignHeight 및 DesignInstance와 같은 디자인 타임 특성에 액세스할 수 있도록 d 네임스페이스 매핑이 추가됩니다.

비즈니스 개체 만들기

다음으로 비즈니스 개체를 만듭니다. 비즈니스 개체는 FirstName 및 LastName 속성이 있는 Customer 클래스입니다.

참고

비즈니스 개체 형식은 생성 가능한 형식이 아니더라도 디자인 타임 데이터 바인딩에 사용할 수 있습니다. 예를 들어 디자인 타임에 추상 클래스에 바인딩할 수 있습니다.

비즈니스 개체를 만들려면

Customer라는 새 클래스를 프로젝트에 추가합니다. 자세한 내용은 방법: 새 프로젝트 항목 추가를 참조하십시오.

자동으로 생성된 코드를 다음 코드로 바꿉니다.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace DataBindingDemo
{
    public class Customer
    {   
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }
}

디자인 타임 데이터 컨텍스트 설정

데이터 바인딩 작성기를 사용하여 데이터 바인딩을 만들려면 특수한 디자인 타임 데이터 컨텍스트를 만들고 DesignInstance를 비즈니스 개체 형식으로 설정합니다.

디자인 타임 데이터 컨텍스트를 설정하려면

WPF Designer에서 MainWindow.xaml을 엽니다.
XAML 뷰에서 여는 MainWindow 태그에 다음 네임스페이스 매핑을 추가합니다. 자세한 내용은 방법: 네임스페이스를 XAML로 가져오기를 참조하십시오.
```
xmlns:local="clr-namespace:DataBindingDemo"
```
Grid 요소의 여는 태그를 다음 XAML로 바꿉니다.
```
<Grid d:DataContext="{d:DesignInstance Type=local:Customer}" Name="_grid">
```
이 XAML은 디자인 타임 데이터 컨텍스트를 설정하고 Customer 클래스를 데이터 바인딩을 만드는 데 사용할 수 있게 만듭니다.
솔루션을 빌드합니다.

데이터 바인딩 만들기

이제 데이터 바인딩 작성기를 사용하여 Customer 비즈니스 개체에 대한 데이터 바인딩을 만들 수 있습니다. 다음 절차에서는 TextBox 컨트롤을 Customer 개체의 FirstName 속성에 바인딩하는 방법을 보여 줍니다.

데이터 바인딩을 만들려면

도구 상자에서 TextBox 컨트롤을 Window로 끌어 옵니다.
속성 창에서 Text 속성으로 스크롤합니다.
왼쪽 열 가장자리에서 속성 표식 ()을 클릭합니다.

메뉴가 나타납니다.

팁

행을 마우스 오른쪽 단추로 클릭하여 메뉴를 표시할 수도 있습니다.
데이터 바인딩 적용을 클릭합니다.

경로 창이 열린 채로 데이터 바인딩 작성기가 나타납니다.
FirstName을 클릭하고 Enter 키를 누릅니다.

XAML 뷰에서 Text 속성이 Customer 형식의 FirstName 속성에 데이터 바인딩되었습니다.

런타임 데이터 컨텍스트 설정

마지막으로 런타임 데이터 컨텍스트를 할당합니다. XAML이나 코드를 변경하지 않아도 디자인 타임에 만든 데이터 바인딩이 런타임에 작동합니다.

런타임 데이터 컨텍스트를 설정하려면

코드 편집기에서 MainWindow.xaml.cs 또는 MainWindow.xaml.vb를 엽니다.

자동으로 생성된 MainWindow 생성자를 다음 코드로 바꿉니다.

public MainWindow()
{
    InitializeComponent();

    Customer c = new Customer();
    c.FirstName = "Brenda";
    c.LastName = "Diaz";

    this._grid.DataContext = c;
}

F5 키를 눌러 응용 프로그램을 실행합니다.

런타임에 만들어진 Customer 개체의 이름이 텍스트 상자에 표시됩니다.

다음 단계

샘플 디자인 타임 데이터에 바인딩하면 실제 데이터가 제공되는 런타임의 올바른 레이아웃 동작을 쉽게 생성할 수 있습니다. 자세한 내용은 연습: WPF Designer에서 샘플 데이터 사용을 참조하십시오.

참고 항목

참조

DataContext

기타 리소스

디자인 타임 특성

WPF Designer에서 데이터 바인딩

다음을 통해 공유