MenuFlyout Clase
Definición
Importante
Parte de la información hace referencia a la versión preliminar del producto, que puede haberse modificado sustancialmente antes de lanzar la versión definitiva. Microsoft no otorga ninguna garantía, explícita o implícita, con respecto a la información proporcionada aquí.
Representa un control flotante que muestra un menú de comandos.
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.UI.Xaml.Markup.ContentProperty(Name="Items")]
class MenuFlyout : FlyoutBase[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.UI.Xaml.Markup.ContentProperty(Name="Items")]
public class MenuFlyout : FlyoutBasePublic Class MenuFlyout
Inherits FlyoutBase<MenuFlyout>
oneOrMoreItems
</MenuFlyout>
- Herencia
- Derivado
- Atributos
Requisitos de Windows
| Familia de dispositivos |
Windows 10 (se introdujo en la versión 10.0.10240.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (se introdujo en la versión v1.0)
|
Ejemplos
Sugerencia
Para obtener más información, instrucciones de diseño y ejemplos de código, consulta Menús y menús contextuales.
Si tienes instalada la aplicación WinUI 2 Gallery , haz clic aquí para abrir la aplicación y ver MenuFlyout en acción.
En este ejemplo se crea una clase MenuFlyout y se usa la propiedad ContextFlyout, una propiedad disponible para la mayoría de los controles, para mostrar la clase MenuFlyout como un menú contextual.
<Rectangle Height="100" Width="100">
<Rectangle.ContextFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Change color" Click="ChangeColorItem_Click" />
</MenuFlyout>
</Rectangle.ContextFlyout>
<Rectangle.Fill>
<SolidColorBrush x:Name="rectangleFill" Color="Red" />
</Rectangle.Fill>
</Rectangle>
private void ChangeColorItem_Click(object sender, RoutedEventArgs e)
{
// Change the color from red to blue or blue to red.
if (rectangleFill.Color == Windows.UI.Colors.Red)
{
rectangleFill.Color = Windows.UI.Colors.Blue;
}
else
{
rectangleFill.Color = Windows.UI.Colors.Red;
}
}
El siguiente ejemplo es casi idéntico, pero en lugar de usar la propiedad ContextFlyout para mostrar la clase MenuFlyout como un menú contextual, el ejemplo usa la propiedad FlyoutBase.ShowAttachedFlyout para que se muestre como un menú.
<Rectangle
Height="100" Width="100"
Tapped="Rectangle_Tapped">
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Change color" Click="ChangeColorItem_Click" />
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<Rectangle.Fill>
<SolidColorBrush x:Name="rectangleFill" Color="Red" />
</Rectangle.Fill>
</Rectangle>
private void Rectangle_Tapped(object sender, TappedRoutedEventArgs e)
{
FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);
}
private void ChangeColorItem_Click(object sender, RoutedEventArgs e)
{
// Change the color from red to blue or blue to red.
if (rectangleFill.Color == Windows.UI.Colors.Red)
{
rectangleFill.Color = Windows.UI.Colors.Blue;
}
else
{
rectangleFill.Color = Windows.UI.Colors.Red;
}
}
En este ejemplo se muestra cómo agregar y quitar elementos de menú en tiempo de ejecución en función de las condiciones cambiantes de la aplicación.
<StackPanel Margin="40" Width="220">
<Rectangle x:Name="Rect1" Height="100" Width="200"
Stroke="Black" StrokeThickness="1" Fill="White">
<Rectangle.ContextFlyout>
<MenuFlyout x:Name="RectangleColorMenu"/>
</Rectangle.ContextFlyout>
</Rectangle>
<StackPanel>
<TextBlock TextWrapping="WrapWholeWords"
Text="Check colors to include in the menu, then choose a color from the context menu on the rectangle."/>
<CheckBox Content="Blue" Click="CheckBox_Click" Tag="blue"/>
<CheckBox Content="Green" Click="CheckBox_Click" Tag="green"/>
<CheckBox Content="Red" Click="CheckBox_Click" Tag="red"/>
<CheckBox Content="Yellow" Click="CheckBox_Click" Tag="yellow"/>
</StackPanel>
</StackPanel>
private void CheckBox_Click(object sender, RoutedEventArgs e)
{
// Using the Tag property lets you localize the display name
// without affecting functionality.
var cb = (CheckBox)sender;
if (cb.IsChecked == true)
{
AddMenuItem(cb.Tag.ToString(), cb.Content.ToString());
}
else
{
RemoveMenuItem(cb.Content.ToString());
}
}
private void AddMenuItem(string colorString, string locColorName)
{
// Set the color.
Color newColor = Colors.Blue;
if (colorString == "green")
newColor = Colors.Green;
else if (colorString == "red")
newColor = Colors.Red;
else if (colorString == "yellow")
newColor = Colors.Yellow;
// Create the menu item.
var newMenuItem = new MenuFlyoutItem();
newMenuItem.Text = locColorName;
newMenuItem.Click += (s, e1) =>
{
Rect1.Fill = new SolidColorBrush(newColor);
};
// Add the item to the menu.
RectangleColorMenu.Items.Add(newMenuItem);
// Sort the menu so it's always consistent.
var orderedItems = RectangleColorMenu.Items.OrderBy(i => ((MenuFlyoutItem)i).Text).ToList();
RectangleColorMenu.Items.Clear();
foreach (var item in orderedItems)
{
RectangleColorMenu.Items.Add(item);
}
}
private void RemoveMenuItem(string locColorName)
{
// Get any menu items to remove and remove them.
var items = RectangleColorMenu.Items.Where(i => ((MenuFlyoutItem)i).Text == locColorName);
foreach (MenuFlyoutItem item in items)
{
RectangleColorMenu.Items.Remove(item);
}
}
Comentarios
Sugerencia
Para obtener más información, instrucciones de diseño y ejemplos de código, consulta Menús y menús contextuales.
MenuFlyout muestra temporalmente una lista de comandos o opciones relacionados con lo que el usuario está haciendo actualmente.
Usa un control Flyout para mostrar elementos individuales y un control MenuFlyout para mostrar un menú de elementos. Para obtener más información, consulta Menús y menús contextuales.
Se puede usar un control MenuFlyout como valor de la propiedad Button.Flyout . Normalmente, esto se establece en XAML como parte de una definición de interfaz de usuario de la página. Button es el único control que tiene una propiedad Flyout dedicada. Cuando se establece como Button.Flyout, menuFlyout se muestra cuando se pulsa el botón o se invoca de otro modo.
Para asociar un MenuFlyout con otros controles, use la propiedad ContextFlyout que está disponible en cualquier UIElement.
Notas de las versiones anteriores
Nota
La propiedad ContextFlyout no está disponible antes de la actualización de aniversario de Windows 10 (SDK versión 14393). Para versiones anteriores, use la propiedad adjunta FlyoutBase.AttachedFlyout .
Puede usar la propiedad adjunta FlyoutBase.AttachedFlyout para asociar un MenuFlyout con otros controles. Cuando se asigna un MenuFlyout a otros elementos de la interfaz de usuario mediante FlyoutBase.AttachedFlyout, debe llamar al método ShowAt o al método estático ShowAttachedFlyout para mostrar el control flotante.
Además de los miembros enumerados anteriormente, hay otros miembros de la clase base FlyoutBase que se suelen usar en escenarios típicos de MenuFlyout:
- FlyoutBase.AttachedFlyout: una propiedad adjunta que asocia un MenuFlyout con un elemento de interfaz de usuario determinado (puede ser cualquier clase derivada frameworkElement ).
- ShowAttachedFlyout: un método estático que puede determinar si un control flotante ya está asociado a un elemento de interfaz de usuario a través de un uso de FlyoutBase.AttachedFlyout . Si es así, el método llama a ShowAt internamente, mediante el frameworkElement que especificó.
Estilo de control y plantilla
Puede modificar el Estilo predeterminado y ControlTemplate para dar al control una apariencia única. Para obtener información sobre cómo modificar el estilo y la plantilla de un control, vea Aplicar estilos a los controles. El estilo, la plantilla y los recursos predeterminados que definen la apariencia del control se incluyen en el generic.xaml archivo . Para fines de diseño, generic.xaml está disponible localmente con el SDK o la instalación del paquete NuGet.
- Estilos de WinUI (recomendado): Para obtener estilos actualizados de WinUI, consulte
\Users\<username>\.nuget\packages\microsoft.ui.xaml\<version>\lib\uap10.0\Microsoft.UI.Xaml\Themes\generic.xaml. - Estilos que no son de WinUI: Para obtener estilos integrados, vea
%ProgramFiles(x86)%\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\<SDK version>\Generic\generic.xaml.
Las ubicaciones pueden ser diferentes si personaliza la instalación. Los estilos y recursos de diferentes versiones del SDK pueden tener valores diferentes.
XAML también incluye recursos que puedes usar para modificar los colores de un control en distintos estados visuales sin modificar la plantilla de control. Se prefiere modificar estos recursos para establecer propiedades como Fondo y Primer plano. Para obtener más información, consulta la sección Estilo ligero del artículo Estilos XAML . Los recursos de estilo ligero están disponibles a partir de Windows 10, versión 1607 (SDK 14393).
Historial de versiones
| Versión de Windows | Versión del SDK | Valor agregado |
|---|---|---|
| 1809 | 17763 | ShowAt |
Constructores
| MenuFlyout() |
Inicializa una nueva instancia de la clase MenuFlyout . |
Propiedades
| AllowFocusOnInteraction |
Obtiene o establece un valor que indica si el elemento obtiene automáticamente el foco cuando el usuario interactúa con él. (Heredado de FlyoutBase) |
| AllowFocusWhenDisabled |
Obtiene o establece un valor que especifica si el control puede recibir el foco cuando está deshabilitado. (Heredado de FlyoutBase) |
| AreOpenCloseAnimationsEnabled |
Obtiene o establece un valor que indica si las animaciones se reproducen cuando se abre o cierra el control flotante. (Heredado de FlyoutBase) |
| Dispatcher |
Obtiene el CoreDispatcher al que está asociado este objeto. CoreDispatcher representa una instalación que puede acceder a DependencyObject en el subproceso de la interfaz de usuario, incluso si un subproceso que no es de interfaz de usuario inicia el código. (Heredado de DependencyObject) |
| ElementSoundMode |
Obtiene o establece un valor que especifica la preferencia del control para si reproduce sonidos. (Heredado de FlyoutBase) |
| InputDevicePrefersPrimaryCommands |
Obtiene un valor que indica si el dispositivo de entrada usado para abrir el control flotante no abre fácilmente los comandos secundarios. (Heredado de FlyoutBase) |
| IsConstrainedToRootBounds |
Obtiene un valor que indica si el control flotante se muestra dentro de los límites de la raíz XAML. (Heredado de FlyoutBase) |
| IsOpen |
Obtiene un valor que indica si el control flotante está abierto. (Heredado de FlyoutBase) |
| Items |
Obtiene la colección utilizada para generar el contenido del menú. |
| LightDismissOverlayMode |
Obtiene o establece un valor que especifica si el área fuera de una interfaz de usuario de cierre de luz se oscurece. (Heredado de FlyoutBase) |
| MenuFlyoutPresenterStyle |
Obtiene o establece el estilo que se usa al representar menuFlyout. |
| MenuFlyoutPresenterStyleProperty |
Identifica la propiedad de dependencia MenuFlyoutPresenterStyle . |
| OverlayInputPassThroughElement |
Obtiene o establece un elemento que debe recibir eventos de entrada de puntero incluso cuando se encuentra debajo de la superposición del control flotante. (Heredado de FlyoutBase) |
| Placement |
Obtiene o establece la ubicación predeterminada que se va a usar para el control flotante, en relación con su destino de selección de ubicación. (Heredado de FlyoutBase) |
| ShouldConstrainToRootBounds |
Obtiene o establece un valor que indica si el control flotante debe mostrarse dentro de los límites de la raíz XAML. (Heredado de FlyoutBase) |
| ShowMode |
Obtiene o establece un valor que indica cómo se comporta un control flotante cuando se muestra. (Heredado de FlyoutBase) |
| Target |
Obtiene el elemento que se va a usar como destino de selección de ubicación del control flotante. (Heredado de FlyoutBase) |
| XamlRoot |
Obtiene o establece el xamlRoot en el que se ve este control flotante. (Heredado de FlyoutBase) |
Métodos
| ClearValue(DependencyProperty) |
Borra el valor local de una propiedad de dependencia. (Heredado de DependencyObject) |
| CreatePresenter() |
Cuando se invalida en una clase derivada, inicializa un control para mostrar el contenido del control flotante según corresponda para el control derivado. Nota: Este método no tiene ninguna implementación de clase base y debe reemplazarse en una clase derivada. (Heredado de FlyoutBase) |
| GetAnimationBaseValue(DependencyProperty) |
Devuelve cualquier valor base establecido para una propiedad de dependencia, que se aplicaría en los casos en los que una animación no está activa. (Heredado de DependencyObject) |
| GetValue(DependencyProperty) |
Devuelve el valor efectivo actual de una propiedad de dependencia de dependencyObject. (Heredado de DependencyObject) |
| Hide() |
Cierra el control flotante. (Heredado de FlyoutBase) |
| OnProcessKeyboardAccelerators(ProcessKeyboardAcceleratorEventArgs) |
Se llama justo antes de que se procese un método abreviado de teclado (acelerador) en la aplicación. Se invoca cada vez que el código de aplicación o los procesos internos llaman a ProcessKeyboardAccelerators. Invalide este método para influir en el control del acelerador predeterminado. (Heredado de FlyoutBase) |
| ReadLocalValue(DependencyProperty) |
Devuelve el valor local de una propiedad de dependencia, si se establece un valor local. (Heredado de DependencyObject) |
| RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback) |
Registra una función de notificación para escuchar los cambios en una dependencyProperty específica en esta instancia de DependencyObject . (Heredado de DependencyObject) |
| SetValue(DependencyProperty, Object) |
Establece el valor local de una propiedad de dependencia en dependencyObject. (Heredado de DependencyObject) |
| ShowAt(DependencyObject, FlyoutShowOptions) |
Muestra el control flotante colocado en relación con el elemento especificado mediante las opciones especificadas. (Heredado de FlyoutBase) |
| ShowAt(FrameworkElement) |
Muestra el control flotante colocado en relación con el elemento especificado. (Heredado de FlyoutBase) |
| ShowAt(UIElement, Point) |
Muestra el control flotante colocado en el desplazamiento especificado en relación con el elemento de destino especificado. |
| TryInvokeKeyboardAccelerator(ProcessKeyboardAcceleratorEventArgs) |
Intenta invocar un método abreviado de teclado (acelerador). (Heredado de FlyoutBase) |
| UnregisterPropertyChangedCallback(DependencyProperty, Int64) |
Cancela una notificación de cambio registrada anteriormente mediante una llamada a RegisterPropertyChangedCallback. (Heredado de DependencyObject) |
Eventos
| Closed |
Se produce cuando el control flotante está oculto. (Heredado de FlyoutBase) |
| Closing |
Se produce cuando el control flotante comienza a ocultarse. (Heredado de FlyoutBase) |
| Opened |
Se produce cuando se muestra el control flotante. (Heredado de FlyoutBase) |
| Opening |
Se produce antes de que se muestre el control flotante. (Heredado de FlyoutBase) |
Se aplica a
Consulte también
Comentarios
Próximamente: A lo largo de 2024 iremos eliminando gradualmente GitHub Issues como mecanismo de comentarios sobre el contenido y lo sustituiremos por un nuevo sistema de comentarios. Para más información, vea: https://aka.ms/ContentUserFeedback.
Enviar y ver comentarios de