MVVM code for a calculator in WPF (C#)

MVVM code for a calculator in WPF (C#)

I've written a code for a simple calculator in wpf .
My MainWindow.Xaml code is..
<Window x:Class="CalculatorNew.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid ContextMenuClosing="Multi">
<TextBox x:Name="TextBox1" HorizontalAlignment="Left" Height="23"
Margin="216,23,0,0" TextWrapping="Wrap" VerticalAlignment="Top"
Width="120" RenderTransformOrigin="0.679,0.552"/>
<TextBox x:Name="TextBox2" HorizontalAlignment="Left" Height="23"
Margin="216,76,0,0" TextWrapping="Wrap" VerticalAlignment="Top"
Width="120" RenderTransformOrigin="0.679,0.552"/>
<TextBox x:Name="TextBox3" HorizontalAlignment="Left" Height="23"
Margin="216,121,0,0" TextWrapping="Wrap" VerticalAlignment="Top"
Width="120" RenderTransformOrigin="0.679,0.552"/>
<TextBlock HorizontalAlignment="Left" Margin="68,30,0,0"
TextWrapping="Wrap" Text="First Number" VerticalAlignment="Top"
RenderTransformOrigin="1.137,1.259" Height="16" Width="80"/>
<TextBlock HorizontalAlignment="Left" Margin="68,128,0,0"
TextWrapping="Wrap" VerticalAlignment="Top"
RenderTransformOrigin="1.137,1.259" Height="16" Width="80"
Text="Result"/>
<TextBlock HorizontalAlignment="Left" Margin="68,83,0,0"
TextWrapping="Wrap" VerticalAlignment="Top"
RenderTransformOrigin="1.137,1.259" Height="16" Width="99"
Text="Second Number"/>
<Button Content="+" HorizontalAlignment="Left" Margin="73,172,0,0"
VerticalAlignment="Top" Width="75" Click="Add"/>
<Button Content="-" HorizontalAlignment="Left" Margin="179,172,0,0"
VerticalAlignment="Top" Width="75" Click="Sub"/>
<Button Content="*" HorizontalAlignment="Left" Margin="286,172,0,0"
VerticalAlignment="Top" Width="75" Click="Multi"/>
<Button Content="/" HorizontalAlignment="Left" Margin="392,172,0,0"
VerticalAlignment="Top" Width="75" Click="Div"/>
</Grid>
My MainWindowdow.Xaml.cs code is..
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace CalculatorNew
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Add(object sender, RoutedEventArgs e)
{
TextBox3.Text = (System.Convert.ToDecimal(TextBox1.Text) +
System.Convert.ToDecimal(TextBox2.Text)).ToString();
}
private void Sub(object sender, RoutedEventArgs e)
{
TextBox3.Text = (System.Convert.ToDecimal(TextBox1.Text) -
System.Convert.ToDecimal(TextBox2.Text)).ToString();
}
private void Div(object sender, RoutedEventArgs e)
{
TextBox3.Text = (System.Convert.ToDecimal(TextBox1.Text) /
System.Convert.ToDecimal(TextBox2.Text)).ToString();
}
private void Multi(object sender, RoutedEventArgs e)
{
TextBox3.Text = (System.Convert.ToDecimal(TextBox1.Text) *
System.Convert.ToDecimal(TextBox2.Text)).ToString();
}
}
}
I am new to WPF and MVVM . So I am finding it a bit difficult to write it
in the MVVM format .
Can someone tell me how to rewrite it in MVVM format so that I can use it
as a reference for the future?
Thanks.