Question

I was looking for the answer of this, but all solutions I’ve found was not working properly.
Here is the problem. I have interface,based on grid like the below:

| __________________________________|
|(v)expander |(v)expander  |(v)expander |  <- grid inside the row of main grid
|___________________________________|
|                                        |
|                                        |
|                                        |
.                                        . <- grid, stackpanel, etc. inside row
.                                        .
.                                        .
|                                        |
|___________________________________|
|(^)expander  | (^) expander   |         | <- grid inside the row of main grid
|___________________________________|

Each expander is placed on it's own border.
Now I want expanders to expand over the rest of interface. Top expanders expand down, bottom ones - up. I can't use RowSpan. It should be done with zIndex somehow I guess, but I was trying with that in a lot and didn't work. I set all grids and borders Panel.ZIndex property to let's say 99, and the content of expander was set on ZIndex about 999.

Is there any way to do it?
Thanks,
Joe

Answer 1

After a while (when I have been doing sth else to refresh my mind on this topic) I found the solution. It is based on Karl Shifflet solution ( http://karlshifflett.wordpress.com/2008/02/05/wpf-sample-series-expander-control-with-popup-content/ ).
I placed the Grid that holds top expanders onto the Canvas. I set the Canvas Panel.ZIndex property to about 99 and set the Background to desired colour. The Grid.Background property was set to Transparent and Width to fill canvas size:

Background="Transparent" Width="{Binding RelativeSource=
  {RelativeSource Mode=FindAncestor, AncestorType={x:Type Canvas}}, 
  Path=ActualWidth}"

Important thing was to set all expanders VerticalAlignment to Top, because when one of them expands, the Grid Height (which should not be hard defined in this case) also resizes, and when Vertical Alignment of them is not set to Top, all expanders are placed in the middle.

I hope it helps someone.