Silverlight - Space above/below TreeView items

Question

I'm trying to reduce the amount of space between TreeView items to fit more vertically. I'm guessing that it's a matter of styling the ItemContainer Style or ItemContainer template in the TreeView, but I can't seem to get at the correct properties. Can anyone point me in the right direction?

Answer 1

You are correct, you need to alter the ItemContainerStyle of the TreeView control.

All containers within the default TreeViewItem style's control template are set to "auto" and stretch to consume as much vertical space that is needed by the item content.

You can force this by doing either of two things:

1. Reduce the size of the content of each item by altering the TreeView's ItemTemplate
2. Invert the Margin on the Grid inside of the TreeViewItem's default control template.

Below is an excerpt from a new control template that I created for the TreeViewItem. Notice how I set the Margin to be "0,-4,0,-4". This tells the content to take 4 less pixels on top and bottom of the item, thus reducing the vertical real estate of each item.

<ControlTemplate TargetType="controls:TreeViewItem">
 <Grid Background="{x:Null}" Margin="0,-4,0,-4">
  ...