RadPanelBar item indentation and vertical size

[Patrick]

I'm using a RadPanelBar as a categorized menu, where the headers are the categories and the children of the headers are the menu items.  If you look at the screenshot of the RadPanelBar in your documentation at http://docs.telerik.com/devtools/wpf/controls/radpanelbar/structure, that's pretty much what I want it to look like. 

However, using the latest version (R3 2016), a basic RadPanelBar looks very different from the screenshot in your documentation.  I've attached a screen shot and here is my xaml:

                <telerik:RadPanelBar Grid.Row="1" ExpandMode="Multiple" >
                    <telerik:RadPanelBarItem Header="Security" IsExpanded="True">
                        <TextBlock Text="Rights By User" />
                        <TextBlock Text="Rights By Right" />
                    </telerik:RadPanelBarItem>
                </telerik:RadPanelBar>

The differences I don't like are (1) the items are indented by what looks like about 60px, and (2) the items stretch to fill the available vertical space.  I want the items to not be indented and to be their natural height, as they are in your screen shot. 

I'm using the VisualStudio2013 theme, which might account for the difference.  If that's it, could you give me some guidance on where that margin/padding that causes the indent is coming from?  I've skimmed the templates in the theme and didn't see it.

 

[Dinko | Tech Support Engineer]

Hello Patrick,

In order to define the RadPanelbar to only take so much space as it needs, you will need to set the VerticalAlignment property to be different than Stretch (Top for example), since by default this property is Stretch thus causing the RadPanelBar and its children to fill the available space. Take a look at the following code snippet.

<telerik:RadPanelBar Grid.Row="1" ExpandMode="Multiple" VerticalAlignment="Top">
    <telerik:RadPanelBarItem Header="Security" IsExpanded="True">
        <TextBlock Text="Rights By User" />
        <TextBlock Text="Rights By Right" />
    </telerik:RadPanelBarItem>
</telerik:RadPanelBar>

Regards,
Dinko
Telerik by Progress

[Patrick]

Hi,

I haven't tried it yet, but I doubt that will produce the results I'm looking for.  I want the RadPanelBar to fill the height of its container.  The problem I'm having is with the items inside the RadPanelBar filling the height of the RadPanelBar.  The behavior I'm looking for is really more like a grouped list box with expandable/collapsible groups.

Thx,

Pat

[Dinko | Tech Support Engineer]

Hello Patrick,

Thank you for clarifying your question.

You can create an Implicit custom style which target type is set to :RadPanelBarItem.  Then you can set the VerticalAlignment property of the RadPanelBarItem to Top. I have created sample project demonstrating this approach. Give it a try and let me know if it works for you.

Regards,
Dinko
Telerik by Progress