次の方法で共有


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
派生
属性

ヒント

詳細、設計ガイダンス、およびコード例については、「 メニューとコンテキスト メニュー」を参照してください。

WinUI 3 ギャラリー アプリには、ほとんどの WinUI 3 コントロールと機能の対話型の例が含まれています。 Microsoft Store からアプリを入手するか、GitHub でソース コードを取得します。

この例では、MenuFlyout クラスを作成し、ほとんどのコントロールで利用できる ContextFlyout プロパティを使って、コンテキスト メニューとして MenuFlyout クラスを表示します。

<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 プロパティを使って、メニューとして MenuFlyout クラスを表示します。

<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 は、ユーザーが現在行っていることに関連するコマンドまたはオプションの一覧を一時的に表示します。

メニュー ポップアップ コントロール

ポップアップ コントロールを使用して 1 つの項目を表示し、MenuFlyout コントロールを使用して項目のメニューを表示します。 詳細については、「 メニューとコンテキスト メニュー」を参照してください。

MenuFlyout コントロールは、 Button.Flyout プロパティの値として使用できます。 これは通常、ページの UI 定義の一部として XAML で設定されます。 Button は、専用の Flyout プロパティを持つ唯一のコントロールです。 Button.Flyout に設定すると、ボタンがタップされたとき、または呼び出されたときに MenuFlyout が表示されます。

MenuFlyout をコンテンツ メニューとして他のコントロールに関連付けるには、UIElement で使用できる ContextFlyout プロパティを使用します。

FlyoutBase.AttachedFlyout 添付プロパティを使用して、MenuFlyout を通常のメニューとして他のコントロールに関連付けることができます。 FlyoutBase.AttachedFlyout を使用して MenuFlyout が他の UI 要素に割り当てられている場合、ポップアップを表示するには、ShowAt メソッドまたは静的 ShowAttachedFlyout メソッドを呼び出す必要があります。

コントロール のスタイルとテンプレート

既定の StyleControlTemplate を変更して、コントロールに一意の外観を与えることができます。 コントロールのスタイルとテンプレートの変更については、「 XAML スタイル」を参照してください。 コントロールの外観を定義する既定のスタイル、テンプレート、およびリソースがファイルに generic.xaml 含まれます。 設計上の目的で、 generic.xaml は、Windows アプリ SDK NuGet パッケージと共にインストールされます。 既定では、この場所は \Users\<username>\.nuget\packages\microsoft.windowsappsdk\<version>\lib\uap10.0\Microsoft.UI\Themes\generic.xaml です。 SDK の異なるバージョンのスタイルとリソースの値が異なる場合があります。

XAML には、コントロール テンプレートを変更せずに、さまざまなビジュアル状態でコントロールの色を変更するために使用できるリソースも含まれています。 これらのリソースの変更は、 Background や Foreground などのプロパティを設定する場合に推奨 されます。 詳細については、XAML スタイルに関する記事の「軽量のスタイル設定」セクションを参照してください。

コンストラクター

MenuFlyout()

MenuFlyout クラスの新しいインスタンスを初期化します。

プロパティ

AllowFocusOnInteraction

ユーザーが操作するときに要素が自動的にフォーカスを取得するかどうかを示す値を取得または設定します。

(継承元 FlyoutBase)
AllowFocusWhenDisabled

コントロールが無効になっているときにフォーカスを受け取ることができるかどうかを示す値を取得または設定します。

(継承元 FlyoutBase)
AreOpenCloseAnimationsEnabled

ポップアップを開くか閉じたときにアニメーションを再生するかを示す値を取得または設定します。

(継承元 FlyoutBase)
Dispatcher

常に Windows アプリ SDK アプリで を返しますnull。 代わりに DispatcherQueue を使用してください。

(継承元 DependencyObject)
DispatcherQueue

このオブジェクトが DispatcherQueue 関連付けられている を取得します。 は DispatcherQueue 、コードが UI 以外のスレッドによって開始された場合でも、UI スレッド上の にアクセス DependencyObject できる機能を表します。

(継承元 DependencyObject)
ElementSoundMode

サウンドを再生するかどうかのコントロールの設定を指定する値を取得または設定します。

(継承元 FlyoutBase)
InputDevicePrefersPrimaryCommands

ポップアップを開くために使用される入力デバイスがセカンダリ コマンドを簡単に開かないかどうかを示す値を取得します。

(継承元 FlyoutBase)
IsConstrainedToRootBounds

ポップアップが XAML ルートの境界内に表示されるかどうかを示す値を取得します。 このプロパティは、Windows アプリ SDK アプリでは常に true です

