Question

I want to place a DataGrid inside a HeaderedContentControl but the the DataGrid does not get a vertical Scrollbar. It appears to be sized to hold all rows at once, the bottom disappearing from view.

If I place the same DataGrid in a Border elelemnt I do get the behaviour I want.

I have reduced it to this minimal example:

<Grid>
    <HeaderedContentControl  Margin="10,10,10,161" >
        <HeaderedContentControl.Header >test</HeaderedContentControl.Header>

        <!-- I want it Here but then no Vertical Scroll-->
        <DataGrid ItemsSource="{Binding Path=AllData}"                      
                  AutoGenerateColumns="True"  />
    </HeaderedContentControl>

    <Border Margin="10,169,10,10">                                
        <!--Here it does scroll -->
        <DataGrid ItemsSource="{Binding Path=AllData}" 
                  AutoGenerateColumns="True"  />
    </Border>                      
</Grid>

A few notes:

• I couldn’t get it to work using HeaderedContentControl.VerticalContentAlignment
• this problem is related to this question but I think I’ve broadened it a bit and that there is a better answer.
• using a ScrollViewer around the DataGrid is not a solution because it scrolls the header out of sight.
• I am using WPF4

Answer 1

You’re seeing this behavior because the default template for HeaderedContentControl is using a StackPanel to show its contents. Since the StackPanel takes the size of its children, the DataGrid expands its height to have every of its items shown on the screen without scrollbars. The display is then cropped due to the size of the HeaderedContentControl.

Changing the template to use a Grid or a DockPanel solves this problem:

<Style TargetType="{x:Type HeaderedContentControl}">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type HeaderedContentControl}">
        <DockPanel>
          <ContentPresenter DockPanel.Dock="Top" ContentSource="Header" />
          <ContentPresenter />
        </DockPanel>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>