WPF Create a slide out panel

Question

I don't know how this works technically but my requirement is as follows. I have a DataGrid and to input data into the DataGrid, I want a panel at the bottom of the DataGrid that slides out on a button click showing input options. Except, as the panel slides out, the DataGrid has to resize vertically as well. Can someone throw some light on how I can implement this?

Answer 1

You should be able to use a StackPanel with 2 children, your grid and your panel. Set the initial height of your panel to 0. Once the button is clicked, set the height to whatever you need it to be (e.g., MyPanel.Height = 20). You might want to wrap the grid in a ScrollViewer in case that is needed.

<StackPanel Orientation="Vertical">
    <ScrollViewer Height="Auto" VerticalAlignment="Stretch">
        <Grid Height="*" VerticalAlignment="Stretch" />
    </ScrollViewer>
    <ContentControl x:Name="MyPanel" Height="0" />
</StackPanel>

You might need to experiment with VerticalAlignment and Height="Auto" or Height="0" to get the layout you want.

Answer 2

You can use Expander. Please look at the following code snippet.

 <DockPanel>
        <Expander DockPanel.Dock="Bottom">
            <StackPanel>
                <TextBlock Height="25"></TextBlock>
                <TextBlock Height="25"></TextBlock>
                <TextBlock Height="25"></TextBlock>

            </StackPanel>
        </Expander>
        <Border BorderBrush="LightGreen" BorderThickness="2">
            <DataGrid/>
        </Border>
    </DockPanel >