In this article let us see the different ways of using the property ClickMode for a Button Control in a silverlight application. As usual, open the visual studio and select the silverlight project.

First let us drag three different Button and TextBlock controls to Stack Panel as shown below into MainPage.xaml. Here i used a property called "ClickMode" for all the three button controls, But the value assigned to it is different.

For the first button i assigned the value Hover to the ClickMode property, It means that the click event handler takes place whenever the mouse is hovered onto this button.

For the second button i assigned the value Press to the ClickMode property, It means that the click event handler takes place whenever the mouse is clicked on this button.

For the third button i assigned the value Release to the ClickMode property, It means that the click event handler takes place whenever the mouse is released from this button. 

        <Button x:Name="btn1" Margin ="5" HorizontalAlignment="Left"
            Foreground="Black" Width="320" Click="OnClick1"
            Content="On Mouse Hover this text will appear below"
ClickMode="Hover" />

        <TextBlock x:Name="text1" Margin ="0,8,0,0" />

        <Button x:Name="btn2" Margin ="5,5,5,5"  HorizontalAlignment="Left"             Foreground="Black" Width="320" Click="OnClick2"
            Content="On Button Press this text will appear below" ClickMode="Press" />

        <TextBlock x:Name="text2" Margin="0,8,0,0" />

<Button x:Name="btn3" Margin ="5,5,5,5" HorizontalAlignment="Left" Click="OnClick3" Width="320" Content="On Button Release this text will appear below" ClickMode="Release"/>

        <TextBlock x:Name="text3" Margin ="0,8,0,0" />

Now I am writing the code for button click events in the MainPage.xaml.cs

public MainPage()
        {
            InitializeComponent();          

        }
        void OnClick1(object sender, RoutedEventArgs e)
        {
            btn1.Foreground = new SolidColorBrush(Colors.Blue);
            text1.Text = "On Mouse Hover this text will appear below.";
            text2.Text = "";
            text3.Text = "";
        }

        void OnClick2(object sender, RoutedEventArgs e)
        {
            btn2.Foreground = new SolidColorBrush(Colors.Green);
            text1.Text = "";
            text2.Text = "On Button Press this text will appear below.";
            text3.Text = "";
        }

        void OnClick3(object sender, RoutedEventArgs e)
        {
            btn1.Foreground = new SolidColorBrush(Colors.Green);
            btn2.Foreground = new SolidColorBrush(Colors.Blue);
            text1.Text = "";
            text2.Text = "";
            text3.Text = "On Button Release this text will appear below.";
        }

Thats it!!! Just press F5 and see the result. 

The output for the first Button looks like as



The output for the second Button looks like as



Note: For the people who find it difficult to integrate the above code, I am pasting the complete code here.

MainPage.Xaml:

<UserControl x:Class="SilverlightTest1.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:sdk=http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <StackPanel x:Name="LayoutRoot" Background="White" Margin="10">

        <Button x:Name="btn1" Margin ="5" HorizontalAlignment="Left"
            Foreground="Black" Width="320" Click="OnClick1"
            Content="On Mouse Hover this text will appear below" ClickMode="Hover" />

        <TextBlock x:Name="text1" Margin ="0,8,0,0" />

        <Button x:Name="btn2" Margin ="5,5,5,5"  HorizontalAlignment="Left"
            Foreground="Black" Width="320" Click="OnClick2"
            Content="On Button Press this text will appear below" ClickMode="Press" />

        <TextBlock x:Name="text2" Margin="0,8,0,0" />

<Button x:Name="btn3" Margin ="5,5,5,5" HorizontalAlignment="Left" Click="OnClick3" Width="320" Content="On Button Release this text will appear below" ClickMode="Release"/>

        <TextBlock x:Name="text3" Margin ="0,8,0,0" />

    StackPanel>

UserControl>

MainPage.Xaml.cs:

public MainPage()
        {
            InitializeComponent();           

        }
        void OnClick1(object sender, RoutedEventArgs e)
        {
            btn1.Foreground = new SolidColorBrush(Colors.Blue);
            text1.Text = "On Mouse Hover this text will appear below.";
            text2.Text = "";
            text3.Text = "";
        }

        void OnClick2(object sender, RoutedEventArgs e)
        {
            btn2.Foreground = new SolidColorBrush(Colors.Green);
            text1.Text = "";
            text2.Text = "On Button Press this text will appear below.";
            text3.Text = "";
        }

        void OnClick3(object sender, RoutedEventArgs e)
        {
            btn1.Foreground = new SolidColorBrush(Colors.Green);
            btn2.Foreground = new SolidColorBrush(Colors.Blue);
            text1.Text = "";
            text2.Text = "";
            text3.Text = "On Button Release this text will appear below.";
        }

Happy coding