
FullScreen
Human-computer interaction by injecting service calls Show
method pop-ups
Basic usage
The entire page is fully screened by calling the Show
method that FullScreenService
service instance
Demo
Button
The full screen of the entire web page is component FullScreenButton
Demo
@page "/fullscreens"
@inject IStringLocalizer<FullScreens> Localizer
<h3>FullScreen</h3>
<h4>Human-computer interaction by injecting service calls <code>Show</code> method pop-ups</h4>
<DemoBlock Title="Basic usage" Introduction="The entire page is fully screened by calling the <code>Show</code> method that <code>FullScreenService</code> service instance" Name="Normal">
<Button Text="FullScreen" OnClick="ToggleFullScreen"></Button>
</DemoBlock>
<DemoBlock Title="Button" Introduction="The full screen of the entire web page is component <code>FullScreenButton</code>" Name="Title">
<ul class="ul-demo mb-3">
<li>The button default icon can be set through the <code>ButtonIcon</code>, and the full-screen icon can be set through the <code>FullScreenIcon</code> property</li>
<li>Use the <code>Title</code> property to set the prompt bar text when the mouse hovers</li>
</ul>
<FullScreenButton Title="Tap for a full screen operation" FullScreenIcon="fa fa-fa" />
<Pre class="mt-3"><FullScreenButton Title='Click for full screen operation'" /></Pre>
</DemoBlock>
// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/
using BootstrapBlazor.Components;
using Microsoft.AspNetCore.Components;
namespace BootstrapBlazor.Shared.Samples;
/// <summary>
/// FullScreens 全屏示例代码
/// </summary>
public partial class FullScreens
{
[Inject]
[NotNull]
private FullScreenService? FullScreenService { get; set; }
private async Task ToggleFullScreen()
{
await FullScreenService.Toggle();
}
}