If I place a LoaderContainer inside the Dialog's content it is not rendered properly.
<AdminEdit>
Here are two possible workarounds:
</AdminEdit>
In the AJAX suite, the LoadingPanel has a really useful property called InitialDelay, whereby if the operation executes in less time than the delay, the loading animation will not show, to avoid annoying flickering.
Please add such functionality for the Blazor Loader and LoaderContainer.
---
ADMIN EDIT
---
For the time being, you can add some delay before enabling the Visible parameter of the Loader and LoaderContainer.
@implements IDisposable
@using System.Timers
<TelerikButton OnClick="@DoFastWork">Do fast work (no loader)</TelerikButton>
<TelerikButton OnClick="@DoSlowWork">Do SLOW work (shows loader)</TelerikButton>
@result
<TelerikLoader Visible="@LoaderVisible"></TelerikLoader>
@* NOTE: This is a basic example - if you bash the button you will never see the loader.
In a real case you may want to take care of that - hide the butotn with a loader container instead, or disable it, or debounce the clicks *@
@code{
bool LoaderVisible { get; set; }
Timer theTimer { get; set; }
int minDelay { get; set; } = 1000;
string result { get; set; }
async Task DoFastWork()
{
InitTimer();
await Task.Delay(300); //simulate fast task
result = DateTime.Now.ToString();
DisposeTimer();
LoaderVisible = false;
}
async Task DoSlowWork()
{
InitTimer();
await Task.Delay(3000); //simulate SLOW task
result = DateTime.Now.ToString();
DisposeTimer();
LoaderVisible = false;
}
// the idea is that we never hit this event if things happen fast enough
void OnTimedEvent(object source, ElapsedEventArgs e)
{
LoaderVisible = true;
InvokeAsync(StateHasChanged);
}
void InitTimer()
{
DisposeTimer();
theTimer = new System.Timers.Timer();
theTimer.Elapsed += new ElapsedEventHandler(OnTimedEvent);
theTimer.Interval = minDelay;
theTimer.Enabled = true;
}
void DisposeTimer()
{
try
{
if (theTimer != null)
{
theTimer.Dispose();
}
}
catch { }
}
public void Dispose()
{
DisposeTimer();
}
}