Questions on UI for WPF Forum

1 answer

26 views

<telerik:RadBusyIndicator x:Name="radBusyIndicator"
Foreground="#ffffff"
IsBusy="{Binding IsBusy}">

I use the above when to show the busy indicator while saving.

After it has saved (IsBusy is false) I call Element.Focus(); but it does not focus on the element.
No element shows as being focused.

If I remove the line that sets IsBusy to true the focus works as expected.

Is there a workaround for this problem?

BusyIndicator

answered on 14 Apr 2025

1 answer

75 views

RadBusyIndicator is moving Keyboard focus to the main window

I have a RadBusyIndicator and inside it I have several other controls; the structure is bit complex and there are several DB operations are performed in that and while performing that DB operations we are setting IsBusy property of RadBusyIndicator as per progress to true and false. But after invoking this property keyboard focus is shifted to the main window which is not the correct behavior.

I want my focus on the current control from where I am calling some commands, and it is doing some DB operations.

I have gone through the below solution, but it is not much helpful in my case because the structure of my code is bit complex and I don't want BusyIndication invoked every five seconds as mentioned in this link - "how to restore the focus"

Any help regarding this is much appreciated.

BusyIndicator

Buttons

GridView

answered on 15 Dec 2023

0 answers

86 views

RadBusyIndicator + StoryBoard Animation + Collection was modified; enumeration operation may not execute.

Target Application : WPF

.Net Framework : 4.6.2

Telerik Version : 2017.2.503.45 (Telerik.Windows.Controls)

Hi

We are using RadBusyIndicator control for the client application, which raising the bellow exception randmoly on Production for long time.

Unfortunately it is not reproducible in development environment.

But as per the AppInsight log, assuming that happens on StoaryBoard animation as highlighted in the below style code.

Collection was modified; enumeration operation may not execute.

