"
Now add the following line of code inside the constructor after the InitializeComponent() method.
HtmlPage.Document.AttachEvent("oncontextmenu", this.OnRightClick);And add the method for OnRightClick as below:
private void OnRightClick(object sender, HtmlEventArgs e)
{
e.PreventDefault();
}Now if you will run your application you will see that your default context menu for Silverlight 3 is disabled.
Now the important part is design your own context menu. In this case I prefer you to use Blend 3 to design your own.
Open your solution in Blend 3.
Here in Blend 3 I am designing a Button to look alike menu.
I have added 7 buttons to my context menu.
Xaml code:
The Style for the Menu Button is defined in App.xaml as follows:
Always remember to make the visibility of the Stack Panel to Collapse. Now make the visibility of the Stack Panel Visible in OnRightClick() method. You can have the position of the context menu by taking the e.ClientX and e.ClientY as follows:
private void OnRightClick(object sender, HtmlEventArgs e)|
{
e.PreventDefault();
myStackMenu.Visibility = Visibility.Visible;
myStackMenu.Margin = new Thickness(e.ClientX,e.ClientY,0,0);
}If you run the application now you will find the below menu (without menu functioning).
We will add the below to event handlers to handle the visibility of the Menu.
private void myStackMenu_LostFocus(object sender, RoutedEventArgs e)
{
myStackMenu.Visibility = Visibility.Collapsed;
}
private void LayoutRoot_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
myStackMenu.Visibility = Visibility.Collapsed;
}
Now for each Button Click we will change the ClickMode to Press. As shown below:
Write the below lines of code in the respective click events of the buttons (options).
private void option1_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Red);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option2_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Green);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option3_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Blue);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option4_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Yellow);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option5_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Orange);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option6_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Magenta);
myStackMenu.Visibility = Visibility.Collapsed;
}
private void option7_Click(object sender, RoutedEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.White);
myStackMenu.Visibility = Visibility.Collapsed;
}
Now play with this menu more to invent more. And do let me know if you find any new idea.
Hope you enjoy this article.