How to open dual screen window in .Net MAUI

Gaurav Sharma83 20 Reputation points
2023-06-13T04:57:51.12+00:00

I need to open the same application with 2 screens with different UIs. How Can I do that in .net MAUI? How Can I update the second screen by changing anything on the first screen?

I want multi-window in MAUI on Window platform. I have created a two window, first window screen for "splash screen" with small UI and without title bar. After starting (with minimal timer), it navigates to the second window screen, but the second window screen also comes with smaller UI and no title bar. I want to create second window screen with title bar and proper window UI.

please check code below for UI without title bar:

Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) =>
        {
#if WINDOWS
                    const int WindowWidth = 500;
                    const int WindowHeight = 300;
                    var mauiWindow = handler.VirtualView;
                    var nativeWindow = handler.PlatformView;

                    nativeWindow.Activate();
                    nativeWindow.ExtendsContentIntoTitleBar = false;
                    IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
                    WindowId windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
                    AppWindow appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);

                     if(appWindow.Presenter is OverlappedPresenter p)
                        {
                p.SetBorderAndTitleBar(false, false);//used for hide the tittle bar
                var disp = DeviceDisplay.Current.MainDisplayInfo;
                if (appWindow is not null)
                {
                    Microsoft.UI.Windowing.DisplayArea displayArea = Microsoft.UI.Windowing.DisplayArea.GetFromWindowId(windowId, Microsoft.UI.Windowing.DisplayAreaFallback.Nearest);
                    if (displayArea is not null)
                    {
                        var CenteredPosition = appWindow.Position;
                        CenteredPosition.X = ((displayArea.WorkArea.Width - appWindow.Size.Width) / 2);
                        CenteredPosition.Y = ((displayArea.WorkArea.Height - appWindow.Size.Height) / 2);
                        appWindow.Move(CenteredPosition);
                        appWindow.Resize(new SizeInt32(WindowWidth, WindowHeight));// used for Resize the window screen UI

 

                    }
                }

            }

 

#endif
        });
Developer technologies | .NET | .NET MAUI
{count} votes

1 answer

Sort by: Most helpful
  1. Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff
    2023-06-14T08:39:02.5066667+00:00

    Hello,

    You set Microsoft.Maui.Handlers.WindowHandler.Mapper..., it will make all window objects to trigger the code.

    For more details, please refer to .NET MAUI handlers - .NET MAUI | Microsoft Learn

    You could try to find the WindowHandler of the first window, then call the platform-specific code. It won't affect the second window.

    For example:

    If you set the first window like this: Window firstWindow = new Window(new MyPage());

    You could find the window in the Loaded method of MyPage(The root page of the first window might be AppShell, you could find the window in the Loaded method of AppShell)

    public partial class MyPage : ContentPage
    {
        public MyPage()
        {
            InitializeComponent();
            this.Loaded += MyPage_Loaded;
        }
    
       private void MyPage_Loaded(object sender, EventArgs e)
        {
            var handler = this.Window.Handler as Microsoft.Maui.Handlers.WindowHandler;// find the handler and platform view
            var mauiWindow = handler.VirtualView;
            var nativeWindow = handler.PlatformView;
    //... call the hide title bar method
    
        }
    }
    

    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.

    0 comments No comments

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.