Type: System.InvalidOperationException
Message: Collection was modifined; enumeration operation may not execute.
Source:mscrolib
Help link:
Data: System.Collection.ListDictionaryInternal
TargetSite: System.ThrowHelper.ThrowInvalidOperationException(ExceptionResource resource)
Stack Trace: at System.ThrowHelper.ThrowInvalidOperationException(ExceptionResource resource)
   at System.Collections.Generic.List`1.Enumerator.MoveNextRare()
   at Telerik.Windows.Controls.Animation.AnimationManager.InvkokeCallbacks(Storyboard storyboard)
   at Telerik.Windows.Controls.Animation.AnimationManager.OnStoryboardCompleted(Object sender, EventArgs e)
   at System.Windows.Media.Animation.Clock.FireEvent(EventPrivateKey key)
   at System.Windows.Media.Animation.Clock.RaiseAccumulatedEvents()
   at System.Windows.Media.Animation.TimeManager.RaiseEnqueuedEvents()
   at System.Windows.Media.Animation.TimeManager.Tick()
   at System.Windows.Media.MediaContext.RenderMessageHandlerCore(Object resizedCompositionTarget)
   at System.Windows.Media.MediaContext.AnimatedRenderMessageHandler(Object resizedCompositionTarget)
   at System.Windows.Threading.ExceptionWrapper.InternalRealCall(Delegate callback, Object args, Int32 numArgs)
   at System.Windows.Threading.ExceptionWrapper.TryCatchWhen(Object source, Delegate callback, Object args, Int32 numArgs, Delegate catchHandler)

And following is the style used for the busy indicator. There is no clue to find the root cause except this exception log.

<Style x:Key="RadBusyIndicatorStyle"
           TargetType="{x:Type telerik:RadBusyIndicator}">
        <Setter Property="BusyContent"
                Value="Loading..." />
        <Setter Property="IsTabStop"
                Value="False" />
        <Setter Property="DisplayAfter"
                Value="0:0:0.1" />
        <Setter Property="BorderBrush"
                Value="#FFD0D0D0" />
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.5,1"
                                     StartPoint="0.5,0">
                    <GradientStop Color="White"
                                  Offset="0" />
                    <GradientStop Color="#A9DCDADA"
                                  Offset="1" />
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="BorderThickness"
                Value="1" />
        <Setter Property="ProgressBarStyle">
            <Setter.Value>
                <Style TargetType="{x:Type telerik:RadProgressBar}">
                    <Setter Property="Margin"
                            Value="15,15,15,5" />
                    <Setter Property="IsIndeterminate"
                            Value="True" />
                    <Setter Property="Maximum"
                            Value="100" />
                    <Setter Property="Orientation"
                            Value="Horizontal" />
                    <Setter Property="IsTabStop"
                            Value="False" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type telerik:RadProgressBar}">
                                <Grid>
                                    <Path x:Name="IndeterminateBackgroundDonut"
                                          Height="44"
                                          RenderTransformOrigin="0.5,0.5"
                                          Stroke="#FF133E80"
                                          Width="44">
                                        <Path.Data>
                                            <GeometryGroup FillRule="EvenOdd">
                                                <EllipseGeometry Center="22,22"
                                                                 RadiusY="20"
                                                                 RadiusX="20" />
                                                <EllipseGeometry Center="22,22"
                                                                 RadiusY="14"
                                                                 RadiusX="14" />
                                            </GeometryGroup>
                                        </Path.Data>
                                        <Path.Fill>
                                            <RadialGradientBrush>
                                                <GradientStop Color="#FF224272"
                                                              Offset="0" />
                                                <GradientStop Color="#FF224272"
                                                              Offset="0.921" />
                                                <GradientStop Color="#FFC8DCFB"
                                                              Offset="0.254" />
                                                <GradientStop Color="#FF335A95"
                                                              Offset="0.877" />
                                            </RadialGradientBrush>
                                        </Path.Fill>
                                    </Path>
                                    <Path x:Name="IndeterminateDonut"
                                          Height="44"
                                          RenderTransformOrigin="0.5,0.5"
                                          Visibility="Collapsed"
                                          Width="44">
                                        <Path.Data>
                                            <GeometryGroup FillRule="EvenOdd">
                                                <EllipseGeometry Center="22,22"
                                                                 RadiusY="20"
                                                                 RadiusX="20" />
                                                <EllipseGeometry Center="22,22"
                                                                 RadiusY="14"
                                                                 RadiusX="14" />
                                            </GeometryGroup>
                                        </Path.Data>
                                        <Path.Fill>
                                            <RadialGradientBrush Center="0.5,-0.23"
                                                                 GradientOrigin="0.8,0.25"
                                                                 RadiusY="0.68"
                                                                 RadiusX="0.68">
                                                <GradientStop Color="#BFFFFFFF"
                                                              Offset="0" />
                                                <GradientStop Color="Transparent"
                                                              Offset="1" />
                                                <GradientStop Color="#21FFFFFF"
                                                              Offset="0.65" />
                                            </RadialGradientBrush>
                                        </Path.Fill>
                                        <Path.RenderTransform>
                                            <RotateTransform />
                                        </Path.RenderTransform>
                                    </Path>
                                    <Grid x:Name="ProgressBarTrack"
                                          Height="24"
                                          RenderTransformOrigin="0.5,0.5"
                                          Width="24">
                                        <Grid.Clip>
                                            <EllipseGeometry Center="12,12"
                                                             RadiusY="12"
                                                             RadiusX="12" />
                                        </Grid.Clip>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="*" />
                                        </Grid.ColumnDefinitions>
                                        <Grid.RenderTransform>
                                            <RotateTransform Angle="-90" />
                                        </Grid.RenderTransform>
                                        <Rectangle x:Name="SkipValueSpacer" />
                                        <Rectangle x:Name="ProgressBarIndicator"
                                                   Grid.Column="1">
                                            <Rectangle.Fill>
                                                <RadialGradientBrush>
                                                    <GradientStop Color="#FFCCCCCC"
                                                                  Offset="1" />
                                                    <GradientStop Color="White" />
                                                </RadialGradientBrush>
                                            </Rectangle.Fill>
                                        </Rectangle>
                                    </Grid>
                                </Grid>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsIndeterminate"
                                             Value="True">
                                        <Trigger.EnterActions>
                                            <BeginStoryboard x:Name="MouseOverStoryboard_BeginStoryboard">
                                                <Storyboard RepeatBehavior="Forever">
                                                    <DoubleAnimationUsingKeyFrames BeginTime="0"
                                                                                   Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)"
                                                                                   Storyboard.TargetName="IndeterminateDonut">
                                                        <SplineDoubleKeyFrame KeyTime="0:0:1"
                                                                              Value="360" />
                                                    </DoubleAnimationUsingKeyFrames>
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </Trigger.EnterActions>
                                        <Trigger.ExitActions>
                                            <StopStoryboard BeginStoryboardName="MouseOverStoryboard_BeginStoryboard" />
                                        </Trigger.ExitActions>
                                        <Setter Property="Visibility"
                                                TargetName="IndeterminateDonut"
                                                Value="Visible" />
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Telerik_Windows_Controls_Animation:AnimationManager.AnimationSelector">
            <Setter.Value>
                <Telerik_Windows_Controls_Animation:AnimationSelector>
                    <Telerik_Windows_Controls_Animation:FadeAnimation AnimationName="Hide"
                                                                      Direction="Out"
                                                                      Easing="{x:Null}"
                                                                      MaxOpacity="1"
                                                                      MinOpacity="0"
                                                                      SpeedRatio="0"
                                                                      TargetElementName="Indicator" />
                    <Telerik_Windows_Controls_Animation:FadeAnimation AnimationName="Show"
                                                                      Direction="In"
                                                                      Easing="{x:Null}"
                                                                      MaxOpacity="1"
                                                                      MinOpacity="0"
                                                                      SpeedRatio="0"
                                                                      TargetElementName="Indicator" />
                </Telerik_Windows_Controls_Animation:AnimationSelector>
            </Setter.Value>
        </Setter>
        <Setter Property="OverlayStyle">
            <Setter.Value>
                <Style TargetType="{x:Type Rectangle}">
                    <Setter Property="Fill"
                            Value="#88FFFFFF" />
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type telerik:RadBusyIndicator}">
                    <Grid Background="{TemplateBinding Background}">
                        <ContentControl x:Name="Content"
                                        ContentTemplate="{TemplateBinding ContentTemplate}"
                                        Content="{TemplateBinding Content}"
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        IsEnabled="False"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" IsTabStop="{TemplateBinding IsTabStop}"/>
                        <Rectangle x:Name="Overlay"
                                   Style="{TemplateBinding OverlayStyle}" />
                        <Border x:Name="Indicator"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                CornerRadius="2"
                                HorizontalAlignment="Center"
                                MinWidth="180"
                                VerticalAlignment="Center"
                                Background="#FFBCBCBC"
                                BorderBrush="#FF254474"
                                SnapsToDevicePixels="True">
                            <StackPanel>
                                <telerik:RadProgressBar x:Name="ProgressBar"
                                                        IsIndeterminate="{TemplateBinding IsIndeterminate}"
                                                        Maximum="100"
                                                        Style="{TemplateBinding ProgressBarStyle}"
                                                        Value="{TemplateBinding ProgressValue}" />
                                <ContentPresenter ContentTemplate="{TemplateBinding BusyContentTemplate}"
                                                  Content="{TemplateBinding BusyContent}"
                                                  HorizontalAlignment="Center"
                                                  Margin="15,5,15,15"/>
                            </StackPanel>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsBusyIndicationVisible"
                                 Value="False">
                            <Setter Property="Visibility"
                                    TargetName="Indicator"
                                    Value="Collapsed" />
                            <Setter Property="Visibility"
                                    TargetName="Overlay"
                                    Value="Collapsed" />
                            <Setter Property="IsIndeterminate"
                                    TargetName="ProgressBar"
                                    Value="False" />
                            <Setter Property="IsEnabled"
                                    TargetName="Content"
                                    Value="True" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Any suggestion? And thanks in advance!

BusyIndicator

Styling

asked on 30 Nov 2023

1 answer

100 views

RadBusyIndicator & WindowsFormsHost

When I use the WindowsFormsHost in Radbusyindicator,

then I change the window size, and the UI shows very slowly and seems wrong.

The content of the WindowsFormsHost is just a Label.

I am not sure if there are some details in this case.

<telerik:RadBusyIndicator IsBusy="False">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<WindowsFormsHost>
<cc:UserControl1/>
</WindowsFormsHost>
</Grid>
</telerik:RadBusyIndicator>

BusyIndicator

Window

answered on 21 Jun 2023

1 answer

241 views

RadGridView IsBusy indicator not displaying until data is loaded

Hello,

I've got a RadGridView populated with an ObservableCollection of data that is loaded externally. The process of loading the data and displaying it takes some time and I would like to show something to the user to indicate busyness.

I know RadGridView has a built in IsBusy property, Unfortunately, the indicator doesn't appear until the data has already loaded - I've tested this by setting IsBusy to true when I define it - it only appears once the grid is loaded and the data is displayed. I've also tried using the BusyIndicator and wrapping the grid with this but encountered the same problem in that it would only display once the rest of the grid was displayed.

I wonder if I'm missing something and there is still a way of using the in-built feature for my needs?

Cheers,

Toby

BusyIndicator

GridView

answered on 03 Nov 2022

0 answers

260 views

Is it possible to check the busy indicator loading performance?

Hello.

First of all, my problem is that when the window is opened, the busy indicator appears after about 1-2 seconds.

The window is wrapped with a busy indicator.

I use async on Loaded Evenet to control the IsBsuy property.

<telerik:EventToCommandBehavior.EventBindings>
	<telerik:EventBinding EventName="Loaded" Command="{Binding OnEventLoadedCommand}"/>
</telerik:EventToCommandBehavior.EventBindings>

public ICommand OnEventLoadedCommand { get => new DelegateCommand(obj => Loaded(obj)); }
private async void Loaded()
{
    IsBusy = true;

        DataLoad . . . . (using async task)

    IsBusy = false;
}

In a simple sample project, it appears immediately.
However, in my actual project, it is a bit delayed.

This is my guess.
Before Loaded, my actual project contains a lot of controls.

The window contains navigation.

There are about 10 usercontrols.

<Window>
    <DataTemplate ....  dataconext = ViewModel> * 10
</Window>

<usercontrol> * 10
    <Many Controls Input Initial Setting>
</usercontrol>

ViewModel..cs => Read values of many properties before constructor

User controls all share the window viewmodel (not separate, only the WindowViewModel).

I think this is the cause of the first creation, but what about it?

Is there any way to solve this? If not, what's the problem?

Thanks.

BusyIndicator

General Discussions

updated question on 10 Aug 2021

2 answers

382 views

How can I restyle the RadBusyIndicator to remove all Telerik content

This XAML provides the following image.
<telerik:RadBusyIndicator IsBusy="True" BusyContent="This is all I want to see">

However I actually have my own content to see here. I don't want anything baked in. So I override the BusyContentTemplate:
<telerik:RadBusyIndicator.BusyContentTemplate>
<DataTemplate>
<Border Background="Red">
<TextBlock Text="This is all I want to see" />
</Border>
</DataTemplate>
</telerik:RadBusyIndicator.BusyContentTemplate>

Swing and a miss. All I want is my text. Technically a lot of content that I don't need to replicate here. Ok, now let's override the progress bar.
<telerik:RadBusyIndicator.ProgressBarStyle>
<Style TargetType="telerik:RadProgressBar">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</telerik:RadBusyIndicator.ProgressBarStyle>

Closer but Telerik still has some content around mine. One more try:
<telerik:RadBusyIndicator.OverlayStyle>
<Style TargetType="Rectangle">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</telerik:RadBusyIndicator.OverlayStyle>

No changes at all from this. How can I simply make my own busy indicator?

BusyIndicator

Styling

answered on 03 Aug 2021

1 answer

629 views

How to do asynchronous image binding?

Hello.

I tried binding using Rad Image Editor. However, only white images are visible.

1. My provided source compares the normal BitmapSource binding and the RadBitmap binding, and you can see that the normal BitmapSource is bound and the RadBitmap is not.

What's my problem?

2. I've heard that it's not good to put RadBusyIndicator in the Loaded Event when using it. (In general, when using BusyIndicator, not telerik)

So, after Show(modeless), I used async Task to process the initial setting data.

Is this method okay for modeless limitation?

I Using Telerik Version 2021.2.719.45 XAML [No theme specified (default)]

Thanks.

BusyIndicator

ImageEditor

answered on 28 Jul 2021

1 answer

246 views

RadBusyIndicator Changing theme style and not showing busy state

I'm using the implicit Fluent theme.

If you look at my ResourceTemplate.xaml, there is a Fluent theme and a Transparent theme.
Telerik.Windows.Controls only applies the transparent theme.

Is there a way to change only BusyIndicator to Transparent theme?
I want the main window to be a fluent theme.
(I know that Style.Manager shouldn't be for implicit styles.)

If you click the button, BusyIndicator opens a new window and works. But there is a problem.
BusyContent is incremented by 1 only internally.
However BusyIndicator is not displayed, only blank.
What's wrong?

Please check my source for details.

Thank you.

BusyIndicator

Styling

answered on 21 Jun 2021

0 answers

120 views

Collection was modified; enumeration operation may not execute

Hi,

Getting this exception sometimes and not able to reproduce it. Could you give scenario where this exception is possible? So that we can try to reproduce and fix. Attached screen has busy indicator in each tile . We couldn't get any clue from stack trace.

Thanks in advance.

BusyIndicator

asked on 11 May 2021