lesson 4:

Fundamentals
of
GUI DESIGN
What is a Graphical User Interface (GUI)?

A Graphical User Interface (GUI) is a visual way for

users to interact with software applications using
graphical elements like windows, buttons, menus, and
icons, rather than text-based commands.
Importance of GUI in Software Applications

Provides a user-friendly experience

Reduces the learning curve for users
Enhances productivity and efficiency
Makes applications more visually appealing and
interactive
How OOP Principles Influence GUI Design

Encapsulation: UI components (buttons, text fields) are objects

with their own properties and methods.
Inheritance: Common UI components can be reused and
extended (e.g., subclassing a button).
Polymorphism: UI elements can behave differently based on
user interaction.
Event-Driven Programming: GUI applications respond to user
actions like clicks and key presses through event handling.
Key Principles of GUI Design

Consistency (Uniform layout and behavior)

Simplicity (User-friendly and intuitive design)

Feedback (Visual/audio responses to user actions)

Accessibility (Making the interface usable for all)

Error Handling (Preventing and guiding user errors)

HTML BASIC
Java can be integrated with HTML to
create dynamic web applications
using JavaFx.
basic JavaFX structure
Java for Web-Based GUI Development
Java is widely used for web applications, where HTML is the
foundation of the front-end GUI. While Java powers the Logic
and Interactivity behind the scenes.

Java technologies like Servlets, JSP (JavaServer Pages), and

Spring Boot generate dynamic HTML content for user interfaces.

Web-based Java GUIs follow an MVC (Model-View-Controller)

design, where HTML (View) interacts with Java (Model &
Controller).
AWT GRAPHICAL
COMPONENTS
what is awt?
AWT (Abstract Window Toolkit) is Java’s built-in GUI library for creating
graphical user interfaces.

It provides basic UI components like windows, buttons, labels, and text

fields.

Uses native OS components, making it lightweight but less flexible

compared to Swing and JavaFX.

Introduced in Java 1.0, but still used in some applications.

features of awt
Platform-dependent (uses native UI components of the
operating system).

Event-driven programming model (user interactions trigger

events).

Lightweight but lacks advanced customization.

Limited UI components compared to Swing and JavaFX.

Awt graphical components
Awt graphical components
Awt graphical components
 Simple AWT Example: A Window
with a Button and Label

Creates a Frame (main window).

Adds a Label to display text.

Adds a Button and sets its position

using setBounds(x, y, width, height).

Handles button click event → Updates

label text when clicked.
 Simple AWT Example: A Window
with a Button and Label

setVisible(true) makes the window

visible.

WindowAdapter closes the window

