--- title: "How to: Set the Horizontal and Vertical Alignment of a TileBrush" ms.date: "03/30/2017" dev_langs: - "csharp" - "vb" helpviewer_keywords: - "TileBrush [WPF], alignment of" - "vertical alignment of TileBrushes [WPF]" - "aligning [WPF], TileBrushes" - "horizontal alignment of Tilebrushes [WPF]" ms.assetid: 65ae89bd-9246-4c9e-bde4-2fb991d4060d --- # How to: Set the Horizontal and Vertical Alignment of a TileBrush This example shows how to control the horizontal and vertical alignment of content in a tile. To control the horizontal and vertical alignment of a , use its and properties. The and properties of a are used when either of the following conditions is true: - The property is or and the and have different aspect ratios. - The property is and the and are different sizes. ## Example The following example aligns the content of a , which is a type of , to the upper-left corner of its tile. To align the content, the example sets the property of the to and the property to . This example produces the following output. ![A TileBrush with top-left alignment](./media/graphicsmm-tilebrushalignmentexampletopleft.png "graphicsmm_TileBrushAlignmentExampleTopLeft") TileBrush with content aligned to the upper-left corner [!code-csharp[brushoverviewexamples_snip#TileBrushTopLeftAlignmentInline](~/samples/snippets/csharp/VS_Snippets_Wpf/BrushOverviewExamples_snip/CSharp/TileBrushAlignmentExample.cs#tilebrushtopleftalignmentinline)] [!code-vb[brushoverviewexamples_snip#TileBrushTopLeftAlignmentInline](~/samples/snippets/visualbasic/VS_Snippets_Wpf/BrushOverviewExamples_snip/visualbasic/tilebrushalignmentexample.vb#tilebrushtopleftalignmentinline)] [!code-xaml[brushoverviewexamples_snip#TileBrushTopLeftAlignmentInline](~/samples/snippets/xaml/VS_Snippets_Wpf/BrushOverviewExamples_snip/XAML/TileBrushAlignmentExample.xaml#tilebrushtopleftalignmentinline)] ## Example The next example aligns the content of a to the lower-right corner of its tile by setting the property to and the property to . The example produces the following output. ![A TileBrush with bottom-right alignment](./media/graphicsmm-tilebrushalignmentexamplebottomright.png "graphicsmm_TileBrushAlignmentExampleBottomRight") TileBrush with content aligned to the lower-right corner [!code-csharp[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/csharp/VS_Snippets_Wpf/BrushOverviewExamples_snip/CSharp/TileBrushAlignmentExample.cs#tilebrushbottomrightalignmentinline)] [!code-vb[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/visualbasic/VS_Snippets_Wpf/BrushOverviewExamples_snip/visualbasic/tilebrushalignmentexample.vb#tilebrushbottomrightalignmentinline)] [!code-xaml[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/xaml/VS_Snippets_Wpf/BrushOverviewExamples_snip/XAML/TileBrushAlignmentExample.xaml#tilebrushbottomrightalignmentinline)] ## Example The next example aligns the content of a to the upper-left corner of its tile by setting the property to and the property to . It also sets the and of the to produce a tile pattern. The example produces the following output. ![A tiled TileBrush with top-left alignment](./media/graphicsmm-tilebrushalignmentexampletoplefttiled.png "graphicsmm_TileBrushAlignmentExampleTopLeftTiled") Tile pattern with content aligned to upper-left in base tile The illustration highlights abase tile so that you can see how its content is aligned. Notice that the setting has no effect because the content of the completely fills the base tile horizontally. [!code-csharp[brushoverviewexamples_snip#TileBrushTopLeftAlignmentTiledInline](~/samples/snippets/csharp/VS_Snippets_Wpf/BrushOverviewExamples_snip/CSharp/TileBrushAlignmentExample.cs#tilebrushtopleftalignmenttiledinline)] [!code-vb[brushoverviewexamples_snip#TileBrushTopLeftAlignmentTiledInline](~/samples/snippets/visualbasic/VS_Snippets_Wpf/BrushOverviewExamples_snip/visualbasic/tilebrushalignmentexample.vb#tilebrushtopleftalignmenttiledinline)] [!code-xaml[brushoverviewexamples_snip#TileBrushTopLeftAlignmentTiledInline](~/samples/snippets/xaml/VS_Snippets_Wpf/BrushOverviewExamples_snip/XAML/TileBrushAlignmentExample.xaml#tilebrushtopleftalignmenttiledinline)] ## Example The final example aligns the content of a tiled to the lower-right of its base tile by setting the property to and the property to . The example produces the following output. ![A tiled TileBrush with bottom-right alignment](./media/graphicsmm-tilebrushalignmentexamplebottomrighttiled.png "graphicsmm_TileBrushAlignmentExampleBottomRightTiled") Tile pattern with content aligned to lower-right in base tile Again, the setting has no effect because the content of the completely fills the base tile horizontally. [!code-csharp[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/csharp/VS_Snippets_Wpf/BrushOverviewExamples_snip/CSharp/TileBrushAlignmentExample.cs#tilebrushbottomrightalignmentinline)] [!code-vb[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/visualbasic/VS_Snippets_Wpf/BrushOverviewExamples_snip/visualbasic/tilebrushalignmentexample.vb#tilebrushbottomrightalignmentinline)] [!code-xaml[brushoverviewexamples_snip#TileBrushBottomRightAlignmentInline](~/samples/snippets/xaml/VS_Snippets_Wpf/BrushOverviewExamples_snip/XAML/TileBrushAlignmentExample.xaml#tilebrushbottomrightalignmentinline)] The examples use objects to demonstrate how the and properties are used. These properties behave identically for all the tile brushes: , , and . For more information about tile brushes, see [Painting with Images, Drawings, and Visuals](painting-with-images-drawings-and-visuals.md). ## See also - - - - [Painting with Images, Drawings, and Visuals](painting-with-images-drawings-and-visuals.md)