Set height of RadPanelBarItem

[Mike]

Hi,

I want to change the height of my RadPanelBarItem's from Height="Auto" to a larger, fix size e.g. Height="40".

Unfortunately it doesn't work, see attached screenshot. What did I wrong?  Here is my code:

<telerik:RadPanelBar Margin="7,7,0,25" HorizontalAlignment="Left" Width="129" Background="#FFEFEFEF" MaxHeight="400">
               <telerik:RadPanelBarItem Header="Network Connections" Height="40" Background="#FFEFEFEF" FontFamily="Segoe UI" FontSize="12">
                   <telerik:RadPanelBarItem Header="Delete Items" />
                   <telerik:RadPanelBarItem Header="Inbox" />
                   <telerik:RadPanelBarItem Header="Send Items" />
                   <telerik:RadPanelBarItem Header="OutBox" />
                   <Button Content="Button" Style="{StaticResource LinkButton}" Height="29" Width="82" HorizontalAlignment="Left" Name="button1" VerticalAlignment="Top" Click="button1_Click" />
                   <telerik:RadPanelBarItem Header="Search Folders" />
               </telerik:RadPanelBarItem>

[Andrew Jackson]

I'm trying to use the RadPanelBar, but when an item is expanded, I would like the height of the item to be the overall height of the content it contains. In other words, I do not want the other items in the panel to be pushed right down to the bottom.

Is this possible?

[Andrew Jackson]

Forget my post, I managed to resolve it by placing the RadPanelBar in a StackPanel.

[Petar Mladenov]

Hello Mike and Andrew,

 Unfortunately setting Height of the RadPanelBarItems leads to undesired behavior (the control moves up or down when expand collapse is performed)  and we can consider it as an unsupported feature. You can vote for this feature request in order to increase its development priority.

Greetings,
Petar Mladenov
the Telerik team

[Mike]

Hi Petar,
Thanks for your response. I'm not sure if Andrew Jackson has/had the same problem, but in regard to my issue: Does your answer means that at the moment it is not possible to change the size (vertical height) of RadPanelBarItems?
Mike

[Petar Mladenov]

Hello Mike,

 It is possible but it leads to undesired behavior like "resizing" and "incorrect possition" issues. So we suggest not setting different Height on different RadPanleBarItems.

Greetings,
Petar Mladenov
the Telerik team

[Saeed]

Hi to all
i want to design a page with radpanelbar but there is a problem here when i want to collapse all of the panels the height of the panels become smaller. what attributes do i need to change to solve this problem?

[Petar Mladenov]

Hi Saeed ,

 The Height of the Expanded RadPanelBarItems is calculated dynamically. Could you please send us your XAML and elaborate more on your desired scenario - this way we would be better able to point you in the right direction. Thank you in advance.

All the best,
Petar Mladenov
the Telerik team

[Saeed]

Hi Petar
thanks for your fast answering
here is my code

<telerik:RadPanelBar Background="White" Orientation="Horizontal"
                VerticalAlignment="Center" HorizontalAlignment="Center" ExpandMode="Single">
         <telerik:RadPanelBarItem IsExpanded="True" HorizontalAlignment="Center" VerticalAlignment="Center">
            <telerik:RadPanelBarItem.Header>
               <TextBlock Text="Login Page" Margin="5 3" />
            </telerik:RadPanelBarItem.Header>
            <Border Height="300" Width="400">
            <Grid HorizontalAlignment="Center" Name="grid1" VerticalAlignment="Center">
                     <TextBox Height="23" Name="textBox1" Width="120" Margin="196,55,45,159" />
                     <Label Content="Username" Height="26" Name="label1" Width="67" Margin="77,22,217,189" />
                     <TextBox Height="23" Name="textBox2" Width="120" Margin="196,23,45,191" />
                     <Label Content="Password" Height="26" Name="label2" Width="65" Margin="79,53,217,158" />
                     <Label Content="New User?" Hyperlink.Click="newUser" Margin="132,99,160,112" />
                     <Label Content="Forgot Password?" Hyperlink.Click="forgotPassword" Margin="133,132,119,77" />
                     <Button Content="Login" Height="23" HorizontalAlignment="Left" Margin="178,172,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
                     <Button Content="Cancel" Height="23" HorizontalAlignment="Left" Margin="87,172,0,0" Name="button2" VerticalAlignment="Top" Width="75" />
            </Grid>
            </Border>
         </telerik:RadPanelBarItem>
         <telerik:RadPanelBarItem IsExpanded="False">
            <telerik:RadPanelBarItem.Header>
               <TextBlock Text="Contacts" Margin="5 3" />
            </telerik:RadPanelBarItem.Header>
            <Grid Height="237" HorizontalAlignment="Center" Name="grid2" VerticalAlignment="Center" Width="361">
               <telerik:RadCarousel x:Name="contacts" AutoGenerateDataPresenters="False" Background="Transparent">
                  <telerik:RadCarousel.Resources>
                     <telerik:BinaryImageConverter x:Key="converter" />
                     <DataTemplate DataType="ClickMode">
                        <Image Resources="../8.jpg" />
                     </DataTemplate>
                  </telerik:RadCarousel.Resources>
               </telerik:RadCarousel>
            </Grid>
         </telerik:RadPanelBarItem>
      </telerik:RadPanelBar>

when i collapse the first panel item the height of all panels become smaller

[Saeed]

here is some pictures of my application
the first picture is the first page of the application.
when i collapse the login page panel the height of the panels become smaller like picture number 2.
and when i expand panel contacts the application is like picture number 3.

[Petar Mladenov]

Hi Saeed ,

 Could you please check out the attached project in which I only added MinWidth and Width of the RadPanelBarItems in addition to your code? Is this suitable for you?

Regards,
Petar Mladenov
the Telerik team

[Saeed]

Hi Petar
really thank you
I understand where is my mistake. I thought that I should change radpanelbarItem height attribute to solve the problem.
But the right attribute to change was width and minwidth.
I do not know how say "thanks" to you.
Saeed

[Ali]

Set padding of your RadPanelBarItem and it will work. 

 

<telerik:RadPanelBar BorderBrush="#9098a3" BorderThickness="1" Margin="10" >
            <telerik:RadPanelBarItem Header="Network Connections" Padding="10">

[Tayyaba]

Hi Andrew,

 

Can you please let me know, how did you manage to solve the height issue of RadPanelBar. 
I am facing the exactly same issue, you said that you did solve it by using stackPanel.
Can you please share your that code snippet?

[Petar Mladenov]

Hi Tayyaba,

Could you please check out the following SDK project and let us know if this is what you needed ? Thank you in advance.

PanelBar: AdjustPositionOfPanelBarItemsNoScrollBar


Regards,
Petar Mladenov
Progress Telerik