MenuFlyout 類別
定義
重要
部分資訊涉及發行前產品,在發行之前可能會有大幅修改。 Microsoft 對此處提供的資訊,不做任何明確或隱含的瑕疵擔保。
表示顯示命令功能表的飛出視窗。
/// [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 : FlyoutBase
Public Class MenuFlyout
Inherits FlyoutBase
<MenuFlyout>
oneOrMoreItems
</MenuFlyout>
- 繼承
- 衍生
- 屬性
Windows 需求
裝置系列 |
Windows 10 (已於 10.0.10240.0 引進)
|
API contract |
Windows.Foundation.UniversalApiContract (已於 v1.0 引進)
|
範例
這個範例會建立 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 屬性來將它顯示為功能表。
<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 會暫時顯示與使用者目前正在執行的動作相關的命令或選項清單。
使用 飛出視窗 控制項來顯示單一專案,並使用 MenuFlyout 控制項來顯示專案的功能表。 如需詳細資訊,請參閱 功能表和操作功能表。
MenuFlyout 控制項可作為 Button.Flyout 屬性的值。 這通常會在 XAML 中設定為頁面 UI 定義的一部分。 Button 是唯一具有專用 飛出視窗 屬性的控制項。 當設定為 Button.Flyout時,MenuFlyout 會在點選或叫用按鈕時顯示。
若要建立 MenuFlyout 與其他控制項的關聯,請使用任何 UIElement 上可用的 CoNtextFlyout 屬性。
舊版的注意事項
注意
在 Windows 10 Anniversary Update (SDK 14393 版) 之前,無法使用 CoNtextFlyout 屬性。 針對舊版,請使用 FlyoutBase.AttachedFlyout 附加屬性。
您可以使用 FlyoutBase.AttachedFlyout 附加屬性,將 MenuFlyout 與其他控制項產生關聯。 使用 FlyoutBase.AttachedFlyout將 MenuFlyout 指派給其他 UI 元素時,您必須呼叫 ShowAt 方法或靜態 ShowAttachedFlyout 方法來顯示飛出視窗。
除了上述成員之外,還有基類 FlyoutBase 的其他成員,通常用於一般 MenuFlyout 案例:
- FlyoutBase.AttachedFlyout:將 MenuFlyout 與特定 UI 元素產生關聯的附加屬性, (這可以是任何 FrameworkElement 衍生類別) 。
- ShowAttachedFlyout:靜態方法,可透過 FlyoutBase.AttachedFlyout 使用方式判斷飛出視窗是否已經與 UI 元素相關聯。 如果是,方法會在內部使用您指定的FrameworkElement呼叫ShowAt。
控制項樣式和範本
您可以修改預設 的 Style 和 ControlTemplate ,讓控制項具有唯一的外觀。 如需修改控制項樣式和範本的相關資訊,請參閱 設定控制項的樣式。 定義控制面板的預設樣式、範本和資源會包含在 檔案中 generic.xaml
。 為了設計目的, generic.xaml
可在本機使用 SDK 或 NuGet 套件安裝。
-
建議) 的 WinUI 樣式 (: 如需 WinUI 的更新樣式,請參閱
\Users\<username>\.nuget\packages\microsoft.ui.xaml\<version>\lib\uap10.0\Microsoft.UI.Xaml\Themes\generic.xaml
。 -
非 WinUI 樣式: 如需內建樣式,請參閱
%ProgramFiles(x86)%\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\<SDK version>\Generic\generic.xaml
。
如果您自訂安裝,位置可能會不同。 不同 SDK 版本的樣式和資源可能會有不同的值。
XAML 也包含資源,可讓您用來修改不同視覺狀態中控制項的色彩,而不需修改控制項範本。 修改這些資源是慣用的設定屬性,例如 Background 和 Foreground。 如需詳細資訊,請參閱XAML 樣式文章的輕量型樣式一節。 從 Windows 10 版本 1607 (SDK 14393) 開始,即可使用輕量型樣式資源。
版本歷程記錄
Windows 版本 | SDK 版本 | 新增值 |
---|---|---|
1809 | 17763 | ShowAt |
建構函式
MenuFlyout() |
初始化 MenuFlyout 類別的新實例。 |
屬性
AllowFocusOnInteraction |
取得或設定值,這個值表示當使用者與其互動時,專案是否會自動取得焦點。 (繼承來源 FlyoutBase) |
AllowFocusWhenDisabled |
取得或設定值,指定控制項在停用時是否可以接收焦點。 (繼承來源 FlyoutBase) |
AreOpenCloseAnimationsEnabled |
取得或設定值,這個值表示當飛出視窗開啟或關閉時,是否播放動畫。 (繼承來源 FlyoutBase) |
Dispatcher |
取得這個 物件相關聯的 CoreDispatcher 。 CoreDispatcher代表可在 UI 執行緒上存取DependencyObject的功能,即使程式碼是由非 UI 執行緒起始也一樣。 (繼承來源 DependencyObject) |
ElementSoundMode |
取得或設定值,指定控制項是否播放音效的喜好設定。 (繼承來源 FlyoutBase) |
InputDevicePrefersPrimaryCommands |
取得值,指出用來開啟飛出視窗的輸入裝置是否不容易開啟次要命令。 (繼承來源 FlyoutBase) |
IsConstrainedToRootBounds |
取得值,這個值表示飛出視窗是否顯示在 XAML 根目錄的界限內。 (繼承來源 FlyoutBase) |
IsOpen |
取得值,這個值表示飛出視窗是否開啟。 (繼承來源 FlyoutBase) |
Items |
取得用來產生功能表內容的集合。 |
LightDismissOverlayMode |
取得或設定值,這個值會指定 淺色關閉 UI 外部的區域是否變深。 (繼承來源 FlyoutBase) |
MenuFlyoutPresenterStyle |
取得或設定轉譯 MenuFlyout時所使用的樣式。 |
MenuFlyoutPresenterStyleProperty |
識別 MenuFlyoutPresenterStyle 相依性屬性。 |
OverlayInputPassThroughElement |
取得或設定即使飛出視窗重迭下方的指標輸入事件,也應該接收指標輸入事件的專案。 (繼承來源 FlyoutBase) |
Placement |
取得或設定要用於飛出視窗的預設放置位置,相對於其放置目標。 (繼承來源 FlyoutBase) |
ShouldConstrainToRootBounds |
取得或設定值,這個值表示是否應該在 XAML 根目錄的界限內顯示飛出視窗。 (繼承來源 FlyoutBase) |
ShowMode |
取得或設定值,這個值表示顯示飛出視窗的行為。 (繼承來源 FlyoutBase) |
Target |
取得要當做飛出視窗放置目標的 元素。 (繼承來源 FlyoutBase) |
XamlRoot |
取得或設定檢視這個飛出視窗的 XamlRoot。 (繼承來源 FlyoutBase) |
方法
事件
Closed |
發生于隱藏飛出視窗時。 (繼承來源 FlyoutBase) |
Closing |
發生于飛出視窗開始隱藏時。 (繼承來源 FlyoutBase) |
Opened |
發生于顯示飛出視窗時。 (繼承來源 FlyoutBase) |
Opening |
發生于顯示飛出視窗之前。 (繼承來源 FlyoutBase) |