WPF ContentControl set ZIndex to child ZIndex

Question

I need to be able to set a Z-Index of a ContentControl , the parent, based on a child control that's inside the ContentControl .

Here's my tiny example:

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>  
    <Rectangle Fill="Green" Width="100" Height="100" Panel.ZIndex="5"/>
    <ContentControl>
      <Rectangle Fill="Red" Width="100" Height="100" Panel.ZIndex="10" />
    </ContentControl>
  </Grid>
</Page>

In this example, the Panel.ZIndex declared in the Red Rectangle has no effect.

I thought of two options:

• Have the parent bind to the Panel.ZIndex value of the child
• Have the child set the Panel.ZIndex on its parent

I couldn't figure out how to do either of these two options.

Eventually my child controls are defined in a DataTemplate which gets applied using a ContentControl , meaning I can't directly set the Panel.ZIndex property of the ContentControl

Answer 1

Try this:

<Grid>
    <Rectangle Fill="Green" Width="100" Height="100" Panel.ZIndex="5"/>
    <ContentControl Panel.ZIndex="{Binding Content.(Panel.ZIndex), RelativeSource={RelativeSource Self}}">
        <Rectangle Fill="Red" Width="100" Height="100" Panel.ZIndex="10" />
    </ContentControl>
</Grid>