RadPanelBar hangs on tree-like panels

[Thomas]

I am trying to create several RadPanelBars in a tree like structure but as soon as there are more than three levels of RadPanelBars it hangs.
I have attached a sample project which just contains a set of RadPanelBars. As soon as I click on RadPanelBarItem Test3.1 or Test3.2 the whole application stops responding.

Is there any way to achieve the same behaviour (a menu bar with several layers) with any other Rad control?

<UserControl x:Class="SilverlightApplication2.MainPage"
    xmlns:nav="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
    <Grid x:Name="LayoutRoot">
        <nav:RadPanelBar>
            <nav:RadPanelBarItem IsExpanded="True" >
                <nav:RadPanelBarItem.Header>
                    <TextBlock Text="Test1.1"></TextBlock>
                </nav:RadPanelBarItem.Header>
            </nav:RadPanelBarItem>
            <nav:RadPanelBarItem>
                <nav:RadPanelBar>
                    <nav:RadPanelBarItem IsExpanded="True" >
                        <nav:RadPanelBarItem.Header>
                            <TextBlock Text="Test2.1"></TextBlock>
                        </nav:RadPanelBarItem.Header>
                    </nav:RadPanelBarItem>
                    <nav:RadPanelBarItem>
                        <nav:RadPanelBarItem.Header>
                            <TextBlock Text="Test2.2"></TextBlock>
                        </nav:RadPanelBarItem.Header>
                    </nav:RadPanelBarItem>
                    <nav:RadPanelBarItem>
                        <nav:RadPanelBarItem.Header>
                            <TextBlock Text="Test2.3"></TextBlock>
                        </nav:RadPanelBarItem.Header>
                    </nav:RadPanelBarItem>
                    <nav:RadPanelBarItem>
                        <nav:RadPanelBar>
                            <nav:RadPanelBarItem IsExpanded="True" >
                                <nav:RadPanelBarItem.Header>
                                    <TextBlock Text="Test3.1"></TextBlock>
                                </nav:RadPanelBarItem.Header>
                            </nav:RadPanelBarItem>
                            <nav:RadPanelBarItem>
                                <nav:RadPanelBarItem.Header>
                                    <TextBlock Text="Test3.2"></TextBlock>
                                </nav:RadPanelBarItem.Header>
                            </nav:RadPanelBarItem>
                        </nav:RadPanelBar>
                    </nav:RadPanelBarItem>
                </nav:RadPanelBar>
            </nav:RadPanelBarItem>
            <nav:RadPanelBarItem>
                <nav:RadPanelBarItem.Header>
                    <TextBlock Text="Test1.2"></TextBlock>
                </nav:RadPanelBarItem.Header>
            </nav:RadPanelBarItem>
            <nav:RadPanelBarItem>
                <nav:RadPanelBarItem.Header>
                    <TextBlock Text="Test1.3"></TextBlock>
                </nav:RadPanelBarItem.Header>
            </nav:RadPanelBarItem>
        </nav:RadPanelBar>
    </Grid>
</UserControl>

[Tihomir Petkov]

Hi Thomas,

Is there any specific reason why you nest entire RadPanelBar controls instead of building your hierarchy with RadPanelBarItems within a single RadPanelBar? Would a structure similar to the one below work for you?

<

 

telerikNavigation:RadPanelBar>
    <telerikNavigation:RadPanelBarItem Header="Item 1">
        <telerikNavigation:RadPanelBarItem Header="Item 1.1">
            <telerikNavigation:RadPanelBarItem Header="Item 1.1.1">
                <telerikNavigation:RadPanelBarItem Header="Item 1.1.1.1" />
                <telerikNavigation:RadPanelBarItem Header="Item 1.1.1.2" />
                <telerikNavigation:RadPanelBarItem Header="Item 1.1.1.3" />
                </telerikNavigation:RadPanelBarItem>
            </telerikNavigation:RadPanelBarItem>
        </telerikNavigation:RadPanelBarItem>
    <telerikNavigation:RadPanelBarItem Header="Item 2" />
    <telerikNavigation:RadPanelBarItem Header="Item 3" />
</telerikNavigation:RadPanelBar>

Sincerely yours,

Tihomir Petkov
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.

[Markus Kutschera]

Hello Tihomir,

I would like to have the same layout for all Header items. In your example all items below the top level items have the same layout (items 1, 2 and 3 have a header layout while 1.1, 1.1.1,... all have the "content item" layout). In my case item 1, 1.1, 1.1.1 should all act as header items with a common layout.
Is it possible to achieve this without nesting whole panel bars within each other?

Thanks and best regards,
Markus Kutschera

[Dimitrina]

Hi Markus Kutschera,

At the moment it is not possible to edit the template of the second level panel bar item. This is a known issue that will be fixed in the upcoming Q3 version of the control.
Please, accept our apologies for the inconvenience.

Kind regards,
Dimitrina
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.

[SIlvia]

Now it's Possible to change header, but i'm not able to center text on the second level, how can id do?

Thanks,
Silvia

[Dimitrina]

Hello SIlvia,

In order to center text on the second level you have to set a property HorizontalContentAlignment="Center".

<telerikNavigation:RadPanelBar>
  <telerikNavigation:RadPanelBarItem Header="Item 1">
     <telerikNavigation:RadPanelBarItem Header="Item 1.1" HorizontalContentAlignment="Center" />
     <telerikNavigation:RadPanelBarItem Header="Item 1.2" HorizontalContentAlignment="Center" />
     <telerikNavigation:RadPanelBarItem Header="Item 1.3" HorizontalContentAlignment="Center" />
  </telerikNavigation:RadPanelBarItem>
</telerikNavigation:RadPanelBar>

If you have further questions please do not hesitate to ask us.
I hope this will help you.

All the best,
Dimitrina
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.