winui3开发笔记(二)自定义标题栏
参考文章链接:https://www.programminghunter.com/article/46392310600/
注意事项
获取 AppWindowTitleBar 的实例并设置其颜色属性时,InitializeTitleBar(AppWindow.TitleBar);,只适用于Windows App SDK 1.2及以上,所以如果用win10开发,最多1.0,之前一直没有发现时开发系统环境问题,根本运行不了。所以改成win11开发就可以了
官方文档说明链接:https://learn.microsoft.com/zh-cn/windows/apps/develop/title-bar?tabs=wasdk
代码:
App.xaml.cs:
using Microsoft.UI;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Controls.Primitives;
using Microsoft.UI.Xaml.Data;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Media;
using Microsoft.UI.Xaml.Navigation;
using Microsoft.UI.Xaml.Shapes;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.ApplicationModel;
using Windows.ApplicationModel.Activation;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.Storage;
using WinRT.Interop;namespace App1
{public partial class App : Application{public App(){this.InitializeComponent();}protected override void OnLaunched(Microsoft.UI.Xaml.LaunchActivatedEventArgs args){m_window = new MainWindow();_windowHandle = WindowNative.GetWindowHandle(m_window);var windowId = Win32Interop.GetWindowIdFromWindow(_windowHandle);AppWindow = AppWindow.GetFromWindowId(windowId);AppWindow.TitleBar.ExtendsContentIntoTitleBar = true;InitializeTitleBar(AppWindow.TitleBar);m_window.Activate();}private IntPtr _windowHandle;public static AppWindow AppWindow { get; private set; }// 应用窗口对象.public static Window m_window { get; private set; }// 主窗口.public static void InitializeTitleBar(AppWindowTitleBar bar){bar.ExtendsContentIntoTitleBar = true;// 设置成自己预期的颜色即可bar.ButtonBackgroundColor = ColorHelper.FromArgb(0, 240, 243, 249);bar.ButtonForegroundColor = Colors.Black;bar.ButtonHoverBackgroundColor = ColorHelper.FromArgb(0, 240, 243, 249);bar.ButtonHoverForegroundColor = Colors.Black;bar.ButtonPressedBackgroundColor = ColorHelper.FromArgb(0, 240, 243, 249);bar.ButtonPressedForegroundColor = Colors.Black;bar.ButtonInactiveBackgroundColor = ColorHelper.FromArgb(0, 240, 243, 249);bar.ButtonInactiveForegroundColor = Colors.Black;}}
}
AppTitleBar.xaml
<Grid Height="48" Padding="16,0,0,0" Background="#F0F3F9" RequestedTheme="Light"><Grid.ColumnDefinitions><ColumnDefinition Width="Auto" /><ColumnDefinition x:Name="SearchColumn" Width="*" /><ColumnDefinition Width="120" /></Grid.ColumnDefinitions><StackPanel VerticalAlignment="Center" Orientation="Horizontal" Spacing="16"><TextBlock VerticalAlignment="Center" Style="{StaticResource CaptionTextBlockStyle}"Text="DeskTop" /></StackPanel>
</Grid>
MainWindow.xaml
<Grid><Grid.RowDefinitions><RowDefinition Height="Auto" /><RowDefinition Height="*" /></Grid.RowDefinitions><!--删除border,改换titlebar--><local1:AppTitleBar /><Frame x:Name="frame" Grid.Row="1"></Frame>
</Grid>
按照最开始的文章链接做的实验图片:
1、
2、3、
4、自定义