如何使应用程序适合 blazor 应用程序的全屏

问题描述 投票:0回答:1

当我尝试使用全屏模式时,它没有打开,并且内容下方有下半部分。如何在 blazor 混合应用程序中将其设置为全屏?我该如何解决?我尝试了很多方法,但没有奏效。我正在使用 .net 7.

<MudLayout Style="height:contain">

<MudGrid Style="width:100%;height:100%">
<MudItem xs="12" Class="d-flex align-center justify-center" >
    <MudGrid>
        <MudItem xs="2"></MudItem>
        <MudItem xs="8">
            <MudGrid>
                <MudItem xs="12" Class="d-flex align-center justify-center pl-16 pr-16 mr-16 ml-16">
                    <MudGrid>
                        <MudItem xs="3"></MudItem>
                        <MudItem xs="6">
                            <MudTextField @bind-Value="loginModel.UserName" Required="true" Label="User Name" Variant="Variant.Outlined" Margin="Margin.Dense"></MudTextField>
                        </MudItem>
                        <MudItem xs="3"></MudItem>
                    </MudGrid>

                </MudItem>
                <MudItem xs="12" Class="d-flex align-center justify-center pl-16 pr-16 mr-16 ml-16 ">
                    <MudGrid>
                        <MudItem xs="3"></MudItem>
                        <MudItem xs="6">
                            <MudTextField @bind-Value="loginModel.Password" Label="Password" Required="true" Variant="Variant.Outlined"
                                          InputType="@PasswordInput" Adornment="Adornment.End" AdornmentIcon="@PasswordInputIcon"
                                          OnAdornmentClick="ButtonTestclick" AdornmentAriaLabel="Show Password" Margin="Margin.Dense" />
                        </MudItem>
                        <MudItem xs="3"></MudItem>
                    </MudGrid>

                </MudItem>
                <MudItem xs="12" Class="d-flex align-center justify-center pl-16 pr-16 mr-16 ml-16  ">
                    <MudGrid>
                        <MudItem xs="3"></MudItem>
                        <MudItem xs="6">
                            <MudTextField @bind-Value="Environmentname" Label="Environment Name" Variant="Variant.Outlined" Margin="Margin.Dense"></MudTextField>
                        </MudItem>
                        <MudItem xs="3"></MudItem>
                    </MudGrid>

                </MudItem>
                <MudItem xs="12" Class="d-flex align-center justify-center pl-4 pr-4 mr-16 ml-16 ">
                    <MudButton Variant="Variant.Filled" OnClick="LgnBtnClick" Style="background-color:#02198B;color:white;width:120px;height:45px;font-size:larger;border-radius:10px">
                        Login
                    </MudButton>
                </MudItem>
                
            </MudGrid>
        </MudItem>
        <MudItem xs="2"></MudItem>
    </MudGrid>
</MudItem>
 </MudGrid>
 </MudLayout>

c# .net blazor hybrid-mobile-app
1个回答
0
投票

您正在 web 视图中显示一个屏幕的 xml,但您希望您的应用程序全屏打开。但是 webview 被包裹在一个 UWP 应用程序中,你需要让 UPW 应用程序全屏显示。转到 maui 应用程序构建器并添加这样的事件:

var builder = MauiProgram.CreateMauiApp();


builder.ConfigureLifecycleEvents(events =>
{
    events.AddWindows(wndLifeCycleBuilder =>
    {
        wndLifeCycleBuilder.OnWindowCreated(window =>
        {
            var hWnd = WinRT.Interop.WindowNative.GetWindowHandle(window);
            var myWndId = Win32Interop.GetWindowIdFromWindow(hWnd);
            var _appWindow = AppWindow.GetFromWindowId(myWndId);
            _appWindow.SetPresenter(AppWindowPresenterKind.FullScreen);
        });
    });
});

此代码仅向 Windows 的 maui 应用程序添加一个事件。在启动时获取应用程序正在运行的窗口并使该窗口全屏显示。

© www.soinside.com 2019 - 2024. All rights reserved.