【问题标题】:How to add a new button in title bar next the minimize button in UWP?如何在 UWP 中最小化按钮旁边的标题栏中添加一个新按钮?
【发布时间】:2019-12-09 04:00:37
【问题描述】:

我想在 UWP 应用程序的标题栏中添加一个新按钮,如下所示:

我已经看过一些“类似”的帖子,但答案不是很清楚,而且缺乏细节,我很难理解他们做了什么。

【问题讨论】:

    标签: c# xaml button uwp titlebar


    【解决方案1】:

    默认情况下,UWP 无法向标题栏添加按钮。但 uwp 支持自定义标题栏布局。

    用于开始隐藏标题栏视图

    CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;
    

    创建新的网格布局并将其附加到标题栏后

    Window.Current.SetTitleBar(UserLayout);
    

    创建TitleBar并订阅LayoutMetricsChanged事件,用于动态创建保证金,因为不同数量的系统按钮会有所不同。

    var tBar = CoreApplication.GetCurrentView().TitleBar;
    tBar.LayoutMetricsChanged += OnTitleBarLayoutMetricsChanged;
    

    并添加功能

    public void OnTitleBarLayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
    {
        var bar = sender as CoreApplicationViewTitleBar;
        RightPanel.Margin = new Thickness(0, 0, bar.SystemOverlayRightInset, 0);
    }
    

    将页框导航到主页

    Content.Navigate(typeof(Home), null, new SuppressNavigationTransitionInfo()); // Navigate to Home page with null args and null animation
    

    以 app.xaml.cs 结束设置标准导航框架到此页面

    if (e.PrelaunchActivated == false) {
        if (rootFrame.Content == null) {
            rootFrame.Navigate(typeof(AniMiru.Windows10.Views.AppCustomWindow), e.Arguments);
        }
        Window.Current.Activate();
    }
    

    页面 xaml:

    <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="32"/>
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid x:Name="TopBar" >
                <Grid x:Name="UserLayout" Background="#00000000" />
                <Grid Canvas.ZIndex="1">
                    <StackPanel x:Name="LeftPanel" Orientation="Horizontal" VerticalAlignment="Stretch" HorizontalAlignment="Left">
                        <AutoSuggestBox QueryIcon="Find" PlaceholderText="Search" Width="300" />
                    </StackPanel>
                    <StackPanel x:Name="RightPanel" Orientation="Horizontal" VerticalAlignment="Stretch" HorizontalAlignment="Right">
                        <Button Content="" FontFamily="Segoe MDL2 Assets" FontSize="13" VerticalAlignment="Stretch" />
                        <Button Content="" FontFamily="Segoe MDL2 Assets" FontSize="13" VerticalAlignment="Stretch" />
                    </StackPanel>
                </Grid>
            </Grid>
            <Grid Grid.Row="1">
                <Frame x:Name="Content" />
            </Grid>
        </Grid>
    

    页面 C#:

    public AppCustomWindow()
    {
        this.InitializeComponent();
    
        // Hide titlebar panel and add new layout to title bar
        CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;
        Window.Current.SetTitleBar(UserLayout);
    
        // Add LayoutMetricsChanged Event to TitleBar
        var tBar = CoreApplication.GetCurrentView().TitleBar;
        tBar.LayoutMetricsChanged += OnTitleBarLayoutMetricsChanged;
    
        // Navigate
        Content.Navigate(typeof(Home), null, new SuppressNavigationTransitionInfo()); // Navigate to Home page with null args and null animation
    }
    
    public void OnTitleBarLayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
    {
        var bar = sender as CoreApplicationViewTitleBar;
        RightPanel.Margin = new Thickness(0, 0, bar.SystemOverlayRightInset, 0);
    }
    

    截图:

    网址:

    Title bar customization

    Layout panels

    Handling and raising events


    对不起我的英语。

    最好的问候。

    【讨论】:

    • 只是补充一点:在最小化按钮旁边有一个小的默认可拖动区域,您无法覆盖它。当您尝试制作自定义标题栏时,请考虑这一点。
    猜你喜欢
    • 2013-09-16
    • 2019-10-22
    • 1970-01-01
    • 2022-01-12
    • 1970-01-01
    • 2022-11-11
    • 1970-01-01
    • 2021-08-14
    • 1970-01-01
    相关资源
    最近更新 更多