WPF Calculator in VB.NET

In this article, I create a mathematical calculator in WPF.
  • 3386
 

This article is about how to create a Calculator for mathematical operations in WPF. See the code snippets for WPF Calculator: 

Code Sample

<Window x:Class="WPFCalculator.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="WPF Calculator"
    Height="462"
    Width="595" 
    Background="LightGray"
    ResizeMode="CanMinimize"  
    TextInput="OnWindowKeyDown"
 >
 <DockPanel Name="MyPanel">
        <Menu  DockPanel.Dock="Top" Height="26">
            <MenuItem Header="File">
                <MenuItem Click="OnMenuExit" Header="Exit"/>
            </MenuItem>
            <MenuItem Header="View">
                <MenuItem Name="StandardMenu" Click="OnMenuStandard" IsCheckable="true"IsChecked="True"
Header="Standard"/>
            </MenuItem>
            <MenuItem Header="Help">
                <MenuItem  Click="OnMenuAbout" Header="About"/>
            </MenuItem>
        </Menu>
        <Grid Name="MyGrid" Background="LightGray" ShowGridLines="False" Width="575">
            <Grid.Resources >
                <Storyboard x:Key="playStoryboard">
                    <DoubleAnimation From="30" To="20" Duration="0:0:0.25"RepeatBehavior="1x" AutoReverse="True"
Storyboard.TargetName="TB" Storyboard.TargetProperty="(Rectangle.Height)"/>
                    <DoubleAnimation From="60" To="40" Duration="0:0:0.25"RepeatBehavior="1x" AutoReverse="True"
 Storyboard.TargetName="TB"Storyboard.TargetProperty="(Rectangle.Width)"/>
                </Storyboard>
                <Style x:Key="DigitBtn"  TargetType="{x:Type Button}">
                    <Setter Property="Focusable" Value="False"/>
                    <Setter Property="FontSize" Value="14pt"/>
                    <Setter Property="Margin" Value="0"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <Grid Width="60" Height="32">
                                    <Rectangle  RadiusX="10" RadiusY="10"  Width="57" Height="30"x:Name="TB" 
 StrokeThickness="1"
                           Stroke="{TemplateBinding Foreground}" Fill="{TemplateBindingBackground}"
                           HorizontalAlignment="Center" VerticalAlignment="Center" />
                                    <ContentPresenter Content="{TemplateBinding Content}"HorizontalAlignment="Center" 
                    VerticalAlignment="Center"/>
                                </Grid>
 
                                <ControlTemplate.Triggers>
                                   <Trigger Property="IsMouseOver" Value="true">
                                        <Setter TargetName="TB" Property="Rectangle.Fill"Value="Lightblue" />
                                    </Trigger>
                                    <Trigger Property="IsPressed" Value="true">
                                        <Setter TargetName="TB" Property="Rectangle.Fill" Value="Blue" />
                                    </Trigger>
                                    <EventTrigger RoutedEvent="ButtonBase.Click">
                                        <EventTrigger.Actions>
                                            <BeginStoryboard Name="playStoryboard" Storyboard="{StaticResource
playStoryboard}"/>
                                        </EventTrigger.Actions>
                                    </EventTrigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Button Name="B7" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="2" Grid.Row="2">7</Button>
            <Button Name="B8" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3" Grid.Row="2">8</Button>
            <Button Name="B9" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3" Grid.Row="2" Grid.ColumnSpan="2" Margin="63,0,1,0">9</Button>
            <Button Name="B4" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="2" Grid.Row="3" Grid.ColumnSpan="2" Margin="1,0,63,0">4</Button>
            <Button Name="B5" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3" Grid.Row="3">5</Button>
            <Button Name="B6" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3" Grid.Row="3" Grid.ColumnSpan="2" Margin="63,0,1,0">6</Button>
            <Button Name="B1" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="2" Grid.Row="4" Grid.ColumnSpan="2" Margin="1,0,63,0">1</Button>
            <Button Name="B2" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3"
Grid.Row="4">2</Button>
            <Button Name="B3" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="4" Grid.Row="4">3</Button>
            <Button Name="B0" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="2" Grid.Row="5" Grid.ColumnSpan="2" Margin="1,0,63,0">0</Button>
            <Button Name="BPeriod" Click="DigitBtn_Click" Style="{StaticResource DigitBtn}"Grid.Column="3" Grid.Row="5">.</Button>
            <Button Name="BPM" Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="7" Grid.Row="5">+/-</Button>
            <Button Name="BDevide" Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"
Grid.Column="5" Grid.Row="5" Margin="63,1,1,-1" Grid.ColumnSpan="2">/</Button>
           <Button Name="BMod" Click ="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="5" Grid.Row="3" Margin="63,1,1,65"Grid.RowSpan="2" Grid.ColumnSpan="2">^</Button>
            <Button Name="BMultiply" Click ="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="5" Grid.Row="4" Margin="63,1,1,65"Grid.RowSpan="2" Grid.ColumnSpan="2">*</Button>
            <Button Name="BMinus"   Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="7"
Grid.Row="4" >-</Button>
            <Button Name="BPlus"      Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="8" Grid.Row="5" Margin="1,0,-1,0">+</Button>
            <Button Name="Bspc"     Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="4" Grid.Row="1" ToolTip="Usage: 'A Sqrt'"Grid.ColumnSpan="5"Margin="31,66,32,0" Grid.RowSpan="2">Bspc</Button>
            <Button Name="BSqrt"           Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="7" Grid.Row="3"   ToolTip="Usage: 'A Sqrt'"Margin="2,1,3,65" Grid.RowSpan="2">Sqrt
</Button>
           <Button Name="BPercent"        Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}"  Grid.Column="8" Grid.Row="3"   ToolTip="Usage: 'A % B ='" HorizontalAlignment="Right" Width="63.889">%
</Button>
            <Button Name="BOneOver"        Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}"  Grid.Column="8" Grid.Row="4"   ToolTip="Usage: 'A 1/X'">1/X</Button>
            <Button Name="BEqual"    Click="OperBtn_Click" Background="White" Style="{StaticResource DigitBtn}"  Grid.Column="4" Grid.Row="5">=</Button>
            <Button Name="BC"  Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="6" Grid.Row="2" ToolTip="Clear All"Margin="63,0,1,66" Grid.RowSpan="2" Grid.ColumnSpan="2">C</Button>
            <Button Name="BCE" Click="OperBtn_Click" Background="Lightblue" Style="{StaticResource DigitBtn}"  Grid.Column="7" 
ToolTip
="Clear Current Entry" Grid.Row="1"Margin="63,66,1,0" Grid.RowSpan="2" Grid.ColumnSpan="2">CE</Button>
            <Button Name="BMemClear"        Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}" Grid.Row="2"  ToolTip="Clear Memory"Grid.ColumnSpan="2" Margin="1,0,63,0">MC</Button>
            <Button Name="BMemRecall"   Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}" Grid.Row="3"  ToolTip="Recall Memory"Grid.ColumnSpan="2" Margin="1,0,0,0" HorizontalAlignment="Left"Width="63.778">MR</Button>
 
           <Button Name="BMemSave"         Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}" Grid.Row="3"  ToolTip="Store in Memory"Margin="1,65,63,1" Grid.RowSpan="2" Grid.ColumnSpan="2">
MS</Button>
  
          <Button Name="BMemPlus"         Click="OperBtn_Click" Background="Lightblue"Style="{StaticResource DigitBtn}" Grid.Row="4"  ToolTip="Add To Memory"Margin="1,62,63,4" Grid.RowSpan="2" Grid.ColumnSpan="2">
M+</Button>
            <TextBlock  Name="BMemBox"    Grid.Column="3" Grid.Row="1"Margin="10,17,10,17" Grid.ColumnSpan="2">Memory:
[empty]
</TextBlock>
 
        </Grid>
    </DockPanel>
</
Window>

Calculator

calculator.gif

I hope this will help you.

Categories

More Articles

© 2020 DotNetHeaven. All rights reserved.