Z Order of controls

Question

I have a Grid with two rows.  The top area is a slider.  The slider control hangs down into the bottom area, so the grabber is actually in the bottom row.  In the bottom row on the left I have a Rectangle that shows an image.  The issue is that I can sometimes grab my slider in the area in the bottom row if it's NOT over the Rectangle ( sometimes not ) and never if it's over the Rectangle.  I can't find anything like a BringToFront() or a ZIndex property.  How do I make it so that my slider is grabbable when it's on top of the Rectangle ?

I've tried Grid.SetZIndex, I set the Rectangle to 2, and the control that has the slider to 0.  It still does not work.

Thanks

---

Christian Graus

Answer 1

If slider.SetValue(Grid.ZIndexProperty, 1); didn’t work for you then try moving your slider to the bottom of your XAML. The default zorder is based on the position of the control in the XAML.  

Answer 2

Hi Christian,

I'm uncertain as to how your layout looks exactly. However, if you're really applying a negative bottom margin to your slider, you could use Panel.ZIndex in order to set the slider's ZIndex to a value that's higher than the one of the Rectangle:

<Grid>
  <Grid.RowDefinitions>
   <RowDefinition Height="Auto"/>
   <RowDefinition Height="*"/>
  </Grid.RowDefinitions>
  <Slider Minimum="0" Maximum="100" Margin="0,0,0,-15" Panel.ZIndex="1"/>
  <Rectangle Width="50" Height="50" Fill="Blue" Grid.Row="1" HorizontalAlignment="Left"/>
</Grid>

---

Cheers,
Olaf
http://blogs.intuidev.com

Answer 3

Thanks guys - I have tried that, and Olaf's example is a reasonable approximation of what I have - two rows in a grid, with a Rectangle in row 1 and the slider in row 0.  I've set the Z index of the Rectangle to 3 and of the slider to 1.  It still does not work.  My Rectangle covers about the first 1/3 of the area in row 1, and when I move the slider using the area that's inside the control, I can move it over to the right, and from the right, I can grab the slider that hangs down.  When I move it back over the rectangle, the rectangle again covers the slider, so that I can't grab it.

OK - I got it.  My issue was that the control was inside two stack panels, and the Z Index doesn't propagate, I needed to manually set it all the way up the tree.  Thanks for the help !!! 

 

---

Christian Graus