WinFormedge 增加登录页面（自定义布局，非左右布局） 并作为启动页面 及两种布局切换全屏非全屏

WinFormedge  增加登录页面（自定义布局，非左右布局）并作为启动页面 及两种布局切换全屏非全屏

项目下载地址：https://gitee.com/linxuanchen/WinFormedge 本案例采用的是：FluentUIBlazorExampleApp

1、增加一个自定义布局（Components/Layout下新建EmptyLayout.razor布局文件）

代码如下：

@inherits LayoutComponentBase

@Body
<FluentToastProvider />

2、登录页面代码 login.razor

@page "/"为启动页，@layout EmptyLayout采用自定义布局

@page "/"

@layout EmptyLayout

<div>
    <FluentButton app-command="close" >退出</FluentButton>
    <FluentSpacer Width="50" />
    <FluentButton OnClick="login">登录</FluentButton>
</div>

@code {

    private void login()
    {
        try
        {
            navigationManager.NavigateTo("/home");
            navigationManager.Refresh();//全屏非全屏之间切换时，要刷新一下
        }
        catch (Exception ex)
        {
            ToastService.ShowWarning("数据库连接错误！", 3000);
        }
        
        }
    
}

3、MainWindow.cs的相关代码

    public MainWindow()
    {
        Icon = new System.Drawing.Icon(new MemoryStream(Properties.Resources.WinFormiumBlazor));

        Url = "https://blazorapp.local/";

        Load += MainWindow_Load;
        //dom加载的时候执行的方法，以下两个方法均可
        //DOMContentLoaded += MainWindow_DOMContentLoaded;
        DOMContentLoaded += OnDOMContentLoaded;
        //窗体位置，屏幕中心
        StartPosition = FormStartPosition.CenterParent;
        
        //BackColor = System.Drawing.Color.Transparent;//窗体背景透明
        //WindowTitle = "FluentUI Blazor00000";

    }

    private void MainWindow_DOMContentLoaded(object? sender, Microsoft.Web.WebView2.Core.CoreWebView2DOMContentLoadedEventArgs e)
    {
        if (CoreWebView2 != null)
        {
            
            if(CoreWebView2.Source.Equals("https://blazorapp.local/"))
            {
                WindowState = FormWindowState.Normal;
            } else
            {
                WindowState = FormWindowState.Maximized;
            }
        }
    }
    private void OnDOMContentLoaded(object? sender, Microsoft.Web.WebView2.Core.CoreWebView2DOMContentLoadedEventArgs e)
    {
        if (CoreWebView2 != null)
        {
            //根据路由判断启动页面，根路由为启动页面，否则为其他页面
            //注意全屏和非全屏之间切换时要调用 navigationManager.Refresh()方法,详见login.razor及MainLayout.razor
            if (CoreWebView2.Source.Equals("https://blazorapp.local/"))
            {
                //将启动（登录）页面设为非全屏
                WindowState = FormWindowState.Normal;
            }
            else
            {
                //将其他页面设为全屏，
                WindowState = FormWindowState.Maximized;
            }
        }
    }

4、左右布局 MainLayout.razor 的代码如下：

<div class="toolbox" title="退出登录" @onclick="logout"></div>

@code{
    private void logout()
    {
        navigationManager.NavigateTo("/");
        navigationManager.Refresh();//全屏非全屏之间切换时，要刷新一下
    }
}

 5、可以把@using和@inject都放到项目根目录的_Imports.razor文件里

@using FluentUIBlazorExampleApp
@using FluentUIBlazorExampleApp.Components
@using FluentUIBlazorExampleApp.Components.Layout
@using System.Data




@inject NavigationManager navigationManager
@inject IToastService ToastService
@inject IDialogService DialogService

6、弹窗 Toast 及 MessageBox 在布局文件的最后增加相应的组件即可

详见fluentUI官网：https://www.fluentui-blazor.net/

<FluentToastProvider />
<FluentDialogProvider />