maui桌面端標題欄設置和窗口調整

maui桌面端標題欄設置和窗口調整

如果你現在開始學習並使用maui開發桌面端,那麼接下來的問題相信你都會遇到並且會想著嘗試找方法解決它。

最后更新 2023/2/7 下午12:22
智州Ryan
预计阅读 4 分钟
分类
MAUI
标签
.NET MAUI

本文由網友投稿。

作者:智州 ryan

原文標題:maui 桌面端標題欄設置和窗口調整

原文連結:https://blog.csdn.net/Sir_aligaduo/article/details/128880940

寫在前面

如果你現在開始學習並使用 maui 開發桌面端,那麼接下來的問題相信你都會遇到並且會想著嘗試找方法解決它。

問題

本人在使用目前 VS2022 最新版 17.4 Professional 版创建新的 MAUI APP 基于.NET6.0 项目时,发现完全找不到跟 wpf 一样的WindowStyle或者ResizeMode这样的属性,有点强迫症,一定要把这个标题栏去掉,想着应该不难,但是资料太少了,文档写的也很乱,根本无法对应到这个,找着找着,加到了Dotnet9 网站站长,在他耐心的帮忙下,我解决了这个问题,所以特别感谢Dotnet9 网站站长风中一匹狼!

maui 自帶的 windows 下的窗口是這樣的(完全不在我審美上):

解決方法

一开始,我是根据站长网站里提供的方法,链接: Maui 学习之路(1)-Windows 窗体设置尝试解决该问题。

雖然能正常根據裡面操作了,但是我操作的時候可能是我操作的問題,老是實現不了,只把標題欄跟下面的 content 融在一起,標題欄還是在那,而且我不好改顏色。

加了站長微信,站長耐心的幫我找了大佬 chister.wu 的 demo, 對照他的 demo 終於是把這個問題解決了,現在總結下去掉原標題欄的方法。

  1. 完美去掉标题栏,下面是代码,写在 MauiProgram.cs 里配置生命周期方法,具体的资料在上面的链接: Maui 学习之路(1)-Windows 窗体设置 里也有,但是看起来比较麻烦,直接看代码可能好理解一点:
var builder = MauiApp.CreateBuilder();
builder.UseMauiApp<App>()
		.ConfigureFonts(fonts =>
		{
			fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
			fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
		})
		.ConfigureLifecycleEvents(events =>
         {

#if WINDOWS
        events.AddWindows(windows => windows
        .OnWindowCreated(window =>
                      {
                          //window.SizeChanged += OnSizeChanged;
                          MauiWinUIWindow mauiwin = window as MauiWinUIWindow;
                          if (mauiwin == null) { return; }

                          //关闭扩展内容
                          mauiwin.ExtendsContentIntoTitleBar = false;
                          mauiwin.Title = "Hello Maui";


                          通过maui窗口句柄获取appwindow---
                          ///这里有个操蛋的东西我用最新版新建的工程没法直接getappwindow所以用了文章里的方法
                          var wndId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(mauiwin.WindowHandle);
                          Microsoft.UI.Windowing.AppWindow appwin = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(wndId);

                          //对于OverlappedPresenter的解释文档在这个网址
                          //https://learn.microsoft.com/zh-tw/windows/windows-app-sdk/api/winrt/microsoft.ui.windowing.overlappedpresenter?view=windows-app-sdk-1.2

                          //大致就是OverlappedPresenter会设置这个窗口,这个窗口可以和其他窗口重叠,并对窗口标题栏 状态栏 工作栏进行设置,以及其他一些调整窗口的操作
                          var customOverlappedPresenter = Microsoft.UI.Windowing.OverlappedPresenter.CreateForContextMenu();
                          appwin.SetPresenter(customOverlappedPresenter);
                      }));
#endif
            });

        return builder.Build();

原理就是重寫創建窗口的方法,在這裡重寫有個好處,窗口加載之後會刷新,我在 mainpage.cs 下寫 loaded 的方法的話雖然標題欄的按鈕去掉了,但是標題欄那塊並沒有去掉,把站長的文章和 demo 給的結合起來才實現了這樣的效果。

效果圖如下, 完美去掉了:

  1. 直接在 mainpage 里寫 loaded 方法,這也是一開始我用的方法,代碼如下:
private void ContentPage_Loaded(object sender, EventArgs e)
    {

#if WINDOWS
        var winuiWindow = Window.Handler?.PlatformView as  Microsoft.UI.Xaml.Window;
		MauiWinUIWindow maui = winuiWindow as MauiWinUIWindow;

        winuiWindow.ExtendsContentIntoTitleBar = false;
        if (winuiWindow is null)
            return;

		var wndId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(maui.WindowHandle);
        Microsoft.UI.Windowing.AppWindow appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(wndId);
        //var appWindow = maui.GetAppWindow();
        if (appWindow is null)
            return;

        var customOverlappedPresenter =  Microsoft.UI.Windowing.OverlappedPresenter.CreateForContextMenu();
        appWindow.SetPresenter(customOverlappedPresenter);
#endif
    }

不足之處就是她會有一個類似 wpf 的 captionheight 標題欄那樣的東西,視圖沒完全刷新。

以上就是去标题栏的方法,想要代码的可以去 gitee 上自己下载,链接: maui-title-handle-demo

另外对于后续窗口的大小调整,自定义放大缩小按钮可以参考MauiDemo,注意一定要看清自己的项目配置。

參考文章:

參考 demo

MauiDemo

Keep Exploring

延伸阅读

更多文章