Viewbox

The Viewbox is a decorator control which scales its child. It can be used to scale its child to fit the available space.
The Viewbox gives its child infinite space in the measure phase. It will constrain either or both sides when arranging it. This depends on the value of the Stretch.
To restrict scaling direction one can use StretchDirection which can prevent up or down scaling.
XAML
C#
1
<!-- Ellipse will occupy 50x50px space -->
2
<Ellipse Width="50" Height="50" Fill="CornflowerBlue" />  
3
​
4
<!-- Ellipse will be scaled to occupy 300x300px space -->
5
<Viewbox Stretch="Uniform" Width="300" Height="300">
6
	<Ellipse Width="50" Height="50" Fill="CornflowerBlue" />  
7
</Viewbox>
Copied!
1
// Ellipse will occupy 50x50px space
2
new Ellipse
3
{
4
	Width = 50,
5
	Height = 50,
6
	Fill = Brushes.CornflowerBlue
7
};
8
​
9
// Ellipse will be scaled to occupy 300x300px space
10
new Viewbox
11
{
12
	Stretch = Stretch.Uniform,
13
	Width = 300,
14
	Height = 300,
15
	Child = new Ellipse
16
	{
17
		Width = 50,
18
		Height = 50,
19
		Fill = Brushes.CornflowerBlue
20
	}
21
};
Copied!
Common Properties
Property
Type
Default
Description
Stretch
​Stretch​
Uniform
Determines how child fits into the available space
StretchDirection
​StretchDirection​
Both
Determines in what direction child will be scaled
Examples
Stretch
​
Uniform
​
​
​
UniformToFill
​
​
​
Fill
​
​
​
None
​
​
​
StretchDirection
​
Both
​
​
UpOnly
​
​
​
DownOnly
​
​
​
Pseudoclasses
None
Reference
​Viewbox​
Source code
​Viewbox.cs​

UserControl

Window

Last modified 1yr ago

Export as PDF

Copy link

Edit on GitHub

Contents