locked
Z Order of controls RRS feed

  • 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
    • Edited by cgraus Saturday, June 26, 2010 11:51 PM Added some detail
    Saturday, June 26, 2010 10:28 PM

Answers

  • 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
    • Marked as answer by cgraus Sunday, June 27, 2010 9:12 PM
    Sunday, June 27, 2010 11:39 AM

All replies

  • 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.  

    • Proposed as answer by 8xFather Sunday, June 27, 2010 1:53 AM
    Sunday, June 27, 2010 1:52 AM
  • 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
    • Marked as answer by cgraus Sunday, June 27, 2010 9:12 PM
    Sunday, June 27, 2010 11:39 AM
  • 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
    Sunday, June 27, 2010 9:10 PM