BusyIndicator.IsRunning does not react on PropertyChanged when binding mode is OneWay

[Bernhard König]

I had a problem with my BusyIndicator not showing up and even not querying my viewmodel property after the initial binding.

It seems currently (Q3 Mango bits) the BusyIndicator.IsRunning property only reacts on property changed events when the binding mode is set to TwoWay, but not when set to OneWay (I don't mean OneTime, it would be clear that in this case it won't listen to property changes).

I have no idea why but I have tested the same binding with a label on the same place in XAML and this reacted as expected on property changes. Maybe you want to have a look at it.

Thanks,
Bernhard

[Fredrik]

HI !!

Same thing for me.....on Mode=TwoWay it stops running but for me it´s still visible ?
If I not use Mode in binding its not running and its always visible.

Regards

Fredrik

[Deyan]

Hello Bernhard,

Thanks for writing and for reporting this issue.

I would like to inform you that this issue has already been addressed and we are going to release the fix within Q2 2011 SP1 which is due to in a couple of weeks. We are also going to release a SP version of the Q3 Mango build which will contain this fix as well.

Do not hesitate to write back anytime you have further questions or need assistance.

Kind regards,
Deyan
the Telerik team

[Fredrik]

Hello Deayn !!

Thanks for responding.When is the SP of Mango scheduled to ?
We are having a presentation of our product and it´s pretty anoying to see the indicator all the time, but it so good looking so we dont want to exlude it...

Regards

Fredrik

[Bernhard König]

Hi Deyan,

thanks for letting me know.

If I may make a suggestion for this control ... it would be great to have the WP7 original progress bar animation available as an AnimationType ... you know the moving points, what is available as PerformanceProgressBar in the Silverlight Toolkit for WP7. I tried to place the PerformanceProgressBar with the available Style property inside the control but I wasn't able to produce the results I wanted. So if this would be available as an animation out of the box ... it would be great. I ended up on using the PerformanceProgressBar alone for now, but I'd like to use the features of the BusyIndicator like delayed displaying the progress indicator which I would have to implement manually now when using just the progress bar.

@Fredrik ... when using TwoWay-Binding, the control works like expected for me. I don't think your problem is really connected to mine and I'm not sure the proposed fix will also fix your problem. Do you have a code sample on how you are using the control?

cheers,
b.

[Fredrik]

@Bernard
<telerikPrimitives:RadBusyIndicator x:Name="busyIndicator" InitialDelay="0:0:1" IsRunning="{Binding IsLoading, Mode=TwoWay}" Grid.Row="1"/>
using MVVM Light to set IsLoading.

Regards

Fredrik

[Deyan]

Hello Fredrik,

The issue you are experiencing should be fixed with the new Q2 2011 SP1 or Q3 2011 Mango bits we are releasing very soon.

Please stay tuned for more information.

Greetings,
Deyan
the Telerik team

[Fredrik]

Hello !!!

I have been testing the new SP1 Mango release and see that my BusyIndicator is now stopping correctly even without Mode = TwoWay.
But my problem with the visibility is still there......I dont know what I´m doing wrong. I thought that setting IsRunning also was making the BusyIndicator visible = false??
P.s My BusyIndicator is inside a DataTemplate that is added to a PivotItem in runtime D.s

Need help

Regards

Fredrik

[Deyan]

Hi Fredrik,

Thanks for writing.

When the IsRunning property changes to false the RadBusyIndicator control goes from the Running visual state to the NotRunning visual state. The NotRunning visual state fades the control by animating its Opacity from 1 to 0. It does not set the Visibility property since we want the effect of fade-in/fade-out.

If you wish to block the user input when the control is visible and unblock it when it is not visible, you can use the following style for RadBusyIndicator:

<Style TargetType="telerikPrimitives:RadBusyIndicator">
        <Setter Property="Foreground" Value="{StaticResource PhoneAccentBrush}"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="FontSize" Value="15"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="Padding" Value="0, 10, 0, 0"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerikPrimitives:RadBusyIndicator">
                    <Border
                        x:Name="PART_LayoutRoot"
                        Background="{TemplateBinding Background}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        BorderBrush="{TemplateBinding BorderBrush}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition From="NotRunning" To="Running">
                                        <Storyboard>
                                            <Storyboard>
                                                <DoubleAnimation From="0" To="1" Duration="0:0:0.5" Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="Opacity"/>
                                            </Storyboard>
                                        </Storyboard>
                                    </VisualTransition>
                                    <VisualTransition From="Running" To="NotRunning">
                                        <Storyboard>
                                            <Storyboard>
                                                <DoubleAnimation From="1" To="0" Duration="0:0:0.5" Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="Opacity"/>
                                            </Storyboard>
                                        </Storyboard>
                                    </VisualTransition>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="NotRunning">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="Opacity">
                                            <DiscreteDoubleKeyFrame KeyTime="0"  Value="0"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="IsHitTestVisible">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="False"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Running">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="Opacity">
                                            <DiscreteDoubleKeyFrame KeyTime="0"  Value="1"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_LayoutRoot" Storyboard.TargetProperty="IsHitTestVisible">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="True"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <telerikPrimitivesBusyIndicator:BusyIndicatorAnimation
                                Grid.Row="1"
                                Grid.Column="1"
                                x:Name="PART_Animation"
                                VerticalAlignment="Center"
                                Style="{TemplateBinding IndicatorAnimationStyle}"
                                IsRunning="{TemplateBinding IsRunning}"
                                Foreground="{TemplateBinding Foreground}"
                            />
                            <ContentPresenter
                                Content="{TemplateBinding Content}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Margin="{TemplateBinding Padding}"
                            x:Name="PART_InfoContent"/>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Here, in the corresponding visual states the IsHitTestVisible property is additionally set when the control changes its visual states. When RadBusyIndicator runs, the IsHitTestVisible value is true so that the control receives the input and prevents the underlaying control from getting it. When RadBusyIndicator is in the NotRunning state its IsHitTestVisible property is set to false so that the underlaying controls are accessible.

I hope this helps.

Kind regards,
Deyan
the Telerik team

[Fredrik]

Hi Deyan !!!

Thanks for answering.
My BusyIndicator is not changing opacity when setting IsRunning = false. It stops but it´s still visible.
I will try to use your style and see if it makes a different result.

Regards

Fredrik

[Deyan]

Hi Fredrik,

Please make sure that you are using our latest version available on our website.

If the issue persists, please prepare a sample project that reproduces it and attach it in a newly opened support ticket. In this way we will be able to directly take a look and see what goes wrong.

Thanks for your time.

All the best,
Deyan
the Telerik team

[Fredrik]

Hi Deyan !!!

My misstake.....I was having an old customstyle on the BusyIndicator from telerik q1 that was wrong now.
When removing that it was working as promised.

Sorry for the misstake.

Regards

Fredrik