Canvas Class

Definition

Defines an area within which you can explicitly position child elements by using coordinates that are relative to the Canvas area.

public class Canvas : System.Windows.Controls.Panel
Inheritance

Inherited Members

System.Object

System.Windows.Controls.Panel

System.Windows.DependencyObject

System.Windows.FrameworkElement

System.Windows.Media.Visual

System.Windows.Threading.DispatcherObject

System.Windows.UIElement

Examples

The following example produces three Rectangle elements, each element 100 pixels. The first Rectangle is red, and its upper-left (x, y) position is specified as (0, 0). The second Rectangle is green, and its upper-left position is (100, 100), which is just below, and to the right of, the first square. The third Rectangle is blue, and its upper-left position is (50, 50). Hence, the third Rectangle covers the lower-right quadrant of the first Rectangle and the upper-left quadrant of the second. Because the third Rectangle is laid out last, it appears to be on top of the other two squares—that is, the overlapping portions assume the color of the third Rectangle.


// Create the application's main window
mainWindow = new Window ();
mainWindow.Title = "Canvas Sample";

// Create the Canvas
myParentCanvas = new Canvas();
myParentCanvas.Width = 400;
myParentCanvas.Height = 400;

// Define child Canvas elements
myCanvas1 = new Canvas();
myCanvas1.Background = Brushes.Red;
myCanvas1.Height = 100;
myCanvas1.Width = 100;
Canvas.SetTop(myCanvas1, 0);
Canvas.SetLeft(myCanvas1, 0);

myCanvas2 = new Canvas();
myCanvas2.Background = Brushes.Green;
myCanvas2.Height = 100;
myCanvas2.Width = 100;
Canvas.SetTop(myCanvas2, 100);
Canvas.SetLeft(myCanvas2, 100);

myCanvas3 = new Canvas();
myCanvas3.Background = Brushes.Blue;
myCanvas3.Height = 100;
myCanvas3.Width = 100;
Canvas.SetTop(myCanvas3, 50);
Canvas.SetLeft(myCanvas3, 50);

// Add child elements to the Canvas' Children collection
myParentCanvas.Children.Add(myCanvas1);
myParentCanvas.Children.Add(myCanvas2);
myParentCanvas.Children.Add(myCanvas3);
           
// Add the parent Canvas as the Content of the Window Object
mainWindow.Content = myParentCanvas;
mainWindow.Show ();

WindowTitle = "Canvas Sample"
'Create a Canvas as the root Panel
Dim myParentCanvas As New Canvas()
myParentCanvas.Width = 400
myParentCanvas.Height = 400

' Define child Canvas elements
Dim myCanvas1 As New Canvas()
myCanvas1.Background = Brushes.Red
myCanvas1.Height = 100
myCanvas1.Width = 100
Canvas.SetTop(myCanvas1, 0)
Canvas.SetLeft(myCanvas1, 0)

Dim myCanvas2 As New Canvas()
myCanvas2.Background = Brushes.Green
myCanvas2.Height = 100
myCanvas2.Width = 100
Canvas.SetTop(myCanvas2, 100)
Canvas.SetLeft(myCanvas2, 100)

Dim myCanvas3 As New Canvas()
myCanvas3.Background = Brushes.Blue
myCanvas3.Height = 100
myCanvas3.Width = 100
Canvas.SetTop(myCanvas3, 50)
Canvas.SetLeft(myCanvas3, 50)

' Add child elements to the Canvas' Children collection
myParentCanvas.Children.Add(myCanvas1)
myParentCanvas.Children.Add(myCanvas2)
myParentCanvas.Children.Add(myCanvas3)

' Add the parent Canvas as the Content of the Window Object
Me.Content = myParentCanvas
<Page WindowTitle="Canvas Sample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <Canvas Height="400" Width="400">
    <Canvas Height="100" Width="100" Top="0" Left="0" Background="Red"/>
    <Canvas Height="100" Width="100" Top="100" Left="100" Background="Green"/>
    <Canvas Height="100" Width="100" Top="50" Left="50" Background="Blue"/>
  </Canvas>
</Page>

Remarks

A Canvas contains a collection of UIElement objects, which are in the Children property.

Canvas is the only panel element that has no inherent layout characteristics. A Canvas has default Height and Width properties of zero, unless it is the child of an element that automatically sizes its child elements. Child elements of a Canvas are never resized, they are just positioned at their designated coordinates. This provides flexibility for situations in which inherent sizing constraints or alignment are not needed or wanted. For cases in which you want child content to be automatically resized and aligned, it is usually best to use a Grid element.

The ZIndex property determines the order in which child elements that share the same coordinate space appear. A higher ZIndex value for one child element indicates that this element will appear above another child element that has a lower value.

If you specify them, the attached properties Top or Left take priority over the Bottom or Right properties.

Child elements of a Canvas are always given the full size that they desire. As a result, vertical alignment and horizontal alignment have no effect inside a Canvas.

Canvas is a top-level layout control that you can use for absolute positioning of child content. For painting and drawing, you use brushes and do not have to use a Canvas. For more information, see Painting with Solid Colors and Gradients Overview.

By default, panel elements do not receive focus. To compel a panel element to receive focus, set the Focusable property to true.

Constructors

Canvas()

Initializes a new instance of the Canvas class.

Fields

BottomProperty

Identifies the System.Windows.Controls.Canvas.Bottom attached property.

LeftProperty

Identifies the System.Windows.Controls.Canvas.Left attached property.

RightProperty

Identifies the System.Windows.Controls.Canvas.Right attached property.

TopProperty

Identifies the System.Windows.Controls.Canvas.Top attached property.

Methods

ArrangeOverride(Size)

Arranges the content of a Canvas element.

GetBottom(UIElement)

Returns the value of the System.Windows.Controls.Canvas.Bottom attached property for a given dependency object.

GetLayoutClip(Size)

Returns a clipping geometry that indicates the area that will be clipped if the ClipToBounds property is set to true.

GetLeft(UIElement)

Gets the value of the System.Windows.Controls.Canvas.Left attached property for a given dependency object.

GetRight(UIElement)

Gets the value of the System.Windows.Controls.Canvas.Right attached property for a given dependency object.

GetTop(UIElement)

Gets the value of the System.Windows.Controls.Canvas.Top attached property for a given dependency object.

MeasureOverride(Size)

Measures the child elements of a Canvas in anticipation of arranging them during the ArrangeOverride(Size) pass.

SetBottom(UIElement, Double)

Sets the value of the System.Windows.Controls.Canvas.Bottom attached property for a given dependency object.

SetLeft(UIElement, Double)

Sets the value of the System.Windows.Controls.Canvas.Left attached property for a given dependency object.

SetRight(UIElement, Double)

Sets the value of the System.Windows.Controls.Canvas.Right attached property for a given dependency object.

SetTop(UIElement, Double)

Sets the value of the System.Windows.Controls.Canvas.Top attached property for a given dependency object.