Context Menu with the Right Mouse Button Events
Introduced in Silverlight 4 are several new events, two of these MouseRightButtonDown and MouseRightButtonUp relate to the right mouse button. With these new events it is now easy to implement a right click context menu.
<UserControl x:Class="RightMouseClickContextMenu.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:liquidMenu="clr-namespace:Liquid;assembly=Liquid.Menu"
mc:Ignorable="d">
<Canvas x:Name="LayoutRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="White" MouseRightButtonDown="LayoutRoot_MouseRightButtonDown" MouseLeftButtonDown="LayoutRoot_MouseLeftButtonDown">
<TextBlock Canvas.Left="50" Canvas.Top="50" Text="Click your right mouse button!" FontSize="20" />
<liquidMenu:Menu x:Name="popupMenu" ItemSelected="MenuList_ItemSelected" Visibility="Collapsed">
<liquidMenu:MenuItem ID="cut" Icon="images/cut.png" Text="Cut" Shortcut="Ctrl+X" />
<liquidMenu:MenuItem ID="copy" Icon="images/copy.png" Text="Copy" Shortcut="Ctrl+C" />
<liquidMenu:MenuItem ID="paste" Icon="images/paste.png" Text="Paste" Shortcut="Ctrl+V" />
<liquidMenu:MenuDivider />
<liquidMenu:MenuItem ID="new" Text="New">
<liquidMenu:Menu>
<liquidMenu:MenuItem ID="pdf" Icon="images/pdf.png" Text="PDF Document" />
<liquidMenu:MenuItem ID="excel" Icon="images/xls.png" Text="Excel Spreadsheet" />
<liquidMenu:MenuItem ID="word" Icon="images/doc.png" Text="Word Document" />
</liquidMenu:Menu>
</liquidMenu:MenuItem>
</liquidMenu:Menu>
</Canvas>
</UserControl>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Liquid;
namespace RightMouseClickContextMenu
{
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
}
private void MenuList_ItemSelected(object sender, MenuEventArgs e)
{
switch (e.Tag.ToString())
{
case "cut":
// TODO: Cut functionality
break;
case "copy":
// TODO: Copy functionality
break;
default:
break;
}
popupMenu.Hide();
}
private void LayoutRoot_MouseRightButtonDown(object sender, MouseButtonEventArgs e)
{
Point p = e.GetPosition(this);
Canvas.SetLeft(popupMenu, p.X);
Canvas.SetTop(popupMenu, p.Y);
popupMenu.Show();
e.Handled = true;
}
private void LayoutRoot_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
popupMenu.Hide();
}
}
}
Here we are using the Liquid Popup Menu control for our context menu. When the MouseRightButtonDown event occurs we work out the X/Y position of the mouse and position/show the context menu.
It is important to set e.Handled = true when we have finished in the event handler in order to ensure Silverlight does not show the default Silverlight Context menu.
Your Comments
Post your Comments
Rate this page:
1 Star
2 Star
3 Star
4 Star
5 Star
12 Ratings / 2.8 Average