共用方式為


資料表概觀

Table 是一個支援以方格顯示非固定格式文件內容的區塊層級項目。 此項目的彈性增加了它的實用性,但也使其更難以了解及正確使用。

本主題包含下列章節。

  • 資料表的基本概念

  • 資料表與方格有何不同

  • 基本資料表結構

  • 資料表內含項目

  • 資料列群組

  • 背景呈現優先順序

  • 擴展資料列或資料行

  • 使用程式碼建置資料表

  • 相關主題

資料表的基本概念

資料表與方格有何不同

TableGrid 共用某些相同的功能,但兩者分別適用於不同的情況。 Table 的設計適合在非固定格式內容中使用 (如需非固定格式內容的詳細資訊,請參閱非固定格式文件概觀)。 方格則適用於表單內 (基本上,只要是非固定格式內容都適用)。 在 FlowDocument 內,Table 支援分頁、資料行重新排列與內容選取等非固定格式內容行為,而 Grid 則否。 另一方面,Grid 適用於 FlowDocument 以外的地方,其原因眾多,包括 Grid 會根據資料列與資料行索引加入項目,Table 則否。 Grid 項目可允許將子內容分層,所以單一「儲存格」中可以有多個項目。Table 不支援分層。 Grid 的子項目可放在相對於其「儲存格」界限區域的絕對位置。 但 Table 不支援此功能。 最後,Grid 所需的資源比 Table 少,因此請考慮使用 Grid 提升效能。

基本資料表結構

Table 可提供由資料行 (以 TableColumn 項目代表) 與資料列 (以 TableRow 項目代表) 組成的方格式顯示。 TableColumn 項目不會裝載內容;只會定義資料行和資料行的特性。 TableRow 項目必須裝載於 TableRowGroup 項目中,而該項目會定義資料表的資料列群組。 TableCell 項目包含要以資料表代表的實際內容,且必須裝載於 TableRow 項目中。 TableCell 只能包含衍生自 Block 的項目。 也包括 TableCell 的有效子項目。

注意事項注意事項

TableCell 項目不可直接裝載文字內容。若需 TableCell 等非固定格式內容項目之內含項目規則的詳細資訊,請參閱非固定格式文件概觀

注意事項注意事項

Table 類似於 Grid 項目,但其功能較多,因此需要更多資源負荷。

下列範例使用 XAML 定義簡單的 2 x 3 資料表。

<!-- 
  Table is a Block element, and as such must be hosted in a container
  for Block elements.  FlowDocument provides such a container. 
-->
<FlowDocument>
  <Table>
    <!-- 
      This table has 3 columns, each described by a TableColumn 
      element nested in a Table.Columns collection element. 
    -->
    <Table.Columns>
      <TableColumn />
      <TableColumn />
      <TableColumn />
    </Table.Columns>
    <!-- 
      This table includes a single TableRowGroup which hosts 2 rows,
      each described by a TableRow element.
    -->
    <TableRowGroup>
      <!--
        Each of the 2 TableRow elements hosts 3 cells, described by
        TableCell elements.
      -->
      <TableRow>
        <TableCell>
          <!-- 
            TableCell elements may only host elements derived from Block.
            In this example, Paragaph elements serve as the ultimate content
            containers for the cells in this table.
          -->
          <Paragraph>Cell at Row 1 Column 1</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 1 Column 2</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 1 Column 3</Paragraph>
        </TableCell>
      </TableRow>
      <TableRow>
        <TableCell>
          <Paragraph>Cell at Row 2 Column 1</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 2 Column 2</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 2 Column 3</Paragraph>
        </TableCell>
      </TableRow>
    </TableRowGroup>
  </Table>
</FlowDocument>

下圖顯示此範例所呈現的內容。

螢幕擷取畫面:呈現基本資料表

資料表內含項目

Table 衍生自 Block 項目,且必須遵循 Block 層級項目的一般規則。 Table 項目可包含在下列任何項目中:

資料列群組

TableRowGroup 項目提供一種方法,可以任意將資料表內的資料列放在一起形成群組;資料表中的每一資料列都必須屬於一個資料列群組。 資料列群組內的資料列通常會有相同的目的,而且可將樣式設計成同一個群組。 資料列群組的常見使用方式,是從資料表內含的主要內容區隔出特殊用途的資料列,如標題、頁首與頁尾 (Footer) 資料列。

