AnimatedCanvas
This panel allows child elements to be precisely positioned using coordinates that are relative to the panel's bounds.
Note
This panel can be used as a drop-in replacement for the native Canvas
panel.
Overview
The AnimatedCanvas does not have any inherent layout logic. Child elements are positioned at the specified loctaions, and are always allotted their desired size.
The Panel.ZIndex
property is used to determine the order of child elements that overlap. Elements with a higher ZIndex
will appear on top of elements with a lower value.
Child elements are positioned using the attached properties AnimatedCanvas.LeftProperty, AnimatedCanvas.TopProperty, AnimatedCanvas.RightProperty, and/or AnimatedCanvas.BottomProperty. The LeftProperty
indicates the offset of the element from the left edge of the panel, using either a positive (moving to the right) or a negative (moving offscreen to the left) value. The TopProperty
indicates the offset of the element from the top edge of the panel, using either a positive (moving downwards) or a negative (moving upwards and offscreen) value. Likewise, the RightProperty
and BottomProperty
specify the offset of the element from the right and bottom edges, respectively.
Note
If both the LeftProperty
and RightProperty
are specified on an element, then the LeftProperty
takes precedence and the RightProperty
is ignored. Similarly, the TopProperty
takes precedence over the BottomProperty
.
Getting Started with AnimatedCanvas
This code shows typical XAML code used to position elements in an AnimatedCanvas:
xmlns:views="http://schemas.actiprosoftware.com/winfx/xaml/views"
...
<views:AnimatedCanvas>
<!-- Positioned 10 pixels to the right and 10 pixels down from the top-left corner of the panel. -->
<Button Content="One" views:AnimatedCanvas.Left="10" views:AnimatedCanvas.Top="10" \>
<!-- Positioned 10 pixels to the left and 10 pixels up from the bottom-right corner of the panel. -->
<Button Content="Two" views:AnimatedCanvas.Right="10" views:AnimatedCanvas.Bottom="10" \>
</views:AnimatedCanvas>
Important Members
The following AnimatedCanvas members are key to its use:
Member | Description |
---|---|
BottomProperty Attached Property | Gets or sets the offset of the element from the bottom edge of the panel. |
LeftProperty Attached Property | Gets or sets the offset of the element from the left edge of the panel. |
RightProperty Attached Property | Gets or sets the offset of the element from the right edge of the panel. |
TopProperty Attached Property | Gets or sets the offset of the element from the top edge of the panel. |
ZIndex Attached Property (defined on Panel ) |
Gets or sets the z-order of the element in the panel. |