Software Technology Tips

The method of binding Events to View Modals only differs in the Xaml, rest of the Code remains the Same.

Note:

1 ) All the contents in the xaml Page should be places inside the       
<phone:PhoneApplicationPage></phone:PhoneApplicationPage> TAG
    for Windows Phone And <UserControl></UserControl> for Silverlight Applications.

2) This also requires a reference to System.Windows.Interactivity dll.
 
This example consistes of 4 parts :

1 ) ButtonCommandBinding.cs
2 ) ButtonMouseEnterCommandBindingViewModal.cs
3 ) ButtonMouseEnterCommandBinding.xaml.cs
4 ) ButtonMouseEnterCommandBinding.xaml
--------------------------------------------------------------------------------
 
Code for ButtonMouseEnterCommandBinding.xaml
This is the view portion for the application here button mouse enter event will be captured and binded to the view model.

you will have to include System.Windows.Interactivity to attach mouse enter event

    <UserControl x:Class="MVVMUtility.ButtonMouseEnterCommandBinding"
             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:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="400">

    <Grid x:Name="LayoutRoot"
          Background="White">

        <Button Content="OK"
                Height="100"
                Width="100"
                iHorizontalAlignment="Center"
                VerticalAlignment="Center"
                >
            <i:Interaction.Triggers><!-- Invoke command for mouse Enter -->
                <i:EventTrigger EventName="MouseEnter">
                    <i:InvokeCommandAction Command="{Binding MouseEnter}" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Button>

<!-- Text box to denote that mouse enter event has occurred -->
        <TextBox Height="45"
                 Background="AliceBlue"
                 HorizontalAlignment="Center"
                 Name="textBlock1"
                 Text="{Binding Path=Text}"
                 VerticalAlignment="Top"
                 Width="217" />
    </Grid>
</UserControl>
 
---------------------------------------------------------------------------------
 
 
Code for ButtonMouseEnterCommandBinding.xaml.cs

This is the code behind for the view where data context will be provided for the entire view

public partial class ButtonMouseEnterCommandBinding : UserControl
    {
        public ButtonMouseEnterCommandBinding()
        {
            InitializeComponent();
            //provide data context to the entire page
            this.DataContext = new ButtonMouseEnterCommandBindingViewModal();
        }
    }

 
----------------------------------------------------------------------------
 

Code for ButtonMouseEnterCommandBindingViewModal.cs

This is the view modal where the event is registered by calling the ButtonCommandBinding class.
Here the method ShowMouseOver() is called when the event occurrs.


    public class ButtonMouseEnterCommandBindingViewModal : INotifyPropertyChanged
    {
        //Text property for textbox
        public string Text { get; set; }

        //Command binding property for text box
        public ButtonCommandBinding MouseEnter { get; set; }
        /// <summary>
        /// Constructor
        /// </summary>
        public ButtonMouseEnterCommandBindingViewModal()
        {
            // Register the method to be called on Mouse Enter
            MouseEnter = new ButtonCommandBinding(ShowMouseOver);
            // Set enable of event execution to true
            MouseEnter.IsEnabled = true;
        }


        /// <summary>
        /// Method to be called when property(value) is changed
        /// </summary>
        /// <param name="propertyName"></param>
        protected void NotifyPropertyChanged(string propertyName)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        

        public void ShowMouseOver()
        {
            // insert logic here for execution of mouse over event
            //change value
            Text = "In view modal";
            NotifyPropertyChanged("Text");
        }

        /// <summary>
        /// Property changed Event
        /// </summary>
        public event PropertyChangedEventHandler PropertyChanged;
    }
-------------------------------------------------------------------------------------------------
 
 
Code for ButtonCommandBinding.cs

This class registers the method to be executed by the click command and executes the method when event occurrs.



public class ButtonCommandBinding : ICommand
    {
        //delegate command to register method to be executed
        private readonly Action handler;
        private bool isEnabled;

        /// <summary>
        /// Bind method to be executed to the handler
        /// So that it can direct on event execution
        /// </summary>
        /// <param name="handler"></param>
        public ButtonCommandBinding(Action handler)
        {
            //Specify the method name to the handler
            this.handler = handler;
        }

        public bool IsEnabled
        {
            get { return isEnabled; }
            set
            {
                if (value != isEnabled)
                {
                    isEnabled = value;
                    if (CanExecuteChanged != null)
                    {
                        CanExecuteChanged(this, EventArgs.Empty);
                    }
                }
            }
        }

        /// <summary>
        /// method to specify if the event will execute
        /// </summary>
        /// <param name="parameter"></param>
        /// <returns></returns>
        public bool CanExecute(object parameter)
        {
            return IsEnabled;
        }

        public event EventHandler CanExecuteChanged;

        /// <summary>
        /// This method is called when the event occurs which transfers the
        /// controll to the method that has been registered
        /// </summary>
        /// <param name="parameter"></param>
        public void Execute(object parameter)
        {
            //call the method using the handler
            handler();
        }
    }


Related Tags:

Windows phone 7, SilverLight

Author: Anobik Dey

Silverlight

Let us Connect!

iso 9001 QA25 Red Herring STPI D&B Fastest Growing SME 2013 Award zinnov Nasscom

copyright (c) Mindfire Solutions 2007-2014. Login