下列範例使用 XAML 定義資料表,並設定其中頁首與頁尾資料列的樣式。

<Table>
  <Table.Resources>
    <!-- Style for header/footer rows. -->
    <Style x:Key="headerFooterRowStyle" TargetType="{x:Type TableRowGroup}">
      <Setter Property="FontWeight" Value="DemiBold"/>
      <Setter Property="FontSize" Value="16"/>
      <Setter Property="Background" Value="LightGray"/>
    </Style>

    <!-- Style for data rows. -->
    <Style x:Key="dataRowStyle" TargetType="{x:Type TableRowGroup}">
      <Setter Property="FontSize" Value="12"/>
      <Setter Property="FontStyle" Value="Italic"/>
    </Style>
  </Table.Resources>

  <Table.Columns>
    <TableColumn/> <TableColumn/> <TableColumn/> <TableColumn/>
  </Table.Columns>

  <!-- This TableRowGroup hosts a header row for the table. -->
  <TableRowGroup Style="{StaticResource headerFooterRowStyle}">
    <TableRow>
      <TableCell/>
      <TableCell><Paragraph>Gizmos</Paragraph></TableCell>
      <TableCell><Paragraph>Thingamajigs</Paragraph></TableCell>
      <TableCell><Paragraph>Doohickies</Paragraph></TableCell>
    </TableRow>
  </TableRowGroup>

  <!-- This TableRowGroup hosts the main data rows for the table. -->
  <TableRowGroup Style="{StaticResource dataRowStyle}">
    <TableRow>
      <TableCell><Paragraph Foreground="Blue">Blue</Paragraph></TableCell>
      <TableCell><Paragraph>1</Paragraph></TableCell>
      <TableCell><Paragraph>2</Paragraph></TableCell>
      <TableCell><Paragraph>3</Paragraph> </TableCell>
    </TableRow>
    <TableRow>
      <TableCell><Paragraph Foreground="Red">Red</Paragraph></TableCell>
      <TableCell><Paragraph>1</Paragraph></TableCell>
      <TableCell><Paragraph>2</Paragraph></TableCell>
      <TableCell><Paragraph>3</Paragraph></TableCell>
    </TableRow>
    <TableRow>
      <TableCell><Paragraph Foreground="Green">Green</Paragraph></TableCell>
      <TableCell><Paragraph>1</Paragraph></TableCell>
      <TableCell><Paragraph>2</Paragraph></TableCell>
      <TableCell><Paragraph>3</Paragraph></TableCell>
    </TableRow>
  </TableRowGroup>

  <!-- This TableRowGroup hosts a footer row for the table. -->
  <TableRowGroup Style="{StaticResource headerFooterRowStyle}">
    <TableRow>
      <TableCell><Paragraph>Totals</Paragraph></TableCell>
      <TableCell><Paragraph>3</Paragraph></TableCell>
      <TableCell><Paragraph>6</Paragraph></TableCell>
      <TableCell>
        <Table></Table>
      </TableCell>
    </TableRow>
  </TableRowGroup>
</Table>

下圖顯示此範例所呈現的內容。

螢幕擷取畫面:資料表資料列群組

背景呈現優先順序

資料表項目會以下列順序呈現 (由低至高的疊置順序)。 此順序不可變更。 例如,這些項目並沒有「疊置順序」屬性以用來覆寫已建立之順序。

  1. Table

  2. TableColumn

  3. TableRowGroup

  4. TableRow

  5. TableCell

請考量下列範例,此範例會定義資料表中前述每個項目的背景色彩。

<Table Background="Yellow">
  <Table.Columns>
    <TableColumn/>
    <TableColumn Background="LightGreen"/>
    <TableColumn/>
  </Table.Columns>
  <TableRowGroup>
    <TableRow>
      <TableCell/><TableCell/><TableCell/>
    </TableRow>
  </TableRowGroup>
  <TableRowGroup Background="Tan">
    <TableRow>
      <TableCell/><TableCell/><TableCell/>
    </TableRow>
    <TableRow Background="LightBlue">
      <TableCell/><TableCell Background="Purple"/><TableCell/>
    </TableRow>
    <TableRow>
      <TableCell/><TableCell/><TableCell/>
    </TableRow>
  </TableRowGroup>
  <TableRowGroup>
    <TableRow>
      <TableCell/><TableCell/><TableCell/>
    </TableRow>
  </TableRowGroup>
