Which file controls the top menu?

[allan lee]

Hi there,

Can anyone tell me in RadControl package which file or codes controls the top menu (the menu links on top to different telerik products) and how? Thanks in advance.

Allan

[Peter]

Hello allan,

To achieve such top navigation you can use the RadMenu control. Please, consider the Templates and Multi-column demos and decide which one best fits your needs. You can set links for the menu items with the NavigateUrl menu item's property.

Let us know if you need further assistance.


Best wishes,
Peter
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[allan lee]

thanks but i want to know how Telerik builds that top menu in the trial package. if it's a biz secret or you don't want to answer it then don't answer it.

allan

[Kaloyan]

Hello allan lee,

The menu actually is a StackPanel with HyperlinkButton controls placed in it. The HyperlinkButton control is using a custom Style. Check the code snippet bellow:

<LinearGradientBrush x:Key="ProductsButtonBackground_Over"
                                               EndPoint="0.5,1" StartPoint="0.5,0">
                                           <GradientStop Color="#FF3D414C" Offset="0" />
                                           <GradientStop Color="#FF1D1F23" Offset="1" />
                                           <GradientStop Color="#FF30333C" Offset="0.05" />
                                       </LinearGradientBrush>
<Style x:Key="ProductButton" TargetType="HyperlinkButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HyperlinkButton">
                <Grid Margin="6,0,6,24"
                        VerticalAlignment="Center">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup
                                x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="BackgroundAnimation"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="contentPresenter"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="BackgroundAnimation"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="contentPresenter"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="BackgroundAnimation"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="0.30" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames
                                            Storyboard.TargetName="contentPresenter"
                                            Storyboard.TargetProperty="Opacity">
                                        <SplineDoubleKeyFrame
                                                KeyTime="0"
                                                Value="0.30" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup
                                x:Name="FocusStates">
                            <VisualState x:Name="Focused" />
                            <VisualState x:Name="Unfocused" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Background" Height="44">
                        <Grid>
                            <Border
                                    x:Name="BackgroundAnimation"
                                    Opacity="0"
                                    Background="{StaticResource ProductsButtonBackground_Over}" />
                            <Rectangle
                                    x:Name="BackgroundGradient"
                                    Fill="#00FFFFFF" />
                        </Grid>
                    </Border>
                    <ContentPresenter
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            Margin="6,10"
                            x:Name="contentPresenter"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Content="{TemplateBinding Content}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            Opacity=".65" />
                    <Rectangle
                            x:Name="DisabledVisualElement"
                            IsHitTestVisible="false"
                            Opacity="0" Fill="{x:Null}" />
                    <Rectangle Margin="1"
                            x:Name="FocusVisualElement"
                            IsHitTestVisible="false"
                            Opacity="0" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Regards,
Kaloyan
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[allan lee]

great! would you tell me where is the file holding the codes in the package. i need to know what assemblies are required and the c# codes. thanks.

allan

[Kaloyan]

Hi allan lee,

You can find this code in Telerik.Windows.QuickStart assembly placed in Themes/Generic.xaml. You can reference this file with the code posted bellow:

/Telerik.Windows.QuickStart;component/themes/Generic.xaml

Kind regards,
Kaloyan
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.