Exapand PanelBarMenu in MouseOver Event

[Donald Catimbang]

Hello,

I want to expand panelbarmenu in mouseOver.I could not found the IsExpand Property in RadPanelBar, and could not get RadPanelBarItem in MouseOverEvent. So please let me know any way to exapand PanelBarMenu in mouseover instead of Selected Event.

Also it would be great if you give me any example to how can I apply any Animation(Storyboard) in RadPanelBar (in simple Fadout/fadIn).

My XAML code is like :

<telerikNavigation:RadPanelBar MouseEnter="PanelBarItem_Selected" x:Name="pnlBarAccounting" ItemTemplate="{StaticResource Level1Template}"></telerikNavigation:RadPanelBar>

<core:HierarchicalDataTemplate x:Key="Level1Template" ItemTemplate="{StaticResource Level2Template}" ItemsSource="{Binding Items}">
               <StackPanel Orientation="Horizontal" Height="30" >
                   <Image Source="{Binding Image}" Margin="0" />
                   <TextBlock Margin="5,5,5,5" Padding="0,0,0,0" Height="50" Text="{Binding Text}">.</TextBlock>
                </StackPanel>
</core:HierarchicalDataTemplate>

Thanks,
Donald

[Tihomir Petkov]

Hi Donald,

I already replied to you ticket (#184408).

Kind regards,
Tihomir Petkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Donald Catimbang]

Hello Tihomir,

Thanks for your reply. Now I am able to give animation like fadin/fadout. But I need one more thing. I just want to exapand smoothly or slowly. At present when I click on RadPanelBarItem, its open directly.

Thanks again,
Donald.

[Tihomir Petkov]

Hi Donald,

I regret to tell you that currently animating the expansion/collapsing of PanelBarItems is somewhat impossible. There is a way to animate the expanding of items but it's rather hacky and I wouldn't recommend it.

Sincerely yours,
Tihomir Petkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Jessica]

Where can I find that ticket number with the answer?

[Petar Mladenov]

Hello Jessica,

 This ticket (184408) has been a Support ticket and it is private. I attached a screenshot from the ticket. Please keep in mind that this is very old information and may be outdated. You could elaborate more on your scenario so that we would be better able to assist you. You can also view this blog post related to the Panlebar's animations.

Regards,
Petar Mladenov
the Telerik team

[Jessica]

Thanks. I am using a hierarchy data template with the panel bar, and the child items will slide out using the onmouseover event, but the top level will not. Any suggestions? My code is below...

XAML:

<DataTemplate x:Key="ThemenDataTemplate">

 

<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Category}" Height="35" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="5 5 5 5"/>

 

</StackPanel>

 

</DataTemplate>

 

<DataTemplate x:Key="BereicheTemplate">
<StackPanel Orientation="Vertical" >

 

<telerik:RadPanelBar HorizontalAlignment="Left" Name="radChildPanelBar" VerticalAlignment="Top" Width="660" Style="{StaticResource RadPanelBarQAStyle}">

 

<telerik:RadPanelBarItem MouseEnter="RadPanelBarItem_MouseEnter" MouseLeave="RadPanelBarItem_MouseLeave" DropPosition="Inside" Header="{Binding Question}" TabNavigation="Once" Width="660" Style="{StaticResource RadPanelBarItemQAStyle}">

 

<TextBlock Text="{Binding Answer}" MaxWidth="640" TextWrapping="Wrap" />

 

</telerik:RadPanelBarItem>

 

</telerik:RadPanelBar>

 

</StackPanel>

 

</DataTemplate>

 

 

<telerik:HierarchicalDataTemplate x:Key="ItemPanelTemplateThemen"

 

ItemTemplate="{StaticResource BereicheTemplate}"

 

ItemsSource="{Binding RelatedItems}">

 

<telerik:RadPanelBarItem Height="50" Style="{StaticResource RadPanelBarItemCategoryStyle}" HeaderTemplate="{StaticResource ThemenDataTemplate}" Header="{Binding}" />

 

</telerik:HierarchicalDataTemplate>

 

</UserControl.Resources>

 

 

<Grid x:Name="LayoutRoot" DataContext="{Binding}">

 

<telerik:RadPanelBar x:Name="radPanelBar"

 

ItemTemplate="{StaticResource ItemPanelTemplateThemen}"

 

Style="{StaticResource RadPanelBarCategoryStyle}"

 

ItemContainerStyle="{StaticResource RadPanelBarCategoryContainerStyle}" Width="660"/>

Code Behind:
private void RadPanelBarItem_MouseLeave(object sender, MouseEventArgs e)

 

{

 

((RadPanelBarItem)sender).CollapseAll();

}

 

private void RadPanelBarItem_MouseEnter(object sender, MouseEventArgs e)

{
((RadPanelBarItem)sender).ExpandAll();

}

[Zarko]

Hello Jessica,
I changed your code a little bit and created a sample project with it, so could you please examine the attachment and if you need further assistance please fill free to ask/

Best wishes,
Zarko
the Telerik team