properly when the user clicks the
close button.
Simple AWT Example: A Window
with a Button and Label
Now, Let's draw!
paint component
paintComponent() is a method in Swing (part of Java's GUI toolkit)
that allows you to customize the rendering of graphical content within
a component, such as JPanel. It is used to draw shapes, images, or
text on the component.

Purpose: To override the default painting behavior and create custom

visualizations.
How it works: You override paintComponent(Graphics g) in a Swing
component (like JPanel) to use the Graphics object to draw.
Common uses: Drawing shapes, handling custom UI elements,
creating interactive graphics, and more.
commonly used graphics method
1. drawLine(int x1, int y1, int x2, int y2)
Draws a line from point (x1, y1) to (x2, y2).

2. drawRect(int x, int y, int width, int height)

Draws the outline of a rectangle.
x, y: Top-left corner of the rectangle.
width, height: Size of the rectangle.

3. fillRect(int x, int, y, int width, int height)

Draws a filled Rectangle
Same parameters as drawRect
commonly used graphics method
4. drawOval(int x, int y, int width, int height)
Draws the outline of an oval inside a bounding rectangle.
x, y: Top-left corner of the bounding rectangle.
width, height: Size of the bounding rectangle.

5. fillOval(int x, int y, int width, int height)

Draws a filled oval.
Same parameters as drawOval.

6. drawString(String str, int x, int y)

Draws text on the panel
str: the text to draw
x,y: the baseline start point of the text
commonly used graphics method
7.setColor(Color c)
sets the current drawing color

8. setFont(Font font)
sets the font used when drawing text

9. drawArc(int x, int y, int width, int height, int startAngle, int arcAngle)
Draws a curved arc (part of an oval).
x, y: Top-left corner of bounding rectangle.
width, height: Size of bounding rectangle.
startAngle: Where the arc begins (in degrees).
arcAngle: How far the arc extends (in degrees).
Blue rectangle
red oval
green line
Magenta filled circle
red arc
ArcExample
Positioning: adjusting the x and y
 advantages of awt Disadvantages of awt
✅ Simple and easy to use for ❌ UI appearance differs across
small applications. operating systems.

✅ Uses native OS components, ❌ Limited components (no

making it lightweight. modern UI elements).

✅ Requires less memory ❌ Not ideal for complex or

compared to Swing or JavaFX. highly customized applications.
 Java applet &
applet activities
What is java applet?
A Java Applet is a small Java program that runs inside a web
browser.

It is a GUI-based application embedded in an HTML page.

Uses the Applet class from java.applet and java.awt for graphical
components.

Originally used for interactive web applications, but is now

deprecated due to security concerns.
Key features of applet

Runs inside a web browser (or an AppletViewer).

Does not require a main() method (executed inside the browser).

Cannot access local system resources for security reasons.

Uses event-driven programming (mouse clicks, keyboard input).

Applet event handling example (button click)

1. init() → Creates a button and adds an

action listener.

2. actionPerformed() → Changes the

message when the button is clicked.

3. paint(Graphics g) → Displays the

updated message on the screen.
Applet event handling example (button click)

hehehehehehehehehehehehhe
 applet life cycle methods
1. init() – Called once when the 5. destroy() – Called once when the
applet is first loaded; used for applet is closed or removed, used to
initialization. free up resources (e.g., closing
2. start() – Called after init() and connections).
whenever the applet is restarted 6. repaint() – A method that triggers
(e.g., when the user revisits the page). the paint() method to refresh the UI
3. paint(Graphics g) – Called (e.g., after an event like a button
whenever the applet needs to be click).
redrawn, such as after resizing or 7. update(Graphics g) – Called before
updating content. paint() to clear the screen; can be
4. stop() – Called when the applet is overridden for custom behavior.
paused, such as when the user
navigates away from the page.
 advantages of applet Disadvantages of applet
✅ Runs directly in a web ❌ Deprecated in modern Java
browser (no need for (not supported in new browsers).
installation).
❌ Security restrictions limit file
✅ Platform-independent (runs access and system interaction.
on any system with Java
support). ❌ Requires Java Plugin, which is
no longer available in most
✅ Supports interactive graphics browsers.
and animations.
Event & exception
handling
What is event handling?

Event handling allows a Java program to respond to user

interactions like button clicks, mouse movements, or
keyboard input.

Uses the event-driven programming model, where user

actions trigger events.

Implemented using event listeners and event handlers.

Key components of event handling

1. Event Source – The component that generates an event

(e.g., a button).

2. Event Object – Contains information about the event

(e.g., ActionEvent).

3. Event Listener – A special interface that waits for events

and responds when triggered.
 event handling example

Implements ActionListener to handle

button clicks.

Registers an event listener using

btn.addActionListener(this).

Handles events in
actionPerformed(ActionEvent e),
which prints "Button Clicked!" when
clicked.
hshshshshshsshh

ehheehhehe
What is exception handling?

Exception handling prevents program crashes

by catching and handling errors during
execution.

Uses try, catch, finally, and throw statements.

exception handling example
try block – Contains the risky
code (10 / 0).

catch block – Catches the

ArithmeticException and
prevents a crash.

finally block – Always runs,

even if an exception occurs.
Anonymous class
what is anonymous class?

An anonymous class is a class without a name,

declared and instantiated in a single expression.

Often used when a class is needed only once (e.g.,

event handling).

Provides a concise way to create small, one-time-

use classes.
why use anonymous classes?

✅ Reduces the need for separate class files.

✅ Makes the code more readable and compact.
✅ Useful for event handling and callbacks in GUI
applications
when to use anonymous classes?

For one-time-use classes (e.g., event listeners).

To simplify code when defining small classes.

When subclassing existing classes or

implementing interfaces.
anonymous class example
That's all for lesson 4