How to put a border around an ItemsControl?

Question

I have an itemscontrol with a custom panel inside a usercontrol. The usercontrols size is only constrained by the parent window size.

<UserControl>
  <Grid>
    <Border BorderBrush="DarkGray" BorderThickness="5">
      <ItemsControl ItemsSource="{Binding ActiveGame.Grid.CellsFlat}">
        <ItemsControl.ItemsPanel>
          <ItemsPanelTemplate>
            <Wpf:HexagonalPanel/>
          </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
          <DataTemplate>
            <Button />
          </DataTemplate>
        </ItemsControl.ItemTemplate>
      </ItemsControl>
    </Border>
  </Grid>
</UserControl>

I now want the border to be drawn only around the resulting panel. But instead its drawn around the whole grid or probably more precisely at the same size as the grid.

I think I implemented the MeasureOverride correctly on my HexagonalPanel, it returns the correct size, so shouldn't it draw the border at that size?

What am I missing?

Answer 1

You haven't set a size on the ItemsControl, so it will be sized to its parent too. Try setting the ItemsControl's HorizontalAlignment and VerticalAlignment to Center; that will make the ItemsControl's actual size match that of its content.

Answer 2

ItemsControl itself has BorderBrush and BorderThickness properties. You probably want to be using those since ItemsControl has a Border in its ControlTemplate by default.