How to Close menu after menu item command was executed

[Ralf]

Hi all,

I'm new to RadialMenu. So I have a question.
In my App I try to use the RadialMenu as context menu in an image list.

My XAML declaration looks like this:

<GridView x:Name="attachmentsView"
                          Grid.Column="3" Grid.Row="1"
                          ItemsSource="{Binding Path=Attachments}"
                          Margin="0,0,39,0">
                    <GridView.ItemTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <Image Source="{Binding Path=LocalPath}" Stretch="Uniform"  Width="300">
                                    <telerik:RadRadialContextMenu.Behavior>
                                        <ecsUI:CustomPositionTriggerBehavior AttachTriggers="PointerPressed" />
                                    </telerik:RadRadialContextMenu.Behavior>
                                    <telerik:RadRadialContextMenu.Menu>
                                        <telerik:RadRadialMenu Width="240">
                                            <telerik:RadialMenuItem Header="Change Name" IconContent="" Selectable="False" Command="{Binding ChangeAttachmendNameCommand, Source={StaticResource Commands}}" />
                                            <telerik:RadialMenuItem Header="Remove" Selectable="False" IconContent="" Command="{Binding DeleteAttachmentCommand, Source={StaticResource Commands}}" />
                                        </telerik:RadRadialMenu>
                                    </telerik:RadRadialContextMenu.Menu>
                                </Image>
                                <Border Background="White">
                                    <TextBlock Text="{Binding Path=Name}" Margin="5" />
                                </Border>
                            </StackPanel>
                        </DataTemplate>
                    </GridView.ItemTemplate>
                </GridView>

The menu is working fine. But I need to close the menu automatically after a menu item command was executed. For example I click/tab on "Remove" menu item I need to close the menu and hide the MenuButton progammatically. How to do?
The behavior should be like normal context menu behvior: click/tab to open -> click/tab menu item -> close context menu.

Regards,
Ralf

[Tsvyatko]

Hello Ralf,

I have prepared sample application demonstrating how to achieve the desired behavior. Please have a look and let us know if you have further questions regarding this scenarios.

Regards,
Tsvyatko
Telerik

 

 

[Ralf]

Helo Tsvyatko,

thank you for the example. In the sample solution there is the CustomCommand.cs missing.
Can you please post the code of this class?

Regards,
Ralf

[Tsvyatko]

Hello Ralf,

Please excuse me of the incomplete project. I have reatached updated project.

Here is the code snippet as well:

public class CustomCommand : ICommand
   {
       public bool CanExecute(object parameter)
       {
           return true;
       }

       public event EventHandler CanExecuteChanged;

       public void Execute(object parameter)
       {
           var context = parameter as RadialMenuItemContext;
           var target = context.TargetElement;
           var menu = RadRadialContextMenu.GetMenu(target);

           menu.IsOpen = false;
       }
   }

Regards,
Tsvyatko
Telerik

 

 

[Ralf]

Hello Tsvyatko,

thank you for posting the snipped. Works fine, but what's abaut the menu main button (the button to open the menu). How to hide it also directly at the and of command excution? Is it possible to hide it prgrammatically in the command execute method?

Regards,
Ralf

[Tsvyatko]

Hi Ralf,

You can achieve this by calling Detach method of the triggers behavior. If called immediately it will skip the animation. In order to wait for the animation to complete you can add timer and execute detach after the animation completes.

Have a look at the example and let us know if this helps.

Regards,
Tsvyatko
Telerik