L2DBForm.xaml 원본 코드L2DBForm.xaml Source Code

이 항목에서는 WPF Data Binding Using LINQ to XML Example에 대한 XAML 소스 파일인 L2DBForm.xaml을 제공하며 이 파일에 대해 설명합니다.This topic contains and describes the XAML source file for the WPF Data Binding Using LINQ to XML Example, L2DBForm.xaml.

전체적인 UI 구조Overall UI Structure

WPF 프로젝트에 일반적이듯이 이 파일에는 부모 요소가 하나 포함되어 있습니다. 이 부모 요소는 <xref:System.Windows.Window> 네임스페이스의 파생된 클래스 L2XDBFrom 과 연결된 LinqToXmlDataBinding XML 요소입니다.As is typical for a WPF project, this file contains one parent element, a <xref:System.Windows.Window> XML element associated with the derived class L2XDBFrom in the LinqToXmlDataBinding namespace.

클라이언트 영역은 연한 파랑색 배경이 제공되는 <xref:System.Windows.Controls.StackPanel> 에 포함되어 있습니다.The client area is contained within a <xref:System.Windows.Controls.StackPanel> that is given a light blue background. 이 패널에는 <xref:System.Windows.Controls.DockPanel> 표시줄로 구분된 <xref:System.Windows.Controls.Separator> UI 섹션이 4개 포함되어 있습니다.This panel contains four <xref:System.Windows.Controls.DockPanel> UI sections separated by <xref:System.Windows.Controls.Separator> bars. 이러한 섹션의 목적은 이전 항목설명에 설명되어 있습니다.The purpose of these sections is described in the Remarks in the previous topic.

각 섹션에는 해당 섹션을 식별하는 레이블이 포함되어 있습니다.Each section contains a label that identifies it. 처음 두 섹션에서 이 레이블은 <xref:System.Windows.FrameworkElement.LayoutTransform%2A>을 사용하여 90도 회전됩니다.In the first two sections, this label is rotated 90 degrees through the use of a <xref:System.Windows.FrameworkElement.LayoutTransform%2A>. 섹션의 나머지 부분에는 해당 섹션의 목적에 적합한 텍스트 블록, 텍스트 상자, 단추 등의 UI 요소가 포함되어 있습니다.The remainder of the section contains UI elements appropriate to the purpose of that section: text blocks, text boxes, buttons, and so on. 때때로 자식 <xref:System.Windows.Controls.StackPanel> 이 이러한 자식 컨트롤을 정렬하는 데 사용됩니다.Sometimes a child <xref:System.Windows.Controls.StackPanel> is used to align these child controls.

창 리소스 섹션Window Resource Section

9번째 줄의 여는 <Window.Resources> 태그는 창 리소스 섹션의 시작을 나타냅니다.The opening <Window.Resources> tag on line 9 indicates the start of the window resource section. 창 리소스 섹션은 35번째 줄의 닫는 태그에서 끝납니다.It ends with the closing tag on line 35.

11-25번째 줄에 있는 <ObjectDataProvider> 태그는 <xref:System.Windows.Data.ObjectDataProvider>를 소스로 사용하는 LoadedBooks라는 <xref:System.Xml.Linq.XElement> 를 선언합니다.The <ObjectDataProvider> tag, which spans lines 11 through 25, declares a <xref:System.Windows.Data.ObjectDataProvider>, named LoadedBooks, that uses an <xref:System.Xml.Linq.XElement> as the source. 이 <xref:System.Xml.Linq.XElement> 는 포함된 XML 문서( CDATA 요소)의 구문을 분석하여 초기화됩니다.This <xref:System.Xml.Linq.XElement> is initialized by parsing an embedded XML document (a CDATA element). 포함된 XML 문서를 선언하는 경우와 이 문서의 구문을 분석하는 경우에도 공백이 유지됩니다.Notice that white space is preserved when declaring the embedded XML document and also when it is parsed. 이 작업은 원시 XML을 표시하는 데 사용되는 <xref:System.Windows.Controls.TextBlock> 컨트롤에 특별한 XML 서식 지정 기능이 없기 때문에 수행되었습니다.This was done because the <xref:System.Windows.Controls.TextBlock> control, which is used to display the raw XML, has no special XML formatting capabilities.