(継承元 FlyoutBase)
IsOpen

ポップアップが開いているかどうかを示す値を取得します。

(継承元 FlyoutBase)
Items

メニューの内容を生成するために使用されるコレクションを取得します。

LightDismissOverlayMode

ライトを閉じる UI の外側の領域を暗くするかどうかを指定する値を取得または設定します。

(継承元 FlyoutBase)
MenuFlyoutPresenterStyle

MenuFlyout のレンダリング時に使用するスタイルを取得または設定します。

MenuFlyoutPresenterStyleProperty

MenuFlyoutPresenterStyle 依存関係プロパティを識別します。

OverlayInputPassThroughElement

ポップアップのオーバーレイの下にある場合でも、ポインター入力イベントを受け取る要素を取得または設定します。

(継承元 FlyoutBase)
Placement

ポップアップの配置ターゲットに対して使用される既定の配置を取得または設定します。

(継承元 FlyoutBase)
ShouldConstrainToRootBounds

ポップアップを XAML ルートの境界内に表示するかどうかを示す値を取得または設定します。

(継承元 FlyoutBase)
ShowMode

表示時のポップアップの動作を示す値を取得または設定します。

(継承元 FlyoutBase)
SystemBackdrop

このポップアップに適用するシステム背景を取得または設定します。 背景はポップアップ コンテンツの背後にレンダリングされます。

(継承元 FlyoutBase)
Target

ポップアップの配置ターゲットとして使用する要素を取得します。

(継承元 FlyoutBase)
XamlRoot

このポップアップを表示する XamlRoot を取得または設定します。

(継承元 FlyoutBase)

メソッド

ClearValue(DependencyProperty)

依存関係プロパティのローカル値をクリアします。

(継承元 DependencyObject)
CreatePresenter()

派生クラスでオーバーライドされると、派生コントロールに適したポップアップ コンテンツを表示するようにコントロールを初期化します。 注: このメソッドには基底クラスの実装がなく、派生クラスでオーバーライドする必要があります。

(継承元 FlyoutBase)
GetAnimationBaseValue(DependencyProperty)

依存関係プロパティに対して確立された基本値を返します。これは、アニメーションがアクティブでない場合に適用されます。

(継承元 DependencyObject)
GetValue(DependencyProperty)

DependencyObject から依存関係プロパティの現在の有効な値を返します。

(継承元 DependencyObject)
Hide()

ポップアップを閉じます。

(継承元 FlyoutBase)
OnProcessKeyboardAccelerators(ProcessKeyboardAcceleratorEventArgs)

アプリでキーボード ショートカット (アクセラレータ) が処理される直前に呼び出されます。 アプリケーション コードまたは内部プロセスが ProcessKeyboardAccelerators を呼び出すたびに呼び出されます。 このメソッドをオーバーライドして、既定のアクセラレータ処理に影響を与えます。

(継承元 FlyoutBase)
ReadLocalValue(DependencyProperty)

ローカル値が設定されている場合は、依存関係プロパティのローカル値を返します。

(継承元 DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)

この DependencyObject インスタンスの特定の DependencyProperty に対する変更をリッスンするための通知関数を登録します。

(継承元 DependencyObject)
SetValue(DependencyProperty, Object)

DependencyObject の依存関係プロパティのローカル値を設定します。

(継承元 DependencyObject)
ShowAt(DependencyObject, FlyoutShowOptions)

指定したオプションを使用して、指定した要素に対して配置されたポップアップを表示します。

(継承元 FlyoutBase)
ShowAt(FrameworkElement)

指定した要素に対して配置されたポップアップを表示します。

(継承元 FlyoutBase)
ShowAt(UIElement, Point)

指定したターゲット要素を基準にして、指定したオフセットに配置されたポップアップを表示します。

TryInvokeKeyboardAccelerator(ProcessKeyboardAcceleratorEventArgs)

キーボード ショートカット (アクセラレータ) を呼び出そうとします。

(継承元 FlyoutBase)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)

RegisterPropertyChangedCallback を呼び出して以前に登録した変更通知を取り消します。

(継承元 DependencyObject)

イベント

Closed

ポップアップが非表示のときに発生します。

(継承元 FlyoutBase)
Closing

ポップアップが非表示になり始めると発生します。

(継承元 FlyoutBase)
Opened

ポップアップが表示されるときに発生します。

(継承元 FlyoutBase)
Opening

ポップアップが表示される前に発生します。

(継承元 FlyoutBase)

適用対象

こちらもご覧ください