Silverlight 4: How to use the all new Right Click Context Menu?

Kunal2383
Posted by in Silverlight category on for Beginner level | Views : 55835 red flag
Rating: 4 out of 5  
 1 vote(s)

In this post I will describe about the another cool new feature (“How to use the all new Right Click Context Menu?”) of Silverlight 4.


 Download source code for Silverlight 4: How to use the all new Right Click Context Menu?

Introduction

In my previous posts I discussed about “How to work with Notification API?” & “How to Capture Video from Default Webcam?”. In this post I will describe about the another cool new feature (“How to use the all new Right Click Context Menu?”) of Silverlight 4.

Code Walk-through

Silverlight 4 has now support for right click. You can now register the event “MouseRightButtonDown” & “MouseRightButtonUp” to any FrameworkElement. Hence, no need to use JavaScript to disable the right click option. If you want to disable the right click option then just implement those events with:

e.Handled = true;

Now if you want to implement a Context Menu on right click, create the Popup Context menu & position it to proper location. The following code will create the context menu:


private Popup CreateContextMenu(Point currentMousePosition)
{
Popup popup = new Popup();
Grid popupGrid = new Grid();
Canvas popupCanvas = new Canvas();

popup.Child = popupGrid;
popupCanvas.MouseLeftButtonDown += (sender, e) => { HidePopup(); };
popupCanvas.MouseRightButtonDown += (sender, e) => { e.Handled = true; HidePopup(); };
popupCanvas.Background = new SolidColorBrush(Colors.Transparent);
popupGrid.Children.Add(popupCanvas);
popupGrid.Children.Add(CreateContextMenuItems(currentMousePosition));

popupGrid.Width = Application.Current.Host.Content.ActualWidth;
popupGrid.Height = Application.Current.Host.Content.ActualHeight;
popupCanvas.Width = popupGrid.Width;
popupCanvas.Height = popupGrid.Height;

return popup;
}

CreateContextMenuItems() will add some context menu items, on click it will show which menu item has been cllicked by you. Upto this I only talked about the creation of the customized context menu. Now we have to show it on right click inside the Silverlight application. In my example, I added a Border control which has the right click event registered. Now check the below implemented code which will be responsible for showing the context menu: 

void brdRightClickZone_MouseRightButtonUp(object sender, MouseButtonEventArgs e)
{
txbMessage.Text = "Right Clicked";
Point currentMousePosition = e.GetPosition(LayoutRoot);
ShowPopup(currentMousePosition);
}

private void btnRightClick_MouseRightButtonDown(object sender, MouseButtonEventArgs e)
{
e.Handled = true;
}

On right mouse down, I am setting the e.Handled = true. This ensures that, this will not show up the default Silverlight context menu & the right mouse up implementation will popup the customized context menu at the current mouse position.


Conclusion

What next? Download the sample application created by me & implement your own logic to create the customized context menu which will open on right click on your silverlight application.

Download Sample Application:  Silverlight 4 Right Click Context Menu Demo

Page copy protected against web site content infringement by Copyscape

About the Author

Kunal2383
Full Name: Kunal Chowdhury
Member Level:
Member Status: Member
Member Since: 3/1/2010 12:38:55 PM
Country: India
Thanks & Regards, Kunal Chowdhury | http://www.kunal-chowdhury.com | http://twitter.com/kunal2383
http://www.kunal-chowdhury.com
He is currently working as a Silverlight application developer. Has a very good skill over C#, XAML, Silverlight & WPF. He has a good working experience in Windows 7 application (including Multitouch) development. During his professional career he worked in various technologies & delivered quality output. He never hesitates to take up challenges & work on the latest technologies in Microsoft platform. He attended various software development competition & achieved different awards. He is presently focusing on the RIA (Silverlight & WPF) & willing to become a Technology Specialist in Microsoft platform. Learning newer things, Blog posting & helping others in forums is one of his regular activity. Specialties: Silverlight Application Development, WPF Application Development, Windows 7 Application Development

Login to vote for this post.

Comments or Responses

Login to post response

Comment using Facebook(Author doesn't get notification)