DataGrid with ScrollViewer inside an Expander and ItemsControl

Question

I've an ItemsControl with a DataGrid inside an Expander as ItemTemplate.

<Grid>
    <ScrollViewer HorizontalScrollBarVisibility="Auto"
                  VerticalScrollBarVisibility="Auto">
        <ItemsControl ItemsSource="{Binding SomeItemSource}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Expander>
                        <Grid>
                            <DataGrid ItemsSource="{Binding SomeItemSource}"
                                      ScrollViewer.CanContentScroll="True"
                                      ScrollViewer.VerticalScrollBarVisibility="Auto"
                                      ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                      MaxHeight="200">
                            </DataGrid>
                        </Grid>
                    </Expander>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>
</Grid>

I want to have a ScrollViewer for each DataGrid and one for the list of expanders if there are too many of them. My problem is that it only works if I set the MaxHeight Property of the DataGrid. That's annoying because if there is e.g. only one entry in the ItemsControl the entry isn't using the whole space because it's height is limited.

Does anyone have an idea?

Answer 1

Hmm, Hard to understand what you up but this might help you out futher.

The problem is the ScrollViewer. Let me show you what ScrollViewer does in WPF.

Its default behavior is to switch between whether user wishes to have ScrollBars or not.

In case the user hasnt set any preferences the ScrollViewer will try to use ScrollBars. Therefore the ScrollViewer passes infinity as value to its children to allow its children to take as much space as they want. The end result as in your case is when one item is only there it does not fullfill all available space because ScrollViewer allows it to be arranged at its desired size (which is smaller than available size). Basically in other words ScrollViewer says to children meehhh I dont care, you pick your desired size and arrange yourself at your desired size. I will just display ScrollBars so user can scroll to you. ScrollViewer is pretty dumb.

In order to recieve the fullfill space behavior you will have to tell ScrollViewer to disable ScrollBar. Then the ScrollViewer will not pass infinity as measure value to its children but instead it will pass the size of your window/available space. The children will notice that a fix width and height is there (and not infinity) and will measure themselves to fullfill the given space. (Means children desired size will be windows size or size of available spcae and not the one they wishes to be. The one they wishes is smaller than available space anyways)

To sum up. When you have one item, just disable ScrollBars or dont use ScrollViewer at all. Leave ScrollViewer out and just let Expander be the next node of Grid. Expander will use complete available space. Though when you notice that you added new items to your ItemsSource you just swap the template and use ScrollViewer around Expanders allowing you to scrolling.

I hope I gave you an idea at least of how to make one item take the complete size.