加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

c# – 页面中心的MenuFlyout

发布时间:2020-12-15 23:27:03 所属栏目:百科 来源:网络整理
导读:在我的UWP中,我正在尝试在Frame的中心打开一个MenuFlyout. 我怎样才能把它放在中心? 我已经尝试过这段代码,但它在框架顶部设置了弹出窗口. private void ListView_ItemClick(object sender,ItemClickEventArgs e) { var m = new MenuFlyout(); var t = new
在我的UWP中,我正在尝试在Frame的中心打开一个MenuFlyout.

我怎样才能把它放在中心?

我已经尝试过这段代码,但它在框架顶部设置了弹出窗口.

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

甚至试图添加m.Placement = Windows.UI.Xaml.Controls.Primitives.FlyoutPlacementMode.Center;但是FlyoutPlacementMode枚举不包含Center.

解决方法

不幸的是,FlyoutPlacementMode中没有中心值,因此您需要为解决方法编写更多代码.

我们的想法是首先将FlyoutPlacementMode设置为Full,然后将内容拉伸以填充整个页面,我们更改MenuFlyoutPresenter的样式以使其内容在水平和垂直方向上居中.

所以我所做的是使用Blend生成以下默认样式并将其放在Page.Resources中,然后在根网格上指定Horizo??ntalAlignment =“Center”VerticalAlignment =“Center”,以便将内容置于中间.

<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,就像这样 –

var m = new MenuFlyout
{
    Placement = FlyoutPlacementMode.Full,MenuFlyoutPresenterStyle = (Style)this.Resources["CenteredMenuFlyoutPresenterStyle"]
};

var t = new MenuFlyoutItem() { Text = "SomeTxt" };
m.Items.Add(t);
m.ShowAt((FrameworkElement)sender);

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读