마지막으로 <xref:System.Windows.DataTemplate> 이라는 BookTemplate 이 28-34번째 줄에 정의되어 있습니다.Lastly, a <xref:System.Windows.DataTemplate> named BookTemplate is defined on lines 28 through 34. 이 템플릿은 Book List UI 섹션에 항목을 표시하는 데 사용됩니다.This template will be used to display the entries in the Book List UI section. 이 템플릿에서는 데이터 바인딩과 LINQ to XML 동적 속성을 사용하여 다음 할당을 통해 책 ID와 책 이름을 검색합니다.It uses data binding and LINQ to XML dynamic properties to retrieve the book ID and book name through the following assignments:

Text="{Binding Path=Attribute[id].Value}"Text="{Binding Path=Value}"  

데이터 바인딩 코드Data Binding Code

<xref:System.Windows.DataTemplate> 요소 외에도 데이터 바인딩이 이 파일의 여러 위치에서 사용됩니다.In addition to the <xref:System.Windows.DataTemplate> element, data binding is used in a number of other places in this file.

38번째 줄의 여는 <StackPanel> 태그에서 이 패널의 <xref:System.Windows.FrameworkElement.DataContext%2A> 속성은 LoadedBooks 데이터 공급자로 설정됩니다.In the opening <StackPanel> tag on line 38, the <xref:System.Windows.FrameworkElement.DataContext%2A> property of this panel is set to the LoadedBooks data provider.

DataContext="{Binding Source={StaticResource LoadedBooks}}  

이를 통해(46번째 줄) <xref:System.Windows.Controls.TextBlock> 이라는 tbRawXml 이 이 데이터 공급자의 Xml 속성에 바인딩하여 원시 XML을 표시할 수 있습니다.This makes it possible (on line 46) for the <xref:System.Windows.Controls.TextBlock> named tbRawXml to display the raw XML by binding to this data provider's Xml property:

Text="{Binding Path=Xml}"   

58-62번째 줄의 <xref:System.Windows.Controls.ListBox> Book List UI 섹션에 있는 는 표시 항목에 대한 템플릿을 창 리소스 섹션에 정의된 BookTemplate 으로 설정합니다.The <xref:System.Windows.Controls.ListBox> in the Book List UI section, on lines 58 through 62, sets the template for its display items to the BookTemplate defined in the window resource section:

ItemTemplate ="{StaticResource BookTemplate}"   

그런 다음 59-62번째 줄에서 책의 실제 값이 이 목록 상자에 바인딩됩니다.Then, on lines 59 through 62, the actual values of the books are bound to this list box:

<ListBox.ItemsSource>  
    <Binding Path="Elements[{http://www.mybooks.com}book]"/>  
</ListBox.ItemsSource>  

세 번째 UI 섹션인 Edit Selected Book은 먼저 부모 <xref:System.Windows.FrameworkElement.DataContext%2A> 의 <xref:System.Windows.Controls.StackPanel> 를 Book List UI 섹션(82번째 줄)에서 현재 선택된 항목에 바인딩합니다.The third UI section, Edit Selected Book, first binds the <xref:System.Windows.FrameworkElement.DataContext%2A> of the parent <xref:System.Windows.Controls.StackPanel> to the currently selected item in from the Book List UI section (line 82):

DataContext="{Binding ElementName=lbBooks, Path=SelectedItem}"  

그런 다음 양방향 데이터 바인딩을 사용하므로 책 요소의 현재 값이 이 패널의 두 텍스트 상자에서 표시되고 업데이트됩니다.It then uses two-way data binding, so that the current values of the book elements are displayed to and updated from the two text boxes in this panel. 동적 속성에 대한 데이터 바인딩은 BookTemplate 데이터 템플릿에서 사용되는 것과 유사합니다.Data binding to dynamic properties is similar to that used in the BookTemplate data template:

Text="{Binding Path=Attribute[id].Value}"...Text="{Binding Path=Value}"  

