Design a simple Casino type Game in MATLAB using App Designer with Gauge and Spinner

This video shows the steps to create a simple casino type game in MATLAB using App designer. GUI is created using App Gauge and Spinner and labels to mark the winning terms.

Towards the end of this video it shows how to package the App Designer code in an application package (installer) or matlab app which can be shared with friends or colleagues.

[Source Code]

classdef Casino_Game < matlab.apps.AppBase

% Properties that correspond to app components
properties (Access = public)
UIFigure matlab.ui.Figure
Gauge matlab.ui.control.Gauge
GONELabel matlab.ui.control.Label
SAVEDUFFFLabel matlab.ui.control.Label
JUSTOKLabel matlab.ui.control.Label
BONUSLabel matlab.ui.control.Label
WOWJACKPOTLabel matlab.ui.control.Label
PLAYButton matlab.ui.control.Button
Spinner matlab.ui.control.Spinner
end

% Callbacks that handle component events
methods (Access = private)

% Button pushed function: PLAYButton
function PLAYButtonPushed(app, event)

for i = 1:20
pause(0.5);
r = randi([-100 100]);
app.Gauge.Value = r;
app.Spinner.Value = r;
end

app.Gauge.BackgroundColor = [1, 0, 0]; % RED Color
pause(1);
app.Gauge.BackgroundColor = [0, 1, 0]; % GREEN Color
pause(1);
app.Gauge.BackgroundColor = [0, 0, 1]; % BLUE Color
pause(1);
app.Gauge.BackgroundColor = [1, 1, 1]; % Default Color

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 Gauge
app.Gauge = uigauge(app.UIFigure, ‘circular’);
app.Gauge.Limits = [-100 100];
app.Gauge.ScaleColors = [0 1 0;0 1 1;1 1 0;0.929411764705882 0.690196078431373 0.129411764705882;1 0 0];
app.Gauge.ScaleColorLimits = [60 100;20 60;-20 20;-60 -20;-100 -60];
app.Gauge.MinorTicks = [];
app.Gauge.FontColor = [1 1 1];
app.Gauge.Position = [168 88 306 306];

% Create GONELabel
app.GONELabel = uilabel(app.UIFigure);
app.GONELabel.HorizontalAlignment = ‘center’;
app.GONELabel.FontSize = 22;
app.GONELabel.Position = [84 134 95 29];
app.GONELabel.Text = ‘GONE !!!’;

% Create SAVEDUFFFLabel
app.SAVEDUFFFLabel = uilabel(app.UIFigure);
app.SAVEDUFFFLabel.HorizontalAlignment = ‘center’;
app.SAVEDUFFFLabel.FontSize = 22;
app.SAVEDUFFFLabel.Position = [1 295 184 29];
app.SAVEDUFFFLabel.Text = ‘SAVED … UFFF!!!’;

% Create JUSTOKLabel
app.JUSTOKLabel = uilabel(app.UIFigure);
app.JUSTOKLabel.HorizontalAlignment = ‘center’;
app.JUSTOKLabel.FontSize = 22;
app.JUSTOKLabel.Position = [255 409 147 29];
app.JUSTOKLabel.Text = ‘JUST … OK !!!’;

% Create BONUSLabel
app.BONUSLabel = uilabel(app.UIFigure);
app.BONUSLabel.HorizontalAlignment = ‘center’;
app.BONUSLabel.FontSize = 22;
app.BONUSLabel.Position = [485 334 108 29];
app.BONUSLabel.Text = ‘BONUS !!!’;

% Create WOWJACKPOTLabel
app.WOWJACKPOTLabel = uilabel(app.UIFigure);
app.WOWJACKPOTLabel.HorizontalAlignment = ‘center’;
app.WOWJACKPOTLabel.FontSize = 22;
app.WOWJACKPOTLabel.Position = [426 115 215 29];
app.WOWJACKPOTLabel.Text = ‘WOW … JACKPOT!!!’;

% Create PLAYButton
app.PLAYButton = uibutton(app.UIFigure, ‘push’);
app.PLAYButton.ButtonPushedFcn = createCallbackFcn(app, @PLAYButtonPushed, true);
app.PLAYButton.FontSize = 24;
app.PLAYButton.FontWeight = ‘bold’;
app.PLAYButton.Position = [14 409 108 50];
app.PLAYButton.Text = ‘PLAY’;

% Create Spinner
app.Spinner = uispinner(app.UIFigure);
app.Spinner.HorizontalAlignment = ‘center’;
app.Spinner.FontSize = 36;
app.Spinner.FontWeight = ‘bold’;
app.Spinner.Enable = ‘off’;
app.Spinner.Position = [255 15 159 49];

% 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 = Casino_Game

% 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

YouTube top comments/ posts

How to use table in matlab app (GUI) to enter value and execute and show result in figure or in another table. It means one table to enter initial values and another table to show result
I don’t think there is in-built table provided in App Designer. What you can do is insert series of Text Area or Edit Boxes in your Design. And in the value change callback write your code to read and display the values in the respective object of the figure.

We will be glad to hear from you regarding any query, suggestions or appreciations at: programmerworld1990@gmail.com

2 comments

Leave a Reply