Files
docs-desktop/dotnet-desktop-guide/framework/wpf/controls/how-to-create-a-grid-element.md
T
Andy De George da363692ff Initial WPF content migrated (#17)
* Reset branch for WPF changes

* Convert BMP to PNG; fix link-out-of-scope err

* Add snippets for WPF... 6794 files!!!!

* Add missing snippets

* update file updated between migration

* Fix paths to include

* update breadcrumb and toc

* fix index links

* fix index links

* fix index links

* fix markdown
2020-09-04 09:46:28 -07:00

1.9 KiB

title, ms.date, dev_langs, helpviewer_keywords, ms.assetid
title ms.date dev_langs helpviewer_keywords ms.assetid
How to: Create a Grid Element 03/30/2017
csharp
vb
Grid control [WPF], creating [WPF], grid instance
b2f07626-9df8-43b8-8d36-492f3cb42837

How to: Create a Grid Element

Example

The following example shows how to create and use an instance of xref:System.Windows.Controls.Grid by using either [!INCLUDETLA#tla_xaml] or code. This example uses three xref:System.Windows.Controls.ColumnDefinition objects and three xref:System.Windows.Controls.RowDefinition objects to create a grid that has nine cells, such as in a worksheet. Each cell contains a xref:System.Windows.Controls.TextBlock element that represents data, and the top row contains a xref:System.Windows.Controls.TextBlock with the xref:System.Windows.Controls.Grid.ColumnSpan%2A property applied. To show the boundaries of each cell, the xref:System.Windows.Controls.Grid.ShowGridLines%2A property is enabled.

[!code-csharpGrid#3] [!code-vbGrid#3] [!code-xamlGrid#3]

Either approach will generate a user interface that looks much the same, like the one below.

a screenshot depicts a WPF user interface which contains a grid broken into three columns.  It bears the heading '2018 Products Shipped' spanning all columns of the top row, and has three columns each with sales figures for a certain quarter.  The bottom row has text spanning two columns with the message 'Total Units: 300,000'

See also