마지막 UI 섹션인 Add New Book에서는 XAML 코드에서 데이터 바인딩을 사용하지 않습니다. 이러한 코드는 L2DBForm.xaml.cs 파일의 이벤트 처리 코드에 있습니다.The last UI section, Add New Book, does not use data binding in its XAML code; instead, such code can be found in its event handling code in the file L2DBForm.xaml.cs.

Example

설명Description

참고

줄 번호를 추적하기 쉽도록 아래의 코드를 Visual Studio의 C# 소스 코드 편집기와 같은 코드 편집기에 복사하는 것이 좋습니다.We recommend that you copy the following code below into a code editor, such as the C# source code editor in Visual Studio, so that line numbers will be easier to track.

코드Code

<Window x:Class="LinqToXmlDataBinding.L2XDBForm"  
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
    xmlns:system="clr-namespace:System;assembly=mscorlib"  
    xmlns:xlinq="clr-namespace:System.Xml.Linq;assembly=System.Xml.Linq"  
    xmlns:local="clr-namespace:LinqToXmlDataBinding"  
    Title="WPF Data Binding using LINQ-to-XML" Height="665" Width="500" ResizeMode="NoResize">  

    <Window.Resources>  
        <!-- Books provider and inline data -->  
        <ObjectDataProvider x:Key="LoadedBooks" ObjectType="{x:Type xlinq:XElement}" MethodName="Parse">  
            <ObjectDataProvider.MethodParameters>  
                <system:String xml:space="preserve">  
