Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF DataGrid inside Accordion height issue

I am using the latest WPF Toolkit but am running into a height issue when I have a large record set bound into a DataGrid inside an AccordionItem item. The height of the Accordion itself scales nicely but the DataGrid inside the accordion control doesn't get get a ScrollBar or get constrained in any way so the records are hidden.

I know that I am most probably missing something very simple (like a binding from the DataGrid's height property to the Accordion but that seems messy)

here is a cut down version of the code (and yes, this has the same problem if you bind in a big recordset)

<UserControl>
<layouttoolkit:Accordion x:Name="ReportSelector" HorizontalAlignment="Stretch">
    <layouttoolkit:AccordionItem Header="grid 1">
        <dg:DataGrid
         AutoGenerateColumns="False"
         CanUserAddRows="False"
         CanUserDeleteRows="False"
         SelectionMode="Single">
...
            </dg:DataGrid.Columns>
        </dg:DataGrid>

    </layouttoolkit:AccordionItem>
    <layouttoolkit:AccordionItem Header="grid 2">
        <dg:DataGrid
         AutoGenerateColumns="False"
         CanUserAddRows="False"
         CanUserDeleteRows="False"
         SelectionMode="Single">
...
            </dg:DataGrid.Columns>
        </dg:DataGrid>

    </layouttoolkit:AccordionItem>
    <layouttoolkit:AccordionItem Header="grid 3">
        <dg:DataGrid
         AutoGenerateColumns="False"
         CanUserAddRows="False"
         CanUserDeleteRows="False"
         SelectionMode="Single">
...
            </dg:DataGrid.Columns>
        </dg:DataGrid>

    </layouttoolkit:AccordionItem>            
</layouttoolkit:Accordion>
</UserControl>
like image 534
LucasS Avatar asked Mar 15 '10 03:03

LucasS


2 Answers

Looks like my initial idea was right - the only way I have been able to solve this one is to bind the MaxHeight of the DataGrid to the ActualHeight of the AccordionItem

Adding the following property to each DataGrid did the trick

MaxHeight="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type layouttoolkit:AccordionItem}},Path=ActualHeight}"
like image 96
LucasS Avatar answered Sep 17 '22 11:09

LucasS


I'm so glad I stumbled on this! This QA needs to be upvoted. I had a similar problem except with the column widths.

My DataGrid had Width="Auto", along with some *-sized column widths. Outside of the Accordion the DataGrid rendered fine but inside the Accordion, the width of all of the columns would get squished to 10px each. Couldn't figure out why. Could be a bug?

I noticed that if I set a static Width like 400 instead of Auto, the columns would render properly. Then I tried binding the DataGrid Width to the AccordionItem ActualWidth as you did, and it works perfectly now. Thank you sir!

like image 30
Andrew Lavers Avatar answered Sep 21 '22 11:09

Andrew Lavers