Allow WPF Grid cell content to expand outside of the grid cell?

Question

I have a Grid in my WPF window. When a particular button is pressed, I want a control in one of the Grid cells to expand downward to double its original size. When this happens, the control is clipped to the visual bounds of the containing cell. However, I need all of the content to be visible, over the top of the cell below. I tried setting Panel.ZIndex to a high value, to no avail. I basically need to emulate the functionality of "overflow:visible" in CSS. Is this possible in WPF/Xaml?

Solution 1

Set the ClipToBounds property of the control within the cell to False and then wrap the cell's content in a Canvas. The Canvas is a guaranteed break out of bounds, not all controls do (such as Buttons).

Example:

<Canvas Grid.Row="5" Grid.Column="3">
    <TextBlock Text="Long text here" ClipToBounds="False">
</Canvas>

Solution 2

• use RowSpan or columnspan
• when defining the grid place the cell at the bottom. Since rendering engine renders from top to bottom and you want this cell to be on top of your other cells. You might be able to get away with zindex but i try to minimize maintaining zindex.

Solution 3

You can probably do this with a popup: http://msdn.microsoft.com/en-us/library/system.windows.controls.primitives.popup.aspx, especially if you want the overflow to disregard window boundaries (solutions involving adorners, for instance, may not). You'd want to put the control into the popup, and then expand the popup's height to get the overflow effect. You might need to put another panel or something behind the popup to ensure the non-expanded size stays correct.