<![CDATA[  
<books xmlns="http://www.mybooks.com">  
  <book id="0">book zero</book>  
  <book id="1">book one</book>  
  <book id="2">book two</book>  
  <book id="3">book three</book>  
</books>  
]]>                  
                </system:String>  
                <xlinq:LoadOptions>PreserveWhitespace</xlinq:LoadOptions>  
            </ObjectDataProvider.MethodParameters>  
        </ObjectDataProvider>  

        <!-- Template for use in Books List listbox. -->  
        <DataTemplate x:Key="BookTemplate">  
            <StackPanel Orientation="Horizontal">  
                <TextBlock Margin="3" Text="{Binding Path=Attribute[id].Value}"/>  
                <TextBlock Margin="3" Text="-"/>  
                <TextBlock Margin="3" Text="{Binding Path=Value}"/>  
            </StackPanel>  
        </DataTemplate>  
    </Window.Resources>  

    <!-- Main visual content container -->  
    <StackPanel Background="lightblue" DataContext="{Binding Source={StaticResource LoadedBooks}}">  
        <!-- Raw XML display section -->  
        <DockPanel Margin="5">  
            <Label  Background="Gray" FontSize="12" BorderBrush="Black" BorderThickness="1" FontWeight="Bold">XML  
            <Label.LayoutTransform>  
                <RotateTransform Angle="90"/>  
            </Label.LayoutTransform>  
            </Label>  
            <TextBlock Name="tbRawXml" Height="200" Background="LightGray" Text="{Binding Path=Xml}" TextTrimming="CharacterEllipsis" />  
        </DockPanel>  

        <Separator Height="4" Margin="5" />  

        <!-- List box to display all books section -->  
        <DockPanel Margin="5">  
            <Label  Background="Gray" FontSize="12" BorderBrush="Black" BorderThickness="1" FontWeight="Bold">Book List  
                <Label.LayoutTransform>  
                    <RotateTransform Angle="90"/>  
                </Label.LayoutTransform>  
            </Label>  
            <ListBox Name="lbBooks" Height="200" Width="415" ItemTemplate ="{StaticResource BookTemplate}">  
                <ListBox.ItemsSource>  
                    <Binding Path="Elements[{http://www.mybooks.com}book]"/>  
                </ListBox.ItemsSource>  
            </ListBox>  
            <Button Margin="5" DockPanel.Dock="Right" Height="30" Width ="130" Content="Remove Selected Book" Click="OnRemoveBook">      
            <Button.LayoutTransform>  
                <RotateTransform Angle="90"/>  
            </Button.LayoutTransform>  
            </Button>  
        </DockPanel>  

        <Separator Height="4" Margin="5" />  

        <!-- Edit current selection section -->  
        <DockPanel Margin="5">  
            <TextBlock Margin="5" Height="30" Width="65" DockPanel.Dock="Right" Background="LightGray" TextWrapping="Wrap" TextAlignment="Center">  
                    Changes are live!  
                <TextBlock.LayoutTransform>  
                    <RotateTransform Angle="90"/>  
                </TextBlock.LayoutTransform>  
            </TextBlock>  
            <StackPanel>  
                <Label Width="450" Background="Gray" FontSize="12" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" FontWeight="Bold">Edit Selected Book</Label>      
                <StackPanel Margin="1" DataContext="{Binding ElementName=lbBooks, Path=SelectedItem}">  
                    <StackPanel Orientation="Horizontal">  
                        <Label Width="40">ID:</Label>  
                        <TextBox Name="editAttributeTextBox" Width="410" Text="{Binding Path=Attribute[id].Value}">  
                            <TextBox.ToolTip>  
                                <TextBlock FontWeight="Bold" TextAlignment="Center">  
                                    <Label>Edit the selected book ID and see it changed.</Label>  
                                </TextBlock>  
                            </TextBox.ToolTip>  
                        </TextBox>  
                    </StackPanel>  
                    <StackPanel Orientation="Horizontal">  
                        <Label Width="40">Value:</Label>  
                        <TextBox Name="editValueTextBox" Width="410" Text="{Binding Path=Value}" Height="25">  
                            <TextBox.ToolTip>  
                                <TextBlock FontWeight="Bold" TextAlignment="Center">  
                                    <Label>Edit the selected book Value and see it changed.</Label>  
                                </TextBlock>  
                            </TextBox.ToolTip>  
                        </TextBox>  
                    </StackPanel>  
                </StackPanel>  
            </StackPanel>  
        </DockPanel>  

        <Separator Height="4" Margin="5" />  

        <!-- Add new book section -->  
        <DockPanel Margin="5">  
            <Button Margin="5" Height="30" DockPanel.Dock="Right" Click ="OnAddBook">Add Book  
                <Button.LayoutTransform>  
                    <RotateTransform Angle="90"/>  
                </Button.LayoutTransform>  
            </Button>  
            <StackPanel>  
                <Label Width="450" Background="Gray" FontSize="12" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" FontWeight="Bold">Add New Book</Label>  
                <StackPanel Margin="1">  
                    <StackPanel Orientation="Horizontal">  
                        <Label Width="40">ID:</Label>  
                        <TextBox Name="tbAddID" Width="410">  
                            <TextBox.ToolTip>  
                                <TextBlock FontWeight="Bold" TextAlignment="Center">  
                                    <Label>Enter a book ID and Value pair, then click Add Book.</Label>  
                                </TextBlock>  
                            </TextBox.ToolTip>  
                        </TextBox>  
                    </StackPanel>  
                    <StackPanel Orientation="Horizontal">  
                        <Label Width="40">Value:</Label>  
                        <TextBox Name="tbAddValue" Width="410" Height="25">  
                            <TextBox.ToolTip>  
                                <TextBlock FontWeight="UltraBold" TextAlignment="Center">  
                                    <Label>Enter a book ID and Value pair, then click Add Book.</Label>  
                                </TextBlock>  
                            </TextBox.ToolTip>  
                        </TextBox>  
                    </StackPanel>  
                </StackPanel>  
            </StackPanel>  
        </DockPanel>  
    </StackPanel>  
</Window>  

설명Comments

WPF UI 요소와 연결된 이벤트 처리기의 C# 소스 코드는 L2DBForm.xaml.cs Source Code를 참조하세요.For the C# source code for the event handlers associated with the WPF UI elements, see L2DBForm.xaml.cs Source Code.

참고 항목See Also

연습: LinqToXmlDataBinding 예제 Walkthrough: LinqToXmlDataBinding Example
L2DBForm.xaml.cs 소스 코드L2DBForm.xaml.cs Source Code