</Table>

下圖顯示此範例所呈現的內容 (僅顯示背景色彩)。

螢幕擷取畫面:資料表疊置順序

擴展資料列或資料行

資料表儲存格可分別使用 RowSpanColumnSpan 屬性進行設定,以擴展多個資料列或資料行。

請考量下列範例,其中的儲存格擴展至三個資料行。

<Table>
  <Table.Columns>
    <TableColumn/>
    <TableColumn/>
    <TableColumn/>
  </Table.Columns>

  <TableRowGroup>
    <TableRow>
      <TableCell ColumnSpan="3" Background="Cyan">
        <Paragraph>This cell spans all three columns.</Paragraph>
      </TableCell>
    </TableRow>
    <TableRow>
      <TableCell Background="LightGray"><Paragraph>Cell 1</Paragraph></TableCell>
      <TableCell Background="LightGray"><Paragraph>Cell 2</Paragraph></TableCell>
      <TableCell Background="LightGray"><Paragraph>Cell 3</Paragraph></TableCell>
    </TableRow>
  </TableRowGroup>
</Table>

下圖顯示此範例所呈現的內容。

螢幕擷取畫面:儲存格合併三欄

使用程式碼建置資料表

下列範例顯示如何以程式設計的方式建立 Table 並為其填入 (Populate) 內容。 資料表的內容會分配到五個資料列 (以 RowGroups 物件中所含的 TableRow 物件表示) 及六個資料行 (以 TableColumn 物件表示) 中。 這些資料列分別用於不同的顯示用途,包括為整個資料表下標的標題資料列、用以說明資料表中各資料行的頁首資料列,以及具有摘要資訊的頁尾資料列。 請注意,「標題」、「頁首」與「頁尾」等資料列的概念並非資料表原本所固有,它們只是具有不同特性的資料列。 資料表儲存格含有實際的內容,其中可包含文字、影像或其他幾乎所有的user interface (UI) 項目。

首先,建立 FlowDocument 以裝載 Table,然後建立新的 Table 並將其加入至 FlowDocument 的內容中。

' Create the parent FlowDocument...
flowDoc = New FlowDocument()

' Create the Table...
table1 = New Table()

' ...and add it to the FlowDocument Blocks collection.
flowDoc.Blocks.Add(table1)


' Set some global formatting properties for the table.
table1.CellSpacing = 10
table1.Background = Brushes.White
// Create the parent FlowDocument...
flowDoc = new FlowDocument();

// Create the Table...
table1 = new Table();
// ...and add it to the FlowDocument Blocks collection.
flowDoc.Blocks.Add(table1);


// Set some global formatting properties for the table.
table1.CellSpacing = 10;
table1.Background = Brushes.White;

接著,建立六個 TableColumn 物件,並將其加入至資料表的 Columns 集合中,並為其套用某格式。

注意事項注意事項

請注意,資料表的 Columns 集合使用以零起始的標準索引。

            ' Create 6 columns and add them to the table's Columns collection.
            Dim numberOfColumns = 6
            Dim x
            For x = 0 To numberOfColumns
                table1.Columns.Add(new TableColumn())

                ' Set alternating background colors for the middle colums.
                If x Mod 2 = 0 Then
                  table1.Columns(x).Background = Brushes.Beige
                Else
                  table1.Columns(x).Background = Brushes.LightSteelBlue
                End If
            Next x

            // Create 6 columns and add them to the table's Columns collection.
            int numberOfColumns = 6;
            for (int x = 0; x < numberOfColumns; x++)
            {
                table1.Columns.Add(new TableColumn());

                // Set alternating background colors for the middle colums.
                if(x%2 == 0)
                    table1.Columns[x].Background = Brushes.Beige;
                else
                    table1.Columns[x].Background = Brushes.LightSteelBlue;
            }

接下來建立標題資料列,並將其加入至資料表中並套用某格式。 標題資料列包含單一儲存格,但擴展至資料表中全部六個資料行。

' Create and add an empty TableRowGroup to hold the table's Rows.
table1.RowGroups.Add(new TableRowGroup())

' Add the first (title) row.
table1.RowGroups(0).Rows.Add(new TableRow())

' Alias the current working row for easy reference.
Dim currentRow As New TableRow()
currentRow = table1.RowGroups(0).Rows(0)

' Global formatting for the title row.
currentRow.Background = Brushes.Silver
currentRow.FontSize = 40
currentRow.FontWeight = System.Windows.FontWeights.Bold

' Add the header row with content, 
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("2004 Sales Project"))))
' and set the row to span all 6 columns.
currentRow.Cells(0).ColumnSpan = 6
// Create and add an empty TableRowGroup to hold the table's Rows.
table1.RowGroups.Add(new TableRowGroup());

// Add the first (title) row.
table1.RowGroups[0].Rows.Add(new TableRow());

// Alias the current working row for easy reference.
TableRow currentRow = table1.RowGroups[0].Rows[0];

// Global formatting for the title row.
currentRow.Background = Brushes.Silver;
currentRow.FontSize = 40;
currentRow.FontWeight = System.Windows.FontWeights.Bold;

// Add the header row with content, 
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("2004 Sales Project"))));
// and set the row to span all 6 columns.
currentRow.Cells[0].ColumnSpan = 6;

接著建立頁首資料列,並將其加入至資料表中,頁首資料列中會建立儲存格,並填入內容。

' Add the second (header) row.
table1.RowGroups(0).Rows.Add(new TableRow())
currentRow = table1.RowGroups(0).Rows(1)

' Global formatting for the header row.
currentRow.FontSize = 18
currentRow.FontWeight = FontWeights.Bold

' Add cells with content to the second row.
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Product"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 1"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 2"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 3"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 4"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("TOTAL"))))
// Add the second (header) row.
table1.RowGroups[0].Rows.Add(new TableRow());
currentRow = table1.RowGroups[0].Rows[1];

// Global formatting for the header row.
currentRow.FontSize = 18;
currentRow.FontWeight = FontWeights.Bold;

// Add cells with content to the second row.
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Product"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 1"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 2"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 3"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Quarter 4"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("TOTAL"))));

接著建立資料的資料列,並將其加入至資料表中,此資料列中會建立儲存格,並填入內容。 建置此資料列與建置頁首資料列相似,差別在於套用的格式略有不同。

' Add the third row.
table1.RowGroups(0).Rows.Add(new TableRow())
currentRow = table1.RowGroups(0).Rows(2)

' Global formatting for the row.
currentRow.FontSize = 12
currentRow.FontWeight = FontWeights.Normal

' Add cells with content to the third row.
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Widgets"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$50,000"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$55,000"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$60,000"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$65,000"))))
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$230,000"))))

' Bold the first cell.
currentRow.Cells(0).FontWeight = FontWeights.Bold
// Add the third row.
table1.RowGroups[0].Rows.Add(new TableRow());
currentRow = table1.RowGroups[0].Rows[2];

// Global formatting for the row.
currentRow.FontSize = 12;
currentRow.FontWeight = FontWeights.Normal;

// Add cells with content to the third row.
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Widgets"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$50,000"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$55,000"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$60,000"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$65,000"))));
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("$230,000"))));

// Bold the first cell.
currentRow.Cells[0].FontWeight = FontWeights.Bold;

最後建立頁尾資料列,並將其加入與格式化。 與標題資料列相同,頁尾也包含單一儲存格但擴展至資料表中全部六個資料行。

table1.RowGroups(0).Rows.Add(new TableRow())
currentRow = table1.RowGroups(0).Rows(3)

' Global formatting for the footer row.
currentRow.Background = Brushes.LightGray
currentRow.FontSize = 18
currentRow.FontWeight = System.Windows.FontWeights.Normal

' Add the header row with content, 
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Projected 2004 Revenue: $810,000"))))
' and set the row to span all 6 columns.
currentRow.Cells(0).ColumnSpan = 6
table1.RowGroups[0].Rows.Add(new TableRow());
currentRow = table1.RowGroups[0].Rows[3];

// Global formatting for the footer row.
currentRow.Background = Brushes.LightGray;
currentRow.FontSize = 18;
currentRow.FontWeight = System.Windows.FontWeights.Normal;

// Add the header row with content, 
currentRow.Cells.Add(new TableCell(new Paragraph(new Run("Projected 2004 Revenue: $810,000"))));
// and set the row to span all 6 columns.
currentRow.Cells[0].ColumnSpan = 6;

請參閱

工作

HOW TO:使用 XAML 定義資料表

HOW TO:使用非固定格式項目

概念

非固定格式文件概觀

WPF 中的文件