WPF Expander не будет расширяться слева, когда внутри Canvas

Question

У меня есть сетка с 4 столбцами. В первом столбце находится холст с ZIndex 99 и внутри которого находится расширитель. Для направления расширения установлено значение «ВПРАВО». Когда я нажимаю на заголовок, расширитель расширяет OVER TOP столбца 2 ... это именно то, что я хочу. Я пытаюсь воспроизвести это (только противоположное направление) внутри столбца 4, так что, когда он будет расширен, он будет отображаться над столбцом 3. Несмотря на то, что я поместил ExpandDirection второго расширителя в «Left», он все еще расширяется до справа и с экрана.

Здесь работает расширитель:

<Canvas Grid.Column="0" Panel.ZIndex="99" Grid.RowSpan="4" VerticalAlignment="Stretch" Margin="0,5"> 
    <Expander ExpandDirection="Right" Style="{DynamicResource OptionsExpanderStyle}" VerticalAlignment="Stretch" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}"> 
     <Border BorderBrush="Black" BorderThickness="0,0,2,0"> 
      <Grid Background="White"> 

      </Grid> 
     </Border> 
    </Expander> 
</Canvas> 

Вот сломанный расширитель:

<Canvas x:Name="rightCanvas" Panel.ZIndex="99" Grid.RowSpan="4" Grid.Column="3" Margin="0,5"> 
    <Expander ExpandDirection="Left" Style="{DynamicResource OptionsExpanderStyle}" HorizontalAlignment="Right" VerticalAlignment="Stretch" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}"> 
     <Border BorderBrush="Black" BorderThickness="2,0,0,0"> 
      <Grid Background="White" Width="150"> 

      </Grid> 
     </Border> 
    </Expander> 
</Canvas> 

Answer 1

Не используйте холст.

Попробуйте что-то вроде этого:

<Grid> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition/> 
      <ColumnDefinition/> 
     </Grid.ColumnDefinitions> 
     <TextBlock Background="LightBlue" 
      TextAlignment="Center" Text="Left Column"/> 
     <TextBlock Grid.Column="1" Background="LightCoral" 
      TextAlignment="Center" Text="Right Column"/> 
    </Grid> 
    <Expander Background="LightGray" ExpandDirection="Right" 
     Header="LeftMenu" VerticalAlignment="Top" HorizontalAlignment="Left"> 
     <StackPanel Width="200"> 
      <TextBlock Text="Some menu stuff"/> 
      <TextBlock Text="Some more"/> 
     </StackPanel> 
    </Expander> 
    <Expander Background="LightGray" ExpandDirection="Left" 
     Header="RightMenu" VerticalAlignment="Top" HorizontalAlignment="Right"> 
     <StackPanel Width="200" > 
      <TextBlock Text="Some menu stuff"/> 
      <TextBlock Text="Some more"/> 
     </StackPanel> 
    </Expander> 
</Grid>