Scene Order (Layer Order) in XAML Silverlight

Introduction

XAML is fully based on composition of object scenes. Every XAML page has a parent/top most container (like UserControl/Canvas/Page etc) and it may have zero or more children elements (like Grid/Rectange/Ellipse etc). Look at the example below:



In the above screenshot, I have used three elements named LayoutRoot, LayoutRoot1 and Rec1. LayoutRoot (white background) is lower most (beneath); look at the code above and examine the order of elements:

1. LayoutRoot (Grid)
2. LayoutRoot1 (Grid)
3. Rec1 (Rectangle)

Please note that, usually we write code in a top to bottom approach in general, so the order of shapes (elements) also varies on this. If you wish to bring "LayoutRoot (White Grid)" to the front then the order of elements will also be rearranged automatically. Look at the screenshot below:



In the above screenshot, I'm bringing the white art (LayoutRoot) to the front; then, in the code window that grid will also be rearranged. Look at the screenshot below:



In the above screenshot, white art is now on top and the code is correspondingly rearranged (means bottom to top).

That's all about the order of shapes (elements) in XAML.

Be tuned for the next post.

HAVE A HAPPY CODING!!