MenuFlyout Klasse

Definition

/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="Items")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class MenuFlyout : FlyoutBase

[Microsoft.UI.Xaml.Markup.ContentProperty(Name="Items")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public class MenuFlyout : FlyoutBase

Public Class MenuFlyout
Inherits FlyoutBase

<MenuFlyout>
  oneOrMoreItems
</MenuFlyout>

Vererbung

Object IInspectable DependencyObject FlyoutBase MenuFlyout

Abgeleitet

Microsoft.UI.Xaml.Controls.MenuBarItemFlyout

Attribute

ContentPropertyAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Beispiele

Die WinUI 3-Katalog-App umfasst interaktive Beispiele für die meisten WinUI 3-Steuerelemente, -Features und -Funktionen. Rufen Sie die App aus dem Microsoft Store oder den Quellcode auf GitHub ab.

In diesem Beispiel wird ein MenuFlyout-Klasse erstellt, und anschließend wird mit der ContextFlyout-Eigenschaft, die für die meisten Steuerelemente verfügbar ist, die MenuFlyout-Klasse als Kontextmenü angezeigt.

<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;
    }
}

Das nächste Beispiel ist nahezu identisch, aber anstelle der ContextFlyout-Eigenschaft zur Anzeige der MenuFlyout-Klasse als Kontextmenü wird die FlyoutBase.ShowAttachedFlyout-Eigenschaft verwendet, um die Klasse als Menü anzuzeigen.

<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;
    }
}

In diesem Beispiel wird gezeigt, wie Sie Menüelemente zur Laufzeit basierend auf sich ändernden Bedingungen in Ihrer App hinzufügen und entfernen können.

<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);
    }
}

Hinweise

MenuFlyout zeigt vorübergehend eine Liste von Befehlen oder Optionen an, die sich auf die aktuellen Aktionen des Benutzers beziehen.

Verwenden Sie ein Flyout-Steuerelement , um einzelne Elemente anzuzeigen, und ein MenuFlyout-Steuerelement, um ein Menü mit Elementen anzuzeigen. Weitere Informationen finden Sie unter Menüs und Kontextmenüs.

Ein MenuFlyout-Steuerelement kann als Wert der Button.Flyout-Eigenschaft verwendet werden. Dies wird normalerweise in XAML als Teil einer UI-Definition der Seite festgelegt. Button ist das einzige Steuerelement, das über eine dedizierte Flyouteigenschaft verfügt. Wenn sie auf Button.Flyout festgelegt ist, wird das MenuFlyout angezeigt, wenn die Schaltfläche getippt oder anderweitig aufgerufen wird.

Um ein MenuFlyout anderen Steuerelementen als Inhaltsmenü zuzuordnen, verwenden Sie die ContextFlyout-Eigenschaft , die für jedes UIElement verfügbar ist.

Sie können die angefügte FlyoutBase.AttachedFlyout-Eigenschaft verwenden, um ein MenuFlyout anderen Steuerelementen als reguläres Menü zuzuordnen. Wenn ein MenuFlyout anderen UI-Elementen mithilfe von FlyoutBase.AttachedFlyout zugewiesen wird, müssen Sie entweder die ShowAt-Methode oder die statische ShowAttachedFlyout-Methode aufrufen, um das Flyout anzuzeigen.

Steuerelementstil und -vorlage

Sie können die Standardvorlagen Style und ControlTemplate ändern, um dem Steuerelement ein eindeutiges Aussehen zu verleihen. Informationen zum Ändern des Stils und der Vorlage eines Steuerelements finden Sie unter XAML-Formatvorlagen. Der Standardstil, die Vorlage und die Ressourcen, die das Aussehen des Steuerelements definieren, sind in der generic.xaml Datei enthalten. Zu Entwurfszwecken generic.xaml wird mit dem Windows App SDK NuGet-Paket installiert. Standardmäßig ist der Speicherort \Users\<username>\.nuget\packages\microsoft.windowsappsdk\<version>\lib\uap10.0\Microsoft.UI\Themes\generic.xaml. Stile und Ressourcen aus verschiedenen Versionen des SDK können unterschiedliche Werte aufweisen.

XAML enthält auch Ressourcen, mit denen Sie die Farben eines Steuerelements in verschiedenen visuellen Zuständen ändern können, ohne die Steuerelementvorlage zu ändern. Das Ändern dieser Ressourcen wird bevorzugt, um Eigenschaften wie Hintergrund und Vordergrund festzulegen. Weitere Informationen finden Sie im Abschnitt Leichtes Formatieren des Artikels XAML-Stile .

Konstruktoren

Eigenschaften

Methoden

Ereignisse

Gilt für:

Weitere Informationen

• MenuFlyoutPresenter
• FlyoutBase
• Flyout
• Flyout
• Übersicht über Menüs und Kontextmenüs
• Übersicht über angefügte Eigenschaften
• Kontextmenübeispiel (Windows 10)
• Beispiel für Befehle
• Kontextmenübeispiel (XAML)