MenuFlyout Класс

Определение

/// [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>

Наследование

Object IInspectable DependencyObject FlyoutBase MenuFlyout

Производный

Microsoft.UI.Xaml.Controls.MenuBarItemFlyout

Атрибуты

ContentPropertyAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Примеры

Приложение коллекции WinUI 3 содержит интерактивные примеры большинства элементов управления, функций и функций WinUI 3. Получите приложение из Microsoft Store или получите исходный код в GitHub.

В этом примере создается класс MenuFlyout и используется свойство ContextFlyout, доступное для большинства элементов управления, для отображения MenuFlyout class в качестве контекстного меню.

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

Следующий пример почти идентичен, но вместо использования свойства ContextFlyout для отображения класса MenuFlyout как контекстного меню в нем используется свойство FlyoutBase.ShowAttachedFlyout для его отображения как меню.

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

В этом примере показано, как добавлять и удалять элементы меню во время выполнения в зависимости от изменяющихся условий в приложении.

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

Комментарии

MenuFlyout временно отображает список команд или параметров, связанных с текущими действиями пользователя.

Используйте элемент управления Flyout для отображения отдельных элементов и элемент управления MenuFlyout для отображения меню элементов. Дополнительные сведения см. в разделе Меню и контекстные меню.

Элемент управления MenuFlyout можно использовать в качестве значения свойства Button.Flyout . Обычно это задается в XAML как часть определения пользовательского интерфейса страницы. Кнопка — это единственный элемент управления, имеющий выделенное свойство Flyout . Если задано значение Button.Flyout, menuFlyout отображается при нажатии кнопки или вызове иным образом.

Чтобы связать MenuFlyout с другими элементами управления в качестве меню содержимого, используйте свойство ContextFlyout , доступное в любом элементе UIElement.

Присоединенное свойство FlyoutBase.AttachedFlyout можно использовать для связывания MenuFlyout с другими элементами управления в качестве обычного меню. Если Элемент MenuFlyout назначается другим элементам пользовательского интерфейса с помощью FlyoutBase.AttachedFlyout, необходимо вызвать метод ShowAt или статический метод ShowAttachedFlyout для отображения всплывающего элемента.

Стиль и шаблон элемента управления

Вы можете изменить стандартные параметры Style и ControlTemplate , чтобы придать элементу управления уникальный внешний вид. Сведения об изменении стиля и шаблона элемента управления см. в разделе Стили XAML. Стиль, шаблон и ресурсы по умолчанию, определяющие внешний вид элемента управления, включаются в generic.xaml файл . В целях разработки generic.xaml устанавливается вместе с пакетом NuGet Windows App SDK. По умолчанию, это расположение \Users\<username>\.nuget\packages\microsoft.windowsappsdk\<version>\lib\uap10.0\Microsoft.UI\Themes\generic.xaml. Стили и ресурсы из разных версий пакета SDK могут иметь разные значения.

XAML также включает ресурсы, которые можно использовать для изменения цветов элемента управления в различных визуальных состояниях без изменения шаблона элемента управления. Изменение этих ресурсов предпочтительнее, чем установка таких свойств, как Background и Foreground. Дополнительные сведения см. в разделе Облегчаемые стили статьио стилях XAML .

Конструкторы

Свойства

Методы

События

Применяется к

См. также раздел

• MenuFlyoutPresenter
• FlyoutBase
• Flyout
• Flyout
• Общие сведения о меню и контекстных меню
• Общие сведения о присоединенных свойствах
• Пример контекстного меню (Windows 10)
• Пример команд
• Пример контекстного меню (XAML)