Windows apps
Collapse the table of content
Expand the table of content
Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

Panel.ZIndex Attached Property

Gets or sets a value that represents the order on the z-plane in which an element appears.

Namespace: System.Windows.Controls
Assembly: PresentationFramework (in PresentationFramework.dll)
XML Namespace:  http://schemas.microsoft.com/winfx/2006/xaml/presentation

See Panel.GetZIndex, Panel.SetZIndex
See Panel.GetZIndex, Panel.SetZIndex
See Panel.GetZIndex, Panel.SetZIndex
<object Panel.ZIndex="int" .../>

Property Value

The order on the z-plane in which this element appears.

Identifier field

ZIndexProperty

Metadata properties set to true

None

The greater the value of a given element, the more likely the element is to appear in the foreground. Likewise, if an element has a relatively low value, the element will likely appear in the background. For example, an element that has a value of five will appear above an element that has a value of four, which in turn will appear above an element that has a value of three, and so on. Negative values are allowed, and they continue this precedence pattern.

Members of a Children collection that have equal ZIndex values are rendered in the order in which they appear in the visual tree. You can determine the index position of a child by iterating the members of the Children collection.

The following example demonstrates how to set the value of the ZIndex property by using Extensible Application Markup Language (XAML) and code.


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

// Create the Canvas
myCanvas = new Canvas();

// Create the child Rectangle elements
myRectangle1 = new Rectangle();
myRectangle2 = new Rectangle();
myRectangle3 = new Rectangle();
myRectangle4 = new Rectangle();
myRectangle5 = new Rectangle();
myRectangle6 = new Rectangle();

// Set properties on the Rectangle elements
Canvas.SetTop(myRectangle1, 100);
Canvas.SetLeft(myRectangle1, 100);
Canvas.SetZIndex(myRectangle1, 3);
myRectangle1.Fill = Brushes.Blue;
myRectangle1.Width = 100;
myRectangle1.Height = 100;

Canvas.SetTop(myRectangle2, 150);
Canvas.SetLeft(myRectangle2, 150);
Canvas.SetZIndex(myRectangle2, 1);
myRectangle2.Fill = Brushes.Yellow;
myRectangle2.Width = 100;
myRectangle2.Height = 100;

Canvas.SetTop(myRectangle3, 200);
Canvas.SetLeft(myRectangle3, 200);
Canvas.SetZIndex(myRectangle3, 2);
myRectangle3.Fill = Brushes.Green;
myRectangle3.Width = 100;
myRectangle3.Height = 100;

Canvas.SetTop(myRectangle4, 300);
Canvas.SetLeft(myRectangle4, 200);
Canvas.SetZIndex(myRectangle4, 1);
myRectangle4.Fill = Brushes.Green;
myRectangle4.Width = 100;
myRectangle4.Height = 100;

Canvas.SetTop(myRectangle5, 350);
Canvas.SetLeft(myRectangle5, 150);
Canvas.SetZIndex(myRectangle5, 3);
myRectangle5.Fill = Brushes.Yellow;
myRectangle5.Width = 100;
myRectangle5.Height = 100;

Canvas.SetTop(myRectangle6, 400);
Canvas.SetLeft(myRectangle6, 100);
Canvas.SetZIndex(myRectangle6, 2);
myRectangle6.Fill = Brushes.Blue;
myRectangle6.Width = 100;
myRectangle6.Height = 100;

// Add the Rectangles to the Canvas' Children collection
myCanvas.Children.Add(myRectangle1);
myCanvas.Children.Add(myRectangle2);
myCanvas.Children.Add(myRectangle3);
myCanvas.Children.Add(myRectangle4);
myCanvas.Children.Add(myRectangle5);
myCanvas.Children.Add(myRectangle6);

// Add the Canvas as the Content of the parent Window Object
mainWindow.Content = myCanvas;
mainWindow.Show ();


<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="ZIndex Sample">
  <Canvas>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="100" Canvas.Left="100" Fill="blue"/>
    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="150" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="200" Canvas.Left="200" Fill="green"/>

    <!-- Reverse the order to illustrate z-index property -->

    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="300" Canvas.Left="200" Fill="green"/>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="350" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="400" Canvas.Left="100" Fill="blue"/>
  </Canvas>
</Page>

Windows 98, Windows Server 2000 SP4, Windows CE, Windows Millennium Edition, Windows Mobile for Pocket PC, Windows Mobile for Smartphone, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter Edition

The Microsoft .NET Framework 3.0 is supported on Windows Vista, Microsoft Windows XP SP2, and Windows Server 2003 SP1.

Community Additions

Show:
© 2017 Microsoft