Custom Style changes other non-telerik controls properties

4 posts, 0 answers
  1. Marcelo
    Marcelo avatar
    8 posts
    Member since:
    Apr 2012

    Posted 25 Mar 2013 Link to this post

    Hi,

    I created a RadBusyIndicator style with blend and put the syle in a default.xaml. I have to mention that I put the foreground text of the busycontent to white because i think this is messing with other non-telerik controls, like a normal textblock.

    The telerik controls like datepicker are doing fine, but textblocks, the headers from tabcontrol, the textbox of the normal datepicker, labels...all of that have the foreground changed to white.

    If i delete the  RadBusyIndicator style, they all get back his normal foreground color(black).

    Why is this messing with non-telerik controls? The busycontent of the toolkit busyindicator changed to white too...

    Sure I can set a style to all controls and change the foreground to black and it solves my problem but i think this is not how it supposed to be

    I'm starting to be very worried about telerik controls :(... I need help about this issue

    Thank you
  2. Masha
    Admin
    Masha avatar
    355 posts

    Posted 26 Mar 2013 Link to this post

    Hello Marcelo,

    We could not reproduce the described issue using the details you provided. Please, could you open a support ticket and send us a runnable sample where the issue is reproduced? This way we will investigate it and I will do my best to help.

    Regards,
    Maria
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Marcelo
    Marcelo avatar
    8 posts
    Member since:
    Apr 2012

    Posted 26 Mar 2013 Link to this post

    Hi, Maria

    I forgot to mention that this project is using the PRISM4 MVVM model and has a defaultCatalog.xaml that loads the different modules

    Each view loads a default.xaml theme which has the busyindicator style
    <UserControl.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <ResourceDictionary Source="/AnotherProjectModule.Client;component/Themes/Default.xaml"  x:Name="resDict"/>
                </ResourceDictionary.MergedDictionaries>
    <StringResources:LocalizedStrings  x:Key="StringResources"/>
    </ResourceDictionary>

    Meanwhile I'll try to make a standalone solution. the default.xaml has this style for the busyindicator:

    <Style TargetType="telerik:RadBusyIndicator">
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="DisplayAfter" Value="0:0:0.1"/>
        <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="BorderBrush" Value="#FF111211"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
     
        <Setter Property="telerik:AnimationManager.AnimationSelector">
            <Setter.Value>
                <telerik:AnimationSelector>
                    <telerik:FadeAnimation AnimationName="Hide" Direction="Out" Easing="{x:Null}" MaxOpacity="1" MinOpacity="0" SpeedRatio="0" TargetElementName="Indicator"/>
                    <telerik:FadeAnimation AnimationName="Show" Direction="In" Easing="{x:Null}" MaxOpacity="1" MinOpacity="0" SpeedRatio="0" TargetElementName="Indicator"/>
                </telerik:AnimationSelector>
            </Setter.Value>
        </Setter>
        <Setter Property="OverlayStyle">
            <Setter.Value>
                <Style TargetType="Rectangle">
                    <Setter Property="Fill" Value="#88FFFFFF"/>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:RadBusyIndicator">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="VisibilityStates">
                                <VisualState x:Name="Hidden">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Indicator">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Overlay">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Visible">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Indicator">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Overlay">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="BusyStatusStates">
                                <VisualState x:Name="Idle">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.IsEnabled)" Storyboard.TargetName="Content">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>True</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ProgressBar">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0" Storyboard.TargetProperty="IsIndeterminate" Storyboard.TargetName="ProgressBar">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>False</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Busy">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="(UIElement.IsEnabled)" Storyboard.TargetName="Content">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>False</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="False" IsEnabled="False" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Foreground="White"/>
                        <Rectangle x:Name="Overlay" Style="{TemplateBinding OverlayStyle}" />
                        <Border x:Name="Indicator" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="2" HorizontalAlignment="Center" MinWidth="180" VerticalAlignment="Center">
                            <StackPanel Background="#FF414141">
                                <telerik:RadProgressBar x:Name="ProgressBar"  Value="{TemplateBinding ProgressValue}" IsIndeterminate="{TemplateBinding IsIndeterminate}">
                                </telerik:RadProgressBar>
                                <ContentPresenter ContentTemplate="{TemplateBinding BusyContentTemplate}" Content="{TemplateBinding BusyContent}" HorizontalAlignment="Center" Margin="15,5,15,15"/>
                            </StackPanel>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style TargetType="telerik:RadProgressBar">
        <Setter Property="Margin" Value="15,15,15,5"/>
        <Setter Property="Maximum" Value="100"/>
        <Setter Property="Orientation" Value="Horizontal"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:RadProgressBar">
                    <Grid>
                        <Grid.Resources>
                            <Converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Determinate">
                                    <Storyboard RepeatBehavior="Forever">
                                        <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="IndeterminateDonut2">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="IndeterminateDonut">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames BeginTime="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="IndeterminateDonut2">
                                            <SplineDoubleKeyFrame KeyTime="0:0:1" Value="360"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Indeterminate">
                                    <Storyboard RepeatBehavior="Forever">
                                        <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="IndeterminateDonut2">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="IndeterminateDonut">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimationUsingKeyFrames BeginTime="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="IndeterminateDonut">
                                            <SplineDoubleKeyFrame KeyTime="0:0:1" Value="360"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Path x:Name="IndeterminateBackgroundDonut" Height="44" RenderTransformOrigin="0.5,0.5" Stroke="#FF373737" 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>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="#FF191405" Offset="0"/>
                                    <GradientStop Color="#FF151404" Offset="1"/>
                                    <GradientStop Color="#FF151405" Offset="0.254"/>
                                    <GradientStop Color="#FF1B1503" Offset="0.5"/>
                                </LinearGradientBrush>
                            </Path.Fill>
                        </Path>
                        <Path x:Name="IndeterminateDonut" Height="44" RenderTransformOrigin="0.5,0.5" Visibility="Visible" 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="#E50F39F7" Offset="0"/>
                                    <GradientStop Offset="0.172"/>
                                    <GradientStop Color="#FF0832F0" Offset="0.099"/>
                                </RadialGradientBrush>
                            </Path.Fill>
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                        <Path x:Name="IndeterminateDonut2" 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="#E50F39F7" Offset="0"/>
                                    <GradientStop Offset="0.172"/>
                                    <GradientStop Color="#FF0832F0" Offset="0.099"/>
                                </RadialGradientBrush>
                            </Path.Fill>
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform/>
                                </TransformGroup>
                            </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" Visibility="{Binding ElementName=ProgressBar,Path=IsIndeterminate,Converter={StaticResource BooleanToVisibilityConverter}, ConverterParameter=Collapsed}" Grid.Column="1">
                                <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>
                    </Grid>
     
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
  5. Marcelo
    Marcelo avatar
    8 posts
    Member since:
    Apr 2012

    Posted 26 Mar 2013 Link to this post

    I think I detected what was the problem...it was when I edited the template with blend...

    in blend I put the foreground text to white and maybe because i may have made some mistake in editing the templates, the foreground property was declared in another ContentControl.

    <ContentControl x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="False" IsEnabled="False" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Foreground="White"/>

    deleting this property made all non-telerik controls' Foreground color back to original...

    I still don't know how this can interfere with non-telerik controls, but the truth is I solved my problem in particular.
Back to Top