Дизайн с несколькими расширителями

Question

Мне нужна небольшая помощь в создании дизайна, который я хочу.
Моя ViewModel имеет три коллекции, которые привязаны к трем ItemsControl с помощью Caliburn.Micro. Каждая коллекция содержит от 10 до 31 предметов.
Я хочу поместить каждый ItemControl в Expander. Пока все просто:

<StackPanel>
  <Expander IsExpanded="True" Header="Day recordings">
    <ItemsControl Name="DayRecordings" />
  </Expander>
  <Expander IsExpanded="False" Header="Month recordings">
    <ItemsControl Name="MonthRecordings" />
  </Expander>
  <Expander IsExpanded="False" Header="Digit recordings">
    <ItemsControl Name="DigitRecordings" />
  </Expander>
</StackPanel>

Проблема сейчас в том, что они выходят за пределы StackPanel, в котором они содержатся.
Я бы хотел, чтобы Expander s вел себя так:

1. Если развернут только один Expander, он должен использовать полное пространство StackPanel минус пространство, необходимое для других, нерасширенных Expander с. Внутри развернутого Expander должна быть показана вертикаль ScrollBar.
2. Если N Expander с расширены, каждый должен занимать 1 / Nth от общего пространства StackPanel минус пространство, необходимое для других, нерасширенных Expander с. В каждом из расширенных Expander s должна быть показана вертикаль ScrollBar.
   1. Если одному из расширенных Expander s требуется меньше места, чем назначенному 1 / Nth, он должен использовать только необходимое пространство, а избыточное пространство должно быть равномерно распределено между другими расширенными Expander s. Такое поведение приятно иметь, но не обязательно

К сожалению, у меня нет ничего, кроме простого XAML сверху, потому что я даже не представляю, как с этим справиться ...

Answer 1

Используйте ScrollViewer, поместите в него сетку, установите высоту строки в автоматический режим.
Поместите конвертер в MaxHeight, если вы хотите какую-то необычную раскладку.

Answer 2

Используйте элемент управления accordion из набора инструментов, чтобы получить требуемое поведение.