Image rotation using Graphical User Interface

Graphical User Interface

What is GUI?
A graphical user interface (GUI) is a graphical display in one or more windows containing
controls, called components, that enable a user to perform interactive tasks. The user of the GUI
does not have to create a script or type commands at the command line to accomplish the tasks.
Unlike coding programs to accomplish tasks, the user of a GUI need not understand the details of
how the tasks are performed.
GUI components can include menus, toolbars, push buttons, radio buttons, list boxes, and sliders
just to name a few. GUIs created using MATLAB tools can also perform any type of
computation, read and write data files, communicate with other GUIs, and display data as tables
or as plots.
The following figure illustrates a simple GUI that you can easily build yourself.

The GUI contains

An axes component

A pop-up menu listing three data sets that correspond to MATLAB functions: peaks,
membrane, and sinc

A static text component to label the pop-up menu

Three buttons that provide different kinds of plots: surface, mesh, and contour

When you click a push button, the axes component displays the selected data set using the
specified type of 3-D plot.

How Does a GUI Work?

In the GUI described in What Is a GUI?, the user selects a data set from the pop-up menu, then
clicks one of the plot type buttons. The mouse click invokes a function that plots the selected
data in the axes.
Most GUIs wait for their user to manipulate a control, and then respond to each action in turn.
Each control, and the GUI itself, has one or more user-written routines (executable MATLAB
code) known as callbacks, named for the fact that they "call back" to MATLAB to ask it to do
things. The execution of each callback is triggered by a particular user action such as pressing a
screen button, clicking a mouse button, selecting a menu item, typing a string or a numeric value,
or passing the cursor over a component. The GUI then responds to these events. You, as the
creator of the GUI, provide callbacks which define what the components do to handle events.
This kind of programming is often referred to as event-driven programming. In the example, a
button click is one such event. In event-driven programming, callback execution is
asynchronous, that is, it is triggered by events external to the software. In the case of MATLAB
GUIs, most events are user interactions with the GUI, but the GUI can respond to other kinds of
events as well, for example, the creation of a file or connecting a device to the computer.
You can code callbacks in two distinct ways:

As MATLAB language functions stored in files

As strings containing MATLAB expressions or commands (such as 'c = sqrt(a*a +

b*b);'or 'print')

Using functions stored in code files as callbacks is preferable to using strings, as functions have
access to arguments and are more powerful and flexible. MATLAB scripts (sequences of
statements stored in code files that do not define functions) cannot be used as callbacks.

Although you can provide a callback with certain data and make it do anything you want, you
cannot control when callbacks will execute. That is, when your GUI is being used, you have no
control over the sequence of events that trigger particular callbacks or what other callbacks might
still be running at those times. This distinguishes event-driven programming from other types of
control flow, for example, processing sequential data files.

Ways to bulid GUI

You can build MATLAB GUIs in two ways:

Use GUIDE (GUI Development Environment), an interactive GUI construction kit.

Create code files that generate GUIs as functions or scripts (programmatic GUI
construction).

Creating a MATLAB GUI Interactively

GUIDE (GUI development environment) provides tools for designing user interfaces for custom
apps. Using the GUIDE Layout Editor, you can graphically design your UI. GUIDE then
automatically generates the MATLAB code for constructing the UI, which you can modify to
program the behavior of your app.
Creating a MATLAB GUI Programmatically

For more control over design and development, you can also create MATLAB code that defines
all component properties and behaviors. MATLAB contains built-in functionality to help you
create the GUI for your app programmatically. You can add dialog boxes, user interface controls
(such as push buttons and sliders), and containers (such as panels and button groups).

Image rotation

In this project, image can be rotated 90, 180, 270 degrees using GUI function tabs and one
additional feature of converting the image to black and white. We can also save the image after
rotation at any location by giving any suitable name to the file.
The image can be rotated based on some logic that will change the matrix of an original image
to other matrix as the desired image after rotation. The nex matrix values are then used to display

the rotated image. This all happens in the background of GUI. You just need to click the buttons
on the GUI to get the desired result.

Detailed Explanation of image rotation

1) 90 degrees Rotation
To rotate an image by 90 degrees and to understand the concept behind the rotation, We assume
that the original image that is loaded is of 5x6 matrix. Let the name of the matrix be A with
a
elements of matrix denoted by small letters mn where m represents the row of the matrix and
n denotes the column of the matrix. The general matrix is written below.

A=
a11

a1 2

a1 3

a1 4

a1 5

a1 6

a21

a22

a23

a24

a25

a26

a31

a32

a33

a34

a35

a36

a 41

a 42

a 43

a 44

a 45

a46

a51

a52

a53

a54

a55

a56

The matrix of original image has 5 rows and 6 columns. Here rotating 90 degrees means rotating
the image anticlockwise by 90 degrees. When we rotate the image by 90 degree the new matrix
of the image obtained after rotation will be of 6 rows and 5 columns. It will look like as follows:

B=
a16

a26

a36

a 46

a56

a15

a55

a14

..

a54

a13

..

a53

a12

..

a52

a11

..

..

a51

The matrix formed above shows the position of different elements with respect to the original
image. Writing the logic for same that will place the elements according to the new matrix B will
rotate the image by 90 degrees.

2) Rotating image by 180

Similarly the new matrix from the original image after rotating 180 can be shown as below:
C=
a56
.
..

a16

a5 5
.
.

.
.
.
.

.
.

a52
..

a51
.

.
a11

3) Rotating image by 270

Similarly the new matrix from the original image after rotating 270 can be shown as below:
D=
a51

a11

a56

a16