CodeBeam.MudBlazor.Extensions/docs/CodeBeam.MudBlazor.Extensions.Docs/Pages/Components/LoadingButton/Examples/LoadingButtonExample1.razor at 1ef1e2b95e60968fc8936582f4fcadc8e2be3619 · CodeBeamOrg/CodeBeam.MudBlazor.Extensions · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
@namespace MudExtensions.Docs.Examples

<MudGrid>
    <MudItem xs="12" sm="8" Class="d-flex align-center flex-wrap">
        <MudStack Spacing="8">
            <MudStack Row="true" Spacing="4">
                <MudLoadingButton @bind-Loading="_loading" Size="Size.Small" LoadingAdornment="_adornment" OnClick="ButtonClick" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" OnClick="ButtonClick" StartIcon="@Icons.Custom.Brands.MudBlazor" EndIcon="@Icons.Custom.Brands.MudBlazor" LoadingAdornment="_adornment" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" Size="Size.Large" LoadingAdornment="_adornment" OnClick="ButtonClick" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
            </MudStack>

            <MudStack Row="true" Spacing="4">
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.IconButton" Size="Size.Small" OnClick="ButtonClick" Icon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.IconButton" Size="Size.Medium" OnClick="ButtonClick" Icon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.IconButton" Size="Size.Large" OnClick="ButtonClick" Icon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
            </MudStack>

            <MudStack Row="true" Spacing="4" AlignItems="AlignItems.Center">
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.Fab" Size="Size.Small" OnClick="ButtonClick" StartIcon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.Fab" Size="Size.Medium" OnClick="ButtonClick" StartIcon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
                <MudLoadingButton @bind-Loading="_loading" ButtonVariant="ButtonVariant.Fab" Size="Size.Large" OnClick="ButtonClick" StartIcon="@Icons.Custom.Brands.MudBlazor" Variant="Variant.Filled" Color="Color.Primary">CLICK ME</MudLoadingButton>
            </MudStack>
        </MudStack>
    </MudItem>

    <MudItem xs="12" sm="4">
        <MudStack>
            <MudSwitchM3 @bind-Value="_loading" Color="Color.Secondary">Loading</MudSwitchM3>
            <MudSelect @bind-Value="_adornment" Variant="Variant.Outlined" Label="Loading Adornment">
                <MudSelectItem Value="Adornment.Start">Start</MudSelectItem>
                <MudSelectItem Value="Adornment.End">End</MudSelectItem>
            </MudSelect>
        </MudStack>
    </MudItem>
</MudGrid>

@code {
    bool _loading = false;
    Adornment _adornment = Adornment.Start;

    private async Task ButtonClick()
    {
        _loading = true;
        await Task.Delay(2000);
        _loading = false;
    }
}