Silverlight Tip of the Day #14 – How to Right Click on a Silverlight Application.

You may have noticed that right clicking on a Silverlight application brings up the following context menu and configuration dialog:

Context Menu:

image

Configuration Dialog:

image

So what if you want to use right click in your application? While right click functionality is not currently supported in Silverlight, there is a work-around. I will step you through how to intercept the right click event, process it and display your own content instead of the Silverlight dialog.

Step 1. To start, let’s add a <TextBlock> control to our Page.xaml to track the status of the right click:

 <UserControl x:Class="SilverlightApplication15.Page"
     xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" 
     Width="400" Height="300">
     <Grid x:Name="LayoutRoot" Background="red">
         <TextBlock x:Name="MyField">Right click please.</TextBlock>
     </Grid>
 </UserControl>

Step 2. Next, we need to set the Silverlight control to be windowless. Open the web page (i.e. default.aspx) that contains the Silverlight control and add the tag Windowless=”true” to it. Example:

<asp:Silverlight ID="Xaml1" runat="server" Windowless="true" Source="~/ClientBin/SilverlightApplication15.xap" MinimumVersion="2.0.30523" Width="100%" Height="100%" />

Step 3: Finally, let’s take a look at the code we add to Page.xaml.cs.

-
I start by creating a new class called ContextMenuInterceptor. In this class constructor we attach an event “OnContextMenu” to the document for the HtmlPage. In order to use the HTMLPage object you will need to add a using statement referencing System.Window.Browser.

-
I then call e.PeventDefault(). This cancels further propagation of the right click event so that Silverlight does not receive it.

-
At this point, we have intercepted the right click and can do whatever else we want. In my case, I simply display the coordinates of where you right clicked.

Page.xaml.cs:

 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 System.Windows.Browser;
  
 namespace SilverlightApplication15
 {
     public partial class Page : UserControl
     {
         ContextMenuInterceptor _cmi = null;
         public Page()
         {
             InitializeComponent();
             _cmi = new ContextMenuInterceptor(MyField);           
         }
     }       
  
     public class ContextMenuInterceptor
     {
         TextBlock TextField;
  
         public ContextMenuInterceptor(TextBlock textField)
         {
             TextField = textField;
             HtmlPage.Document.AttachEvent("oncontextmenu", this.OnContextMenu);
         }
  
         private void OnContextMenu(object sender, HtmlEventArgs e)
         {
             TextField.Text = "Right Clicked Blocked at "+e.OffsetX+","+e.OffsetY;           
             e.PreventDefault();           
         }
     }
 }

Thank you,

--Mike Snow

 Subscribe in a reader

Comments

  • Anonymous
    November 18, 2008
    PingBack from http://www.tmao.info/silverlight-tip-of-the-day-14-%e2%80%93-how-to-right-click-on-a-silverlight-application/

  • Anonymous
    November 18, 2008
    Voila un article sur lequel je viens de tomber. Le post explique comment intercepter le click droit et

  • Anonymous
    February 22, 2009
    silverlight中可以处理很多键盘和鼠标事件,然而遗憾的是这些事件并不包括鼠标右键事件:鼠标右键事件被Silverlight 自己的上下文菜单“Silverlight Configuration”占用;然而富交互程序大都希望使用鼠标右键弹出上下文菜单或实现快捷操作。 幸运的是,前辈大牛们早已解决了这个问题,本文参考已有的解决方案,给出了详细的实现步骤。