Use WPF Canvas Layout Control in VB.NET
In this article, we will learn Canvas Layout Control in WPF.
In this article, we will learn Canvas Layout control in WPF.
Canvas Layout Control :- Canvas Layout Control use for deign the application in WPF. The Canvas is a layout control in xaml. Canvas Layout like the four properties in its child element Left Property, Right Property, Top Property and Bottom Property. The Left property represents the distance between the left side of a control and its parent container Canvas. The Top property represents the distance between the top of a control and its parent container Canvas.
We will use TextBox in example for canvas layout control.
Example:-
<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
<Border Background="Plum"
CornerRadius="20"
BorderBrush="Red"
BorderThickness="2">
<Canvas>
<TextBox Background="OrangeRed" Grid.Row="0" Grid.Column="0"
Canvas.Top="10" Canvas.Left="10" Height="30" FontSize="15"
Foreground="white">
Canvas Layout 1
</TextBox>
<TextBox Background="Green" Grid.Row="1" Grid.Column="0"
Canvas.Top="50" Canvas.Left="120" Height="30" FontSize="15"
Foreground="white">
Canvas Layout 2
</TextBox>
<TextBox Background="White" Grid.Row="1" Grid.Column="1"
Canvas.Top="115" Canvas.Right="70" Height="30" FontSize="15"
Foreground="Red">
Canvas Layout 3
</TextBox>
<TextBox Background="Green" Grid.Row="1" Grid.Column="1"
Canvas.Bottom="50" Canvas.Right="120" Height="30" FontSize="15"
Foreground="white">
Canvas Layout 4
</TextBox>
<TextBox Background="OrangeRed" Grid.Row="0" Grid.Column="1"
Canvas.Bottom="10" Canvas.Right="10" Height="30" FontSize="15"
Foreground="white">
Canvas Layout 5
</TextBox>
</Canvas>
</Border>
</Grid>
</Window>
Output:-
