Simple Model View Presenter Demo in C#

Model View Presenter is a software approach pattern conceived as derivative of Model View Controller.

What is Model?

Model is a domain level or business level object. A model accommodates application data and provides behaviours to systematically access it. It should be independent, it should not have any association with user interface issues. So we can reuse the same model for different type of UI level applications.

What is View?

A View is a windowpane for showing the model data or elements to the application users. Model does not have direct link to the views. View know about their Models, but not the other way around.

What is Presenter?

Presenter will address the user input and use this to manipulate the model data. View will pass the user input actions to the Presenter for interpretation. Presenter will act on the received data from View and communicate with Model and produce results to the View.

Okay now we are going to do a simple Demo to get hand on experience about this pattern. 1st go to visual studio and create an empty web application project

when you create the project add Three Folders to your project and name them as Model, View, Presenter

Now we are going to add the Interface to the Model Folder That Interface should be like this

Model Interface Class

   /// <summary>  
   /// ICalculation Model Interface  
   /// </summary>  
   public interface ICalculationModel  
   {  
     /// <summary>  
     /// Gets the answer.  
     /// </summary>  
     /// <param name="valueOne">The value one.</param>  
     /// <param name="valueTwo">The value two.</param>  
     /// <returns></returns>  
     double GetAnswer(int valueOne, int valueTwo);  
   }  

Model Class
  /// <summary>  
   /// CalculationModel Class  
   /// </summary>  
   public class CalculationModel : ICalculationModel  
   {  
     #region Implementation of ICalculationModel  
   
     /// <summary>  
     /// Gets the answer.  
     /// </summary>  
     /// <param name="valueOne">The value one.</param>  
     /// <param name="valueTwo">The value two.</param>  
     /// <returns></returns>  
     public double GetAnswer(int valueOne, int valueTwo)  
     {  
       return valueOne + valueTwo;  
     }  
   
     #endregion  
   }  

View Interface Class
  /// <summary>  
   /// ICalcualationView Interface  
   /// </summary>  
   public interface ICalcualationView  
   {  
   
     /// <summary>  
     /// Gets or sets the value one text.  
     /// </summary>  
     string ValueOneText { get; set; }  
   
   
     /// <summary>  
     /// Gets or sets the value two text.  
     /// </summary>  
     string ValueTwoText { get; set; }  
   
   
     /// <summary>  
     /// Gets or sets the result text.  
     /// </summary>  
     string ResultText { get; set; }  
   }  

CalculationForm.aspx
 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CalculationForm.aspx.cs" Inherits="MVPDemo.CalculationForm" %>  
 <!DOCTYPE html>  
   
 <html xmlns="http://www.w3.org/1999/xhtml">  
 <head runat="server">  
   <title>MVP Example for ASP.Net C#</title>  
   <style type="text/css">  
     .auto-style1 {  
       width: 138px;  
     }  
   </style>  
 </head>  
 <body>  
   <form id="form1" runat="server">  
   <div>     
   </div>  
     <table>  
       <tr>  
         <td class="auto-style1"><strong>Calculation Area</strong></td>  
       </tr>  
        <tr>  
         <td class="auto-style1">Enter Number One</td>  
          <td><asp:TextBox ID="TextValueOne" runat="server" Width="233px"></asp:TextBox></td>  
       </tr>  
       <tr>  
         <td class="auto-style1">Enter Number One</td>  
          <td><asp:TextBox ID="TextValueTwo" runat="server" Width="233px"></asp:TextBox></td>  
       </tr>  
       <tr>  
         <td class="auto-style1"></td>  
          <td><asp:Button ID="AnswerButton" runat="server" Text="Answer" OnClick="AnswerButton_Click" /></td>  
       </tr>  
        <tr>  
         <td class="auto-style1"></td>  
          <td><asp:Label ID="TextResult" runat="server" Text="Result"></asp:Label></td>  
       </tr>  
     </table>  
   </form>  
 </body>  
 </html>  
   

Presenter Class
   /// <summary>  
   /// CalculationPresenter Class  
   /// </summary>  
   public class CalculationPresenter  
   {  
     /// <summary>  
     /// The Calculation view  
     /// </summary>  
     private readonly ICalcualationView iCalcualationView;  
   
     /// <summary>  
     /// Initializes a new instance of the <see cref="CalculationPresenter" /> class.  
     /// </summary>  
     /// <param name="view">The view Instance</param>  
     public CalculationPresenter(ICalcualationView view)  
     {  
       this.iCalcualationView = view;  
     }  
   
     /// <summary>  
     /// Gets the answer.  
     /// </summary>  
     public void GetAnswer()  
     {  
       var model = new CalculationModel();  
       iCalcualationView.ResultText = model.GetAnswer(Convert.ToInt32(this.iCalcualationView.ValueOneText), Convert.ToInt32(this.iCalcualationView.ValueTwoText)).ToString(CultureInfo.InvariantCulture);  
     }  
   }  

CalculationForm.aspx.cs
   /// <summary>   
   /// CalculationForm UI   
   /// </summary>   
   public partial class CalculationForm : System.Web.UI.Page, ICalcualationView   
   {   
    #region Implementation of ICalcualationView   
    /// <summary>   
    /// Gets or sets the value one text.   
    /// </summary>   
    public string ValueOneText   
    {   
     get   
     {   
      return TextValueOne.Text;   
     }   
     set   
     {   
      TextValueOne.Text = value;   
     }   
    }   
    /// <summary>   
    /// Gets or sets the value two text.   
    /// </summary>   
    public string ValueTwoText   
    {   
     get   
     {   
      return TextValueTwo.Text;   
     }   
     set   
     {   
      TextValueTwo.Text = value;   
     }   
    }   
    /// <summary>   
    /// Gets or sets the result text.   
    /// </summary>   
    public string ResultText   
    {   
     get   
     {   
      return TextResult.Text;   
     }   
     set   
     {   
      TextResult.Text = value;   
     }   
    }   
    #endregion   
    /// <summary>   
    /// Handles the Load event of the Page control.   
    /// </summary>   
    /// <param name="sender">The source of the event.</param>   
    /// <param name="e">The <see cref="EventArgs"/> instance containing the event data.</param>   
    protected void Page_Load(object sender, EventArgs e)   
    {   
    }   
    /// <summary>   
    /// Handles the Click event of the AnswerButton control.   
    /// </summary>   
    /// <param name="sender">The source of the event.</param>   
    /// <param name="e">The <see cref="EventArgs"/> instance containing the event data.</param>   
    protected void AnswerButton_Click(object sender, EventArgs e)   
    {   
     var presenter = new CalculationPresenter(this);   
     presenter.GetAnswer();   
    }   
   }   

Finally your project structure is should be look like this.  then Run it and check it. if you did it correctly well don you did your first MVP Project successfully. Happy coding guys. Have a nice day



Comments

Popular posts from this blog

Deep dive into OpenXML Part 1

Deep dive into OpenXML Part 2

Convert XML data to dynamic (ExpandoObject) Object