WPF GridSplitter visiblity

Question

I have a problem regarding GridSplitter visiblity.

In this, whatever I am hosting a Winform DataGridView. The GridSplitter, when dragged is properly visible on other controls. But not on this grid. In fact, whatever I host instead of Datagridview, becomes the topmost control,which makes the GridSplitter hide behind it.

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Name="rowForButton"/>
        <RowDefinition Name="rowForGridSplitter" Height="Auto" MinHeight="81" />
    </Grid.RowDefinitions>
    <Button Grid.Row="0" Height="50" Width="110" Content="Button in First Row"/>
    <my:WindowsFormsHost Panel.ZIndex="0" Grid.Row="1"  Margin="30,11,138,0" x:Name="winHost" Height="58" VerticalAlignment="Top" OpacityMask="Transparent">            
        <win:DataGridView x:Name="dataGridView"></win:DataGridView>
    </my:WindowsFormsHost>        
    <GridSplitter  BorderThickness="1" Panel.ZIndex="1" Grid.Row="1" HorizontalAlignment="Stretch" Height="5" ShowsPreview="True" VerticalAlignment="Top">
    </GridSplitter>
</Grid>

Answer 1

Usually you should either put a GridSplitter into its own grid cell or ensure via margins that no control can overlap it. But I don't know whether that exactly applies to you here. See also here.

Answer 2

Try using a WPF-native DataGrid control. There are a couple of commercial third-party controls you can buy, or you could take a look at one provided by Microsoft (currently still in CTP):

• Xceed DataGrid
• Telerik RadGridView
• Microsoft DataGrid CTP

Answer 3

Windows Forms controls are always rendered seperately from your WPF controls, and as a result will always appear over your WPF application.

See Hosting a Microsoft Win32 Window in WPF (subheading Notable Differences in Output Behavior) for more info.

Answer 4

In your situation, the quickest fix would be to move the GirdSplitter to the Row with the Button:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Name="rowForButton"/>
        <RowDefinition Name="rowForGridSplitter" Height="Auto" MinHeight="81" />
    </Grid.RowDefinitions>
    <Button Grid.Row="0" Height="50" Width="110" Content="Button in First Row"/>
    <my:WindowsFormsHost Panel.ZIndex="0" Grid.Row="1"  Margin="30,11,138,0" x:Name="winHost" Height="58" VerticalAlignment="Top" OpacityMask="Transparent">            
        <win:DataGridView x:Name="dataGridView"></win:DataGridView>
    </my:WindowsFormsHost>        
    <GridSplitter  BorderThickness="1" Panel.ZIndex="1" Grid.Row="0" HorizontalAlignment="Stretch" Height="5" ShowsPreview="True" VerticalAlignment="Bottom">
    </GridSplitter>
</Grid>

Now just adjust the margins to make sure there is some space between the button and the grid splitter.