Tabloya Genel Bakış
Table, belge içeriğinin kılavuz tabanlı sunumunu destekleyen bir Flow öğesidir. Bu öğenin esnekliği onu çok yararlı hale getiriyor, ancak aynı zamanda doğru anlamak ve kullanmak daha karmaşık hale getiriyor.
Bu konuda aşağıdaki bölümler yer almaktadır.
[İlgili Konular]
Tablo Temelleri
Tablo Farklı ve Kılavuz nasıldır?
Table ve Grid bazı yaygın işlevleri paylaşır, ancak her biri farklı senaryolar için en uygun olandır. , Table akış içeriği içinde kullanım için tasarlanmıştır (akış içeriği hakkında Flow için Table Belgeye Genel Bakış). Kılavuzlar formların içinde (akış içeriğinin dışında herhangi bir yerde) en iyi şekilde kullanılır. içinde, sayfalama, sütun yeniden akışı ve içerik seçimi gibi akış içeriği davranışlarını destekler, FlowDocumentTable ancak Grid desteklemez. Öte yandan, satıra ve sütun dizinine göre öğe ekler gibi birçok nedenden dolayı bir dışında en iyi şekilde GridFlowDocumentGridTable kullanılır. öğesi, alt içeriğin katmanlamasına olanak sağlar ve tek bir "hücrede" birden fazla öğenin varolmalarına GridTable olanak sağlar. Katmanlamayı desteklemez. bir alt öğeleri Grid kesinlikle kendi "hücre" sınırlarının alanına göre konum olabilir. Table bu özelliği desteklemez. Son olarak, Grid bir daha az kaynak gerektirir, bu nedenle performansı geliştirmek için kullanmayı göz önünde TableGrid bulundurabilirsiniz.
Temel Tablo Yapısı
Table sütunlardan (öğelerle temsil edilen) ve satırlardan (öğelerle temsil edilen) oluşan TableColumn kılavuz tabanlı bir sunu TableRow sağlar. TableColumn öğeleri içerik barındırmaz; yalnızca sütunları ve sütunların özelliklerini tanımlar. TableRow öğelerinin tablo için satır TableRowGroup gruplama tanımlayan bir öğesinde barındır olması gerekir. TableCell tablo tarafından sunulacak gerçek içeriği içeren öğelerin bir öğesinde barındırnmış olması TableRow gerekir. TableCell yalnızca 'den türeten öğeleri Block içerebilir. Dahil etmek için geçerli alt TableCell öğeler.
Not
TableCell öğeleri doğrudan metin içeriğini barındırmayabilirsiniz. gibi akış içeriği öğelerine ilişkin içerik kuralları hakkında daha fazla bilgi için TableCell bkz. TableCell
Not
Table öğesine benzer, Grid ancak daha fazla özelliği vardır ve bu nedenle daha fazla kaynak yükü gerektirir.
Aşağıdaki örnek, XAML ile basit bir 2 x 3 tablosu tanımlar.
<!--
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>
Aşağıdaki şekilde, bu örneğin nasıl işlen olduğu gösterir.

Tablo Içerme
Table öğesinden Block türetilen ve düzey öğeleri için ortak Block kurallara bağlı. Bir Table öğe aşağıdaki öğelerden herhangi biri tarafından içerebilir:
Satır Gruplamaları
öğesi, bir tablo içindeki satırları rastgele gruplamanın bir TableRowGroup yolunu sağlar; tablodaki her satır bir satır grubuna ait olması gerekir. Bir satır grubu içindeki satırlar genellikle ortak bir amacı paylaşır ve grup olarak stile sahip olabilir. Satır gruplamalarında yaygın olarak kullanılan bir kullanım, başlık, üst bilgi ve alt bilgi satırları gibi özel amaçlı satırları tablonun içerdiği birincil içerikten ayırmaktır.
Aşağıdaki örnekte stile sahip üst bilgi ve alt bilgi satırları içeren bir tablo tanımlamak için XAML kullanılır.
<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>
Aşağıdaki şekilde, bu örneğin nasıl işlen olduğu gösterir.

Arka Plan İşleme Önceliği
Tablo öğeleri aşağıdaki sırayla (z-order from lowest to highest) işler. Bu sıra değiştirilemez. Örneğin, bu öğelerin bu kurulan siparişi geçersiz kılmak için kullanabileceğiniz bir "Z-order" özelliği yoktur.
Bir tablo içindeki bu öğelerin her biri için arka plan renklerini tanımlayan aşağıdaki örneği göz önünde bulundurabilirsiniz.
<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>
Aşağıdaki şekilde, bu örneğin nasıl işlen olduğu (yalnızca arka plan renkleri gösteriliyor) gösteriliyor.

Yayılan Satırlar veya Sütunlar
Tablo hücreleri, sırasıyla veya öznitelikleri kullanılarak birden çok satıra veya sütuna RowSpanColumnSpan yayacak şekilde yalıtabilirsiniz.
Bir hücrenin üç sütuna yay olduğu aşağıdaki örneği göz önünde bulundurabilirsiniz.
<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>
Aşağıdaki şekilde, bu örneğin nasıl işlen olduğu gösterir.

Kodla Tablo Bina
Aşağıdaki örneklerde, program aracılığıyla bir oluşturma ve Table içerikle doldurmak için nasıl bir uygulamanın nasıl oluşturularak ilgili örnekler verilmiştir. Tablonun içeriği beş satıra (bir nesnede yer alan nesnelerle temsil edilen) ve TableRowRowGroups altı sütuna (nesnelerle temsil edilen) TableColumn ek olarak bulunur. Satırlar, tablonun tamamına başlık eklemeye yönelik bir başlık satırı, tablodaki veri sütunlarını açıklamak için bir üst bilgi satırı ve özet bilgileri içeren bir alt bilgi satırı dahil olmak üzere farklı sunum amaçları için kullanılır. "başlık", "üst bilgi" ve "alt bilgi" satırları ifadesinin tabloda doğal olmadığını unutmayın; Bunlar yalnızca farklı özelliklere sahip satırlardır. Tablo hücreleri metinlerden, görüntülerden veya neredeyse diğer tüm kullanıcı arabirimi (UI) öğesilerden oluşacak gerçek içeriği içerir.
İlk FlowDocument olarak, barındıracak bir oluşturulur ve yeni bir oluşturulur ve TableTable içeriğinin içeriğine FlowDocument eklenir.
// 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
Ardından, birkaç biçimlendirme uygulanmış şekilde altı nesne oluşturulur ve TableColumnColumns tablonun koleksiyonuna eklenir.
Not
Tablonun koleksiyonunun standart Columns sıfır tabanlı dizinleme kullandığını unutmayın.
// 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 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
Ardından, bir başlık satırı oluşturulur ve bazı biçimlendirmelerin uygulandığı tabloya eklenir. Başlık satırı, tablodaki altı sütunun tamamlarına yayılan tek bir hücre içerir.
// 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;
' 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
Ardından bir üst bilgi satırı oluşturularak tabloya eklenir ve üst bilgi satırındaki hücreler oluşturulur ve içerikle doldurulur.
// 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"))))
Ardından, veriler için bir satır oluşturularak tabloya eklenir ve bu satırdaki hücreler oluşturulur ve içerikle doldurulur. Bu satırın inşası, biraz farklı biçimlendirme uygulanmış şekilde üst bilgi satırına benzer.
// 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
Son olarak bir alt bilgi satırı oluşturulur, eklenir ve biçimlendirildi. Başlık satırı gibi alt bilgi de tablodaki altı sütuna yayılan tek bir hücre içerir.
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