在我的UWP中,我正在尝试在Frame的中心打开一个MenuFlyout。
如何将其置于中心?
我已经尝试过这段代码,但它在框架顶部设置了弹出窗口。
maskLayer
甚至尝试添加private void ListView_ItemClick(object sender,ItemClickEventArgs e) {
var m = new MenuFlyout();
var t = new MenuFlyoutItem() { Text = "SomeTxt"};
m.Items.Add(t);
m.ShowAt((FrameworkElement)Frame);
}
,但FlyoutPlacementMode枚举不包含m.Placement = Windows.UI.Xaml.Controls.Primitives.FlyoutPlacementMode.Center;
。
答案 0 :(得分:7)
不幸的是Center
中没有FlyoutPlacementMode
值,因此您需要为解决方法编写更多代码。
我们的想法是首先将FlyoutPlacementMode
设置为Full
,然后我们不会将内容延伸到整个页面,而是更改Style
的{{1}}使其内容水平和垂直居中。
所以我所做的是使用Blend生成以下默认样式并将其放在MenuFlyoutPresenter
内,然后在根Page.Resources
上指定HorizontalAlignment="Center" VerticalAlignment="Center"
以使内容居中在中间。
Grid
然后只需将样式应用于<Page.Resources>
<Style x:Key="CenteredMenuFlyoutPresenterStyle" TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}" />
<Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundChromeHighBrush}" />
<Setter Property="BorderThickness" Value="{ThemeResource FlyoutBorderThemeThickness}" />
<Setter Property="Padding" Value="{ThemeResource MenuFlyoutPresenterThemePadding}" />
<Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False" />
<Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="False" />
<Setter Property="ScrollViewer.ZoomMode" Value="Disabled" />
<Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}" />
<Setter Property="MaxWidth" Value="{ThemeResource FlyoutThemeMaxWidth}" />
<Setter Property="MinHeight" Value="{ThemeResource MenuFlyoutThemeMinHeight}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="MenuFlyoutPresenter">
<Grid Background="{TemplateBinding Background}" HorizontalAlignment="Center" VerticalAlignment="Center">
<ScrollViewer x:Name="MenuFlyoutPresenterScrollViewer" AutomationProperties.AccessibilityView="Raw" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}">
<ItemsPresenter />
</ScrollViewer>
<Border x:Name="MenuFlyoutPresenterBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
,就像这样 -
MenuFlyout