This video shows the steps to design a calculator in MATLAB App Designer. In this video it shows how you can design 2 types of calculator in the same GUI (Basic and Advance). You can toggle the visibility of the buttons by setting the visible flag of the uibutton in the App Designer.
We will be glad to hear from you regarding any query, suggestions or appreciations at: programmerworld1990@gmail.com
Source code:
classdef myCalculator < matlab.apps.AppBase
% Properties that correspond to app components
properties (Access = public)
UIFigure matlab.ui.Figure
TextArea matlab.ui.control.TextArea
Button matlab.ui.control.Button
Button_2 matlab.ui.control.Button
Button_3 matlab.ui.control.Button
Button_4 matlab.ui.control.Button
Button_5 matlab.ui.control.Button
Button_6 matlab.ui.control.Button
Button_7 matlab.ui.control.Button
Button_8 matlab.ui.control.Button
Button_9 matlab.ui.control.Button
Button_10 matlab.ui.control.Button
ClearButton matlab.ui.control.Button
Button_12 matlab.ui.control.Button
Button_13 matlab.ui.control.Button
Button_14 matlab.ui.control.Button
SineButton matlab.ui.control.Button
CosineButton matlab.ui.control.Button
BasicButton matlab.ui.control.Button
end% Callbacks that handle component events
methods (Access = private)% Button pushed function: Button, Button_10, Button_12,
% Button_13, Button_2, Button_3, Button_4, Button_5,
% Button_6, Button_7, Button_8, Button_9
function buttonPressed(app, event)
app.TextArea.Value = [app.TextArea.Value{1} event.Source.Text];
end% Button pushed function: ClearButton
function buttonClear(app, event)
app.TextArea.Value = ”;
end% Button pushed function: Button_14
function buttonEqual(app, event)
try
app.TextArea.Value = [app.TextArea.Value{1} event.Source.Text …
num2str(eval(app.TextArea.Value{1}))];
catch
app.TextArea.Value = ‘Error!’;
end
end% Button pushed function: BasicButton
function BasicButtonPushed(app, event)
switch(app.BasicButton.Text)
case ‘Basic’
app.BasicButton.Text = ‘Advance’;
app.SineButton.Visible = ‘off’;
app.CosineButton.Visible = ‘off’;case ‘Advance’
app.BasicButton.Text = ‘Basic’;
app.SineButton.Visible = ‘on’;
app.CosineButton.Visible = ‘on’;
endend
% Button pushed function: SineButton
function SineButtonPushed(app, event)
app.TextArea.Value = num2str(sin(str2double(app.TextArea.Value{1})));
end% Button pushed function: CosineButton
function CosineButtonPushed(app, event)
app.TextArea.Value = num2str(cos(str2double(app.TextArea.Value{1})));
end
end% Component initialization
methods (Access = private)% Create UIFigure and components
function createComponents(app)% Create UIFigure and hide until all components are created
app.UIFigure = uifigure(‘Visible’, ‘off’);
app.UIFigure.Position = [100 100 640 480];
app.UIFigure.Name = ‘UI Figure’;% Create TextArea
app.TextArea = uitextarea(app.UIFigure);
app.TextArea.HorizontalAlignment = ‘right’;
app.TextArea.FontSize = 36;
app.TextArea.FontWeight = ‘bold’;
app.TextArea.Position = [24 382 596 49];
app.TextArea.Value = {‘0’};% Create Button
app.Button = uibutton(app.UIFigure, ‘push’);
app.Button.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button.Position = [24 305 100 22];
app.Button.Text = ‘1’;% Create Button_2
app.Button_2 = uibutton(app.UIFigure, ‘push’);
app.Button_2.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_2.Position = [143 305 100 22];
app.Button_2.Text = ‘2’;% Create Button_3
app.Button_3 = uibutton(app.UIFigure, ‘push’);
app.Button_3.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_3.Position = [259 305 100 22];
app.Button_3.Text = ‘3’;% Create Button_4
app.Button_4 = uibutton(app.UIFigure, ‘push’);
app.Button_4.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_4.Position = [24 259 100 22];
app.Button_4.Text = ‘4’;% Create Button_5
app.Button_5 = uibutton(app.UIFigure, ‘push’);
app.Button_5.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_5.Position = [143 259 100 22];
app.Button_5.Text = ‘5’;% Create Button_6
app.Button_6 = uibutton(app.UIFigure, ‘push’);
app.Button_6.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_6.Position = [259 259 100 22];
app.Button_6.Text = ‘6’;% Create Button_7
app.Button_7 = uibutton(app.UIFigure, ‘push’);
app.Button_7.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_7.Position = [259 216 100 22];
app.Button_7.Text = ‘7’;% Create Button_8
app.Button_8 = uibutton(app.UIFigure, ‘push’);
app.Button_8.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_8.Position = [143 216 100 22];
app.Button_8.Text = ‘8’;% Create Button_9
app.Button_9 = uibutton(app.UIFigure, ‘push’);
app.Button_9.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_9.Position = [24 216 100 22];
app.Button_9.Text = ‘9’;% Create Button_10
app.Button_10 = uibutton(app.UIFigure, ‘push’);
app.Button_10.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_10.Position = [143 164 100 22];
app.Button_10.Text = ‘0’;% Create ClearButton
app.ClearButton = uibutton(app.UIFigure, ‘push’);
app.ClearButton.ButtonPushedFcn = createCallbackFcn(app, @buttonClear, true);
app.ClearButton.Position = [418 305 100 22];
app.ClearButton.Text = ‘Clear’;% Create Button_12
app.Button_12 = uibutton(app.UIFigure, ‘push’);
app.Button_12.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_12.Position = [418 259 100 22];
app.Button_12.Text = ‘+’;% Create Button_13
app.Button_13 = uibutton(app.UIFigure, ‘push’);
app.Button_13.ButtonPushedFcn = createCallbackFcn(app, @buttonPressed, true);
app.Button_13.Position = [418 216 100 22];
app.Button_13.Text = ‘-‘;% Create Button_14
app.Button_14 = uibutton(app.UIFigure, ‘push’);
app.Button_14.ButtonPushedFcn = createCallbackFcn(app, @buttonEqual, true);
app.Button_14.Position = [418 164 100 22];
app.Button_14.Text = ‘=’;% Create SineButton
app.SineButton = uibutton(app.UIFigure, ‘push’);
app.SineButton.ButtonPushedFcn = createCallbackFcn(app, @SineButtonPushed, true);
app.SineButton.Position = [44 67 100 22];
app.SineButton.Text = ‘Sine’;% Create CosineButton
app.CosineButton = uibutton(app.UIFigure, ‘push’);
app.CosineButton.ButtonPushedFcn = createCallbackFcn(app, @CosineButtonPushed, true);
app.CosineButton.Position = [196 67 100 22];
app.CosineButton.Text = ‘Cosine’;% Create BasicButton
app.BasicButton = uibutton(app.UIFigure, ‘push’);
app.BasicButton.ButtonPushedFcn = createCallbackFcn(app, @BasicButtonPushed, true);
app.BasicButton.Position = [505 342 100 22];
app.BasicButton.Text = ‘Basic’;% Show the figure after all components are created
app.UIFigure.Visible = ‘on’;
end
end% App creation and deletion
methods (Access = public)% Construct app
function app = myCalculator% Create UIFigure and components
createComponents(app)% Register the app with App Designer
registerApp(app, app.UIFigure)if nargout == 0
clear app
end
end% Code that executes before app deletion
function delete(app)% Delete UIFigure when app is deleted
delete(app.UIFigure)
end
end
end