Represents a control that displays lightweight UI that is either information, or requires user interaction. Unlike a dialog, a Flyout can be light dismissed by clicking or tapping off of it.
A single object element that declares the content. This must be an object that has UIElement in its hierarchy (plain strings don't work). This can be a container, such as a Panel derived class, so that multiple content items within the Flyout can be arranged in layout.
The Flyout class has these types of members:
The Flyout class has these constructors.
|Flyout||Initializes a new instance of the Flyout class.|
The Flyout class has these events.
|Closed||Occurs when the flyout is hidden. (Inherited from FlyoutBase)|
|Opened||Occurs when the flyout is shown. (Inherited from FlyoutBase)|
|Opening||Occurs before the flyout is shown. (Inherited from FlyoutBase)|
The Flyout class has these methods. It also inherits methods from the Object class.
|ClearValue||Clears the local value of a dependency property. (Inherited from DependencyObject)|
|CreatePresenter||When overridden in a derived class, initializes a control to show the flyout content as appropriate for the derived control. Note: This method has no base class implementation and must be overridden in a derived class. (Inherited from FlyoutBase)|
|GetAnimationBaseValue||Returns any base value established for a dependency property, which would apply in cases where an animation is not active. (Inherited from DependencyObject)|
|GetValue||Returns the current effective value of a dependency property from a DependencyObject. (Inherited from DependencyObject)|
|Hide||Closes the flyout. (Inherited from FlyoutBase)|
|ReadLocalValue||Returns the local value of a dependency property, if a local value is set. (Inherited from DependencyObject)|
|SetValue||Sets the local value of a dependency property on a DependencyObject. (Inherited from DependencyObject)|
|ShowAt||Shows the flyout placed in relation to the specified element. (Inherited from FlyoutBase)|
The Flyout class has these properties.
|Read/write||Gets or sets the content of the Flyout.|
|Read-only||Gets the identifier for the Content dependency property.|
|Read-only||Gets the CoreDispatcher that this object is associated with. The CoreDispatcher represents a facility that can access the DependencyObject on the UI thread even if the code is initiated by a non-UI thread. (Inherited from DependencyObject)|
|Read/write||Gets or sets an instance Style applied to the Flyout content.|
|Read-only||Gets the identifier for the FlyoutPresenterStyle dependency property.|
|Read/write||Gets or sets the default placement to be used for the flyout, in relation to its placement target. (Inherited from FlyoutBase)|
A Flyout displays a message that requires user interaction.
Use a Flyout control for collecting information, for displaying more info, or for warnings and confirmations. Unlike a dialog, a Flyout does not create a separate window, and does not block other user interaction. To show a menu of items, use a MenuFlyout instead. For more info, including XAML and code examples, see Quickstart: Adding a Flyout.
A Flyout control (or MenuFlyout) is used as the value of the Button.Flyout property. This is usually set in XAML as part of a UI definition of the page. Button is the only control that has a dedicated Flyout property. To associate a Flyout with other controls, use the FlyoutBase.AttachedFlyout attached property. When set as Button.Flyout, the Flyout displays when the button is tapped or otherwise invoked. When a Flyout is assigned to other UI elements using FlyoutBase.AttachedFlyout, you must call either the ShowAt method or the static ShowAttachedFlyout method to display the flyout.
In addition to the members listed in this reference topic, there are other members of the base class FlyoutBase that are often used in typical Flyout scenarios:
- FlyoutBase.AttachedFlyout: an attached property that associates a Flyout with a particular UI element (this can be any FrameworkElement derived class).
- ShowAttachedFlyout: a static method that can determine whether a flyout is already associated with a UI element through a FlyoutBase.AttachedFlyout assignment. If so, the method calls ShowAt internally, using the FrameworkElement that you specified.
Requirements (device family)
Requirements (operating system)
Minimum supported client
|Windows 8.1 [Windows Store apps only]|
Minimum supported server
|Windows Server 2012 R2 [Windows Store apps only]|
Minimum supported phone
|Windows Phone 8.1 [Windows Runtime apps only]|
- Quickstart: Adding a Flyout
- Attached properties overview
- XAML Flyout and MenuFlyout sample
- Related controls
- Controls list
- Controls by function