RadControls Silverlight Courseware - ScovilleTabs Style isn't being applied?

2 posts, 0 answers
  1. David
    David avatar
    1 posts
    Member since:
    Aug 2010

    Posted 14 Aug 2010 Link to this post

    Hi,

    I'm working through the RadControls Silverlight Courseware.  04_Templates project in Tabbed solution isn't working as described.
    The ScovilleTabs style isn't being applied. 

    Please explain.

    Best Wishes,
    Dave.

    <UserControl xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
                 xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
                 x:Class="_04_Templates.MainPage"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 mc:Ignorable="d"
                 d:DesignWidth="640"
                 d:DesignHeight="480">
        <UserControl.Resources>
            <Style x:Key="ScovilleTabs"
                   TargetType="telerikNavigation:RadTabItem">
                <Setter Property="TopTemplate">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerikNavigation:RadTabItem">
                            <Grid>
                                <Ellipse>
                                    <Ellipse.Fill>
                                        <RadialGradientBrush>
                                            <GradientStop Color="Red"
                                                          Offset="0.1"></GradientStop>
                                            <GradientStop Color="DarkRed"
                                                          Offset="0.5"></GradientStop>
                                            <GradientStop Color="Maroon"
                                                          Offset=".7"></GradientStop>
                                        </RadialGradientBrush>
                                    </Ellipse.Fill>
                                </Ellipse>
                                <ContentPresenter Margin="10"
                                                  Content="{TemplateBinding Content}"
                                                  HorizontalAlignment="Center"
                                                  VerticalAlignment="Center"></ContentPresenter>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot">
            <telerikNavigation:RadTabControl TabStripPlacement="Top"
                                             ItemContainerStyle="{StaticResource ScovilleTabs}">
                <telerikNavigation:RadTabItem Content="Very Spicy"
                                              Header="Very Spicy"></telerikNavigation:RadTabItem>
                <telerikNavigation:RadTabItem Content="Hot"
                                              Header="Hot"></telerikNavigation:RadTabItem>
                <telerikNavigation:RadTabItem Content="Mild"
                                              Header="Mild" DropDownContent="dfdf"></telerikNavigation:RadTabItem>
            </telerikNavigation:RadTabControl>
        </Grid>
    </UserControl>
  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 19 Aug 2010 Link to this post

    Hello David,

    Thank you for reporting the issue. It seems that the project doesn't illustrate correctly the example in the 11.5 Customization tutorial of the .pdf courseware. The issue is caused by the ScovilleTabs Style, which should look like this:

    <Style x:Key="ScovilleTabs"
        TargetType="telerikNavigation:RadTabItem">
        <Setter Property="TopTemplate">
            <Setter.Value>
                <ControlTemplate TargetType="telerikNavigation:RadTabItem">
                    <Grid x:Name="wrapper">
                        <Ellipse>
                            <Ellipse.Fill>
                                <RadialGradientBrush>
                                    <GradientStop Color="Red"
                                        Offset="0.1">
                                    </GradientStop>
                                    <GradientStop Color="DarkRed"
                                                            Offset="0.5">
                                    </GradientStop>
                                    <GradientStop Color="Maroon"
                                                            Offset=".7">
                                    </GradientStop>
                                </RadialGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                                                                <Telerik_Windows_Controls_Primitives:TabItemContentPresenter                            x:Name="HeaderElement"
                        Content="{TemplateBinding Header}"
                        Foreground="White"
                        Margin="10"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    I also attached a project illustrating this scenario using our latest binaries.

    Thank you again for the feedback. We will update the project accordingly as soon as possible. I also updated your Telerik points.

    Greetings,
    Tina Stancheva
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft banner
Back to Top