Export (0) Print
Expand All
1 out of 2 rated this helpful - Rate this topic

TileBrush::Viewport Property

Gets or sets the position and dimensions of the base tile for a TileBrush.

Namespace:  System.Windows.Media
Assembly:  PresentationCore (in PresentationCore.dll)
XMLNS for XAML: http://schemas.microsoft.com/winfx/2006/xaml/presentation, http://schemas.microsoft.com/netfx/2007/xaml/presentation
public:
property Rect Viewport {
	Rect get ();
	void set (Rect value);
}
<object>
  <object.Viewport>
    <Rect .../>
  </object.Viewport>
</object>
<object Viewport="Rect" .../>

Property Value

Type: System.Windows::Rect
The position and dimensions of the base tile for a TileBrush. The default value is a rectangle (Rect) with a TopLeft of (0,0) and a Width and Height of 1.

Identifier field

ViewportProperty

Metadata properties set to true

None

When you paint an area by using a TileBrush, you use three components: content, tiles, and the output area. The following illustration shows how these three TileBrush components relate to each other.

Components of a TileBrush with a single tile

TileBrush components
Components of a TileBrush with a TileMode of Tile

Components of a tiled TileBrush

The Viewport property determines the size and position of the tiles in a TileBrush. By default, a TileBrush has a single tile that fills the whole output area. The Stretch property controls how the TileBrush content fits into that tile. You can override this default behavior and specify the tile size by using the Viewport property.

Use the ViewportUnits property to specify whether the Viewport uses absolute or relative coordinates. If the coordinates are relative, they are relative to the size of the output area. The point (0,0) represents the upper-left corner of the output area, and (1,1) represents the lower-right corner of the output area. To specify that the Viewport property uses absolute coordinates, set the ViewportUnits property to Absolute.

The following illustration shows the difference in output when you set the ViewportUnits property of a TileBrush to either relative or absolute.

Relative and absolute ViewportUnits

Absolute and Relative Viewport Units

This example shows how to set the tile size for a TileBrush. By default, a TileBrush produces a single tile that completely fills the area that you are painting. You can override this behavior by setting the Viewport and ViewportUnits properties.

The Viewport property specifies the tile size for a TileBrush. By default, the value of the Viewport property is relative to the size of the area being painted. To make the Viewport property specify an absolute tile size, set the ViewportUnits property to Absolute.

The following example uses an ImageBrush, a type of TileBrush, to paint a rectangle with tiles. The example sets each tile to 50 percent by 50 percent of the output area (the rectangle). As a result, the rectangle is painted with four projections of the image.

The following illustration shows the output that the example produces.

Example of tiling with an image brush

No code example is currently available or this language may not be supported.
<!-- The ImageBrush's tiles are set to 50% by 50% of the output area. -->
<Rectangle
  Width="200" Height="150"
  Stroke="LimeGreen" StrokeThickness="1">
  <Rectangle.Fill>
    <ImageBrush
      Viewport="0,0,0.5,0.5"
      TileMode="Tile"
      ImageSource="sampleImages\cherries_larger.jpg" />
  </Rectangle.Fill>
</Rectangle>

The next example creates an ImageBrush, sets its Viewport to 0,0,25,25 and its ViewportUnits to Absolute, and uses it to paint another rectangle. As a result, the brush produces tiles that have a width of 25 pixels and a height of 25 pixels.

The following illustration shows the output that the example produces.

A tiled TileBrush with a Viewport of 0,0,0.25,0.25

No code example is currently available or this language may not be supported.
<!-- The ImageBrush's tiles are set to 25 by 25 pixels. -->
<Rectangle
  Width="200" Height="150"
  Stroke="LimeGreen" StrokeThickness="1">
  <Rectangle.Fill>
    <ImageBrush
      Viewport="0,0,25,25"
      ViewportUnits="Absolute"
      TileMode="Tile"
      ImageSource="sampleImages\cherries_larger.jpg" />
  </Rectangle.Fill>
</Rectangle>

The preceding examples are part of a larger sample. For the complete sample, see ImageBrush Sample.

Although this example uses the ImageBrush class, the Viewport and ViewportUnits properties behave identically for the other TileBrush objects, that is, for DrawingBrush and VisualBrush. For more information about ImageBrush and the other TileBrush objects, see Painting with Images, Drawings, and Visuals.

More Code

How to: Create Different Tile Patterns with a TileBrushThis example shows how to use the TileMode property of a TileBrush to create a pattern.

.NET Framework

Supported in: 4.5.1, 4.5, 4, 3.5, 3.0

.NET Framework Client Profile

Supported in: 4, 3.5 SP1

Windows Phone 8.1, Windows Phone 8, Windows 8.1, Windows Server 2012 R2, Windows 8, Windows Server 2012, Windows 7, Windows Vista SP2, Windows Server 2008 (Server Core Role not supported), Windows Server 2008 R2 (Server Core Role supported with SP1 or later; Itanium not supported)

The .NET Framework does not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.

Did you find this helpful?
(1500 characters remaining)
Thank you for your feedback
Show:
© 2014 Microsoft. All rights reserved.