How to let Flyout width adjust to application width?

Question

I use Flyouts in my metro style application, which uses the MahApps Metro package:

<Controls:MetroWindow.Flyouts>
    <Controls:FlyoutsControl>
        <Controls:Flyout Header="INSTELLINGEN" Position="Left" Width="600" Theme="Dark">
            some content
        </Controls:Flyout>
    </Controls:FlyoutsControl>
</Controls:MetroWindow.Flyouts>

This works fine, however now I want a Flyout that takes up the width of the entire application, even if the user resizes it. Basically I'd like Width="*" but this doesn't work.

Answer 1

Here is an example that works with the latest alpha version (0.15).

Simply set the Margin and Width and you get what you need.

  <controls:MetroWindow.Flyouts>
    <controls:FlyoutsControl>
      <controls:Flyout Header="INSTELLINGEN"
                       Position="Left"
                       Margin="0 0 100 0"
                       Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=controls:MetroWindow}, Path=ActualWidth}"
                       Theme="Dark">
      </controls:Flyout>
    </controls:FlyoutsControl>
  </controls:MetroWindow.Flyouts>