MAUI WINDOWS AND SIZES

Question

I want to clarify the following 2 questions. The first is how I can remove the upper part where the controls are located to minimize and close the window and the program only on the ScreenPage and on the LoginPage to put my own I attached an image pointing in red to specify :)

And the second question is how can I change the size of the window, the splash screen one size, the login screen another, etc. Then I show you how I tried the sizes:

SplashScreenPage.xaml.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using DigitalBusiness.Views.LoginScreen;
namespace DigitalBusiness.Views.SplashScreen
{
    public partial class SplashScreenPage : ContentPage
    {
        public SplashScreenPage()
        {
            InitializeComponent();
            Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) =>
            {
#if WINDOWS
            
            int winWidth = 760;
            int winHeight = 450;
                        var mauiWindow = handler.VirtualView;
                        var nativeWindow = handler.PlatformView;
                        nativeWindow.Activate();
                        IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
                        var windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
                        var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
                        appWindow.Resize(new Windows.Graphics.SizeInt32(winWidth, winHeight));
#endif
            });
        }
        protected override async void OnAppearing()
        {
            base.OnAppearing();
            // Load data or perform initialization tasks
            await LoadData();
            // Navigate to the login page
            await Navigation.PushModalAsync(new LoginScreenPage());
        }
        private async Task LoadData()
        {
            // Perform data loading tasks here
            // For example, fetching data from a remote server
            await Task.Delay(2000); // Simulating a delay here, replace with your actual data loading logic
        }
    }
}

LoginScreenPage.xaml.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace DigitalBusiness.Views.LoginScreen
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class LoginScreenPage : ContentPage
    {
        public LoginScreenPage()
        {
            InitializeComponent();
            Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) =>
            {
#if WINDOWS
            
            int winWidth = 450;
            int winHeight = 760;
                        var mauiWindow = handler.VirtualView;
                        var nativeWindow = handler.PlatformView;
                        nativeWindow.Activate();
                        IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
                        var windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
                        var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
                        appWindow.Resize(new Windows.Graphics.SizeInt32(winWidth, winHeight));
#endif
            });
        }
    }
}

The problem is that the login window accepts the same size values even though I change them in the login file and I want to add more windows as a dashboard that I want to have a different size, it would be of great help to solve these doubts.

Answer 1

Hello,

Your two questions are both related to Microsoft.Maui.MauiWinUIWindow, the first one is to hide the TitleBar on Windows platform. You could find the Window.Handler.PlatformView, then call the native methods.

And the second one is to set the width and height. Each Page has a Window property, you could set the Width and Height in OnAppearing() method or Loaded method.

In addition, both two page's Window has a same width and height because you set the width and height in a Mapper, you could try to find the Page's Window property, then call the native methods.

Please refer to the following code:

public NewPage1()// a new page, you could add the code on your SplashScreenPage and LoginScreenPage
    {
        InitializeComponent();
        this.Loaded += NewPage1_Loaded;
       
    }
protected override void OnAppearing()
    {
        base.OnAppearing();
#if WINDOWS
        this.Window.Width = 400;
        this.Window.Height = 600;
// set height directly or find handler then set winHeight
       //int winWidth = 450;
        //int winHeight = 760;
        if (this.Window.Handler != null)
        {
           var mauiWindow = this.Window.Handler.VirtualView;
            var nativeWindow = this.Window.Handler.PlatformView as Microsoft.Maui.MauiWinUIWindow; ;
            nativeWindow.Activate();
            IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
            var windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
            var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
           //appWindow.Resize(new Windows.Graphics.SizeInt32(winWidth, winHeight));// set width and height
           var p = appWindow.Presenter as OverlappedPresenter;
            nativeWindow.ExtendsContentIntoTitleBar = false;// if you want to show the Titlebar in other pages, please find the window of other pages, then set True.
            p.SetBorderAndTitleBar(false, false);
        }
#endif
    }
   private void NewPage1_Loaded(object sender, EventArgs e)
    {
        this.Window.Width = 400;
        .....
   }

For more details, you can see .NET MAUI handlers - .NET MAUI | Microsoft Learn

Best Regards,

Wenyan Zhang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.