Share via


FlyoutPage Navigation Bar on Windows

This Universal Windows Platform platform-specific is used to collapse the navigation bar on a FlyoutPage, and is consumed in XAML by setting the FlyoutPage.CollapseStyle and FlyoutPage.CollapsedPaneWidth attached properties:

<FlyoutPage ...
                  xmlns:windows="clr-namespace:Xamarin.Forms.PlatformConfiguration.WindowsSpecific;assembly=Xamarin.Forms.Core"
                  windows:FlyoutPage.CollapseStyle="Partial"
                  windows:FlyoutPage.CollapsedPaneWidth="48">
  ...
</FlyoutPage>

Alternatively, it can be consumed from C# using the fluent API:

using Xamarin.Forms.PlatformConfiguration;
using Xamarin.Forms.PlatformConfiguration.WindowsSpecific;
...

page.On<Windows>().SetCollapseStyle(CollapseStyle.Partial).CollapsedPaneWidth(148);

The FlyoutPage.On<Windows> method specifies that this platform-specific will only run on Windows. The Page.SetCollapseStyle method, in the Xamarin.Forms.PlatformConfiguration.WindowsSpecific namespace, is used to specify the collapse style, with the CollapseStyle enumeration providing two values: Full and Partial. The FlyoutPage.CollapsedPaneWidth method is used to specify the width of a partially collapsed navigation bar.

The result is that a specified CollapseStyle is applied to the FlyoutPage instance, with the width also being specified:

Collapsed Navigation Bar Platform-Specific