ProgressBarIndicator template in BusyIndicator

[Marcelo]

Hi,

I made a custom template for the busyindicator with Blend and created a trigger to collapse the circle in the middle (ProgressBarIndicator) of the progressbar when the property IsIndeterminate=true and make the middle circle visible when IsIndeterminate=false.

This doesn't work the first time the busyindicator is shown (the middle circle is still visible) but it works fine for the second time and so on (the middle circle remains collapsed).

I'll show only the essential because the template is too big and i think the problem is in this code:

<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">
                                <iv:Interaction.Triggers>
                                    <ia:DataTrigger Binding="{Binding ElementName=ProgressBar, Path=IsIndeterminate}" Value="True">
                                        <ia:ChangePropertyAction TargetName="ProgressBarIndicator" TargetObject="{Binding                ElementName=ProgressBarIndicator}"  PropertyName="Visibility" Value="Collapsed"/>
                                    </ia:DataTrigger>
                                    <ia:DataTrigger Binding="{Binding ElementName=ProgressBar, Path=IsIndeterminate}" Value="False">
                                        <ia:ChangePropertyAction TargetName="ProgressBarIndicator" TargetObject="{Binding ElementName=ProgressBarIndicator}"  PropertyName="Visibility" Value="Visible"/>
                                    </ia:DataTrigger>
                                </iv:Interaction.Triggers>
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="Black" Offset="0"/>
                                        <GradientStop Color="#FF0832F0" Offset="1"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                        </Grid>

I declare my busyindicator like this in my View:

<telerik:RadBusyIndicator Name="ActiveVisitsBusyIndicator" IsBusy="{Binding IsViewBusy}" BusyContent="{Binding Path=StringLibrary.LoadingVisits, Source={StaticResource LocalizedStrings}}" IsIndeterminate="True">

The IsIndeterminate is set to true so the circle can't appear... and it doesn't except for the first it is shown.

Is this a bug or there is something I forgot to do?

Thank you in advance

[Marcelo]

I managed to work this out,

basically i used a converter and now works perfect

<Rectangle x:Name="ProgressBarIndicator" Visibility="{Binding ElementName=ProgressBar,Path=IsIndeterminate,Converter={StaticResource BooleanToVisibilityConverter}, ConverterParameter=Collapsed}" Grid.Column="1">

I have another question.

How do I make the outer donut always spin even if IsIndeterminate is True or False?