L2DBForm.xaml 原始程式碼

發行項
10/14/2024

本頁包含並描述使用 LINQ to XML 的 WPF 資料繫結範例的 XAML 來源檔案。

整體 UI 結構

如同 WPF 專案般，這個檔案包含一個父元素，也就是 Window 命名空間中，與衍生類別 L2XDBFrom 相關聯的 LinqToXmlDataBinding XML 項目。

用戶端區域包含在淡藍色背景的 StackPanel 中。這個面板包含四個 DockPanel UI 區段，以 Separator 列分隔。此處將說明這些章節的目的。

每個區段都包含一個可以識別自身的標籤。在前兩個區段中，這個標籤會透過使用 LayoutTransform而旋轉 90 度。本節其他部分則包含適合該區段用途的 UI 項目，例如文字區塊、文字方塊和按鈕。有時候，子系 StackPanel 用於調整這些子控制項。

視窗資源區段

第 9 行的 <Window.Resources> 開頭標記表示視窗資源區段的開頭，並以第 35 行的結束標記表示結尾。

跨越第 11 行到第 25 行的 <ObjectDataProvider> 標記會宣告名稱為 ObjectDataProvider的 LoadedBooks，並使用 XElement 當做來源。這個 XElement 會藉由剖析內嵌的 XML 文件 ( CDATA 項目) 來初始化。請注意，宣告內嵌的 XML 文件以及進行剖析時，會保留空白字元。保留空白字元是因為用於顯示原始 XML 的 TextBlock 控制項沒有特殊的 XML 格式化功能。

最後在第 28 到 34 行會定義名稱為 DataTemplate 的 BookTemplate 。這個範本將用於顯示 [書籍清單] UI 區段中的項目。它會使用資料繫結和 LINQ to XML 動態屬性，透過下列指派，擷取書籍 ID 和書籍名稱：

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

資料繫結程式碼

除了 DataTemplate 項目之外，資料繫結也會用在這個檔案的其他多個地方。

在第 38 行的 <StackPanel> 開頭標記中，此面板的 DataContext 屬性會設定為 LoadedBooks 資料提供者。

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

設定資料內容可以讓 (第 46 行) 名為 TextBlock 的 tbRawXml 繫結至此資料提供者的 Xml 屬性，以顯示原始 XML：

Text="{Binding Path=Xml}"

第 58 到 62 行 [書籍清單] ListBoxUI 區段中的會將其顯示項目的範本設定為視窗資源區段中定義的 BookTemplate ：

ItemTemplate ="{StaticResource BookTemplate}"

接著在第 59 到 62 行，書籍的實際值會繫結到此清單方塊：

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

第三個 UI 區段，也就是 [ 編輯選取的書籍] 會先將父代 DataContext 的 StackPanel 繫結到目前從 [ 書籍清單 ] UI 區段 (第 82 行) 選取的項目：

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

接著，它會使用雙向資料繫結，讓書籍項目的目前值顯示到此面板的兩個文字方塊中，或從其中更新。動態屬性的資料繫結類似於 BookTemplate 資料範本中所使用的資料繫結：

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

最後一個 UI 區段 ([Add New Book] \(新增新的書籍))，不會在其 XAML 程式碼中使用資料繫結。而是在其檔案 L2DBForm.xaml.cs 的事件處理程式碼中使用資料繫結。

範例

描述

注意

建議您將下列程式碼複製到程式碼編輯器 (例如，Visual Studio 中的 C# 原始程式碼編輯器)，如此將更容易追蹤行號。

程式碼

<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>

註解

如需與 WPF UI 項目建立關聯之事件處理常式的 C# 原始程式碼，請參閱 L2DBForm.xaml.cs 原始程式碼。

共用方式為

L2DBForm.xaml 原始程式碼

整體 UI 結構

視窗資源區段

資料繫結程式碼

範例

描述

程式碼

註解

另請參閱

其他資源