gui in java. graphical user interface graphical user interface (gui) –gives program distinctive...

GUI in Java

Graphical User Interface

• Graphical User Interface (GUI)– Gives program distinctive “look” and “feel”– Provides users with basic level of familiarity

• User interacts with GUI component via mouse, keyboard, etc.

GUI in Java

• Java.awt– Abstract Window ToolKit– Was used with java1.1

• Java.Swing– Uses some of the classes of java.awt package– Part of Java Foundation Classes (JFC)

Creating a Window

• Window class in java.awt– Provides no border and title bar.

• JFrame class in java.swing– Provides title, border, and other facilities for a

window.

Subclasses of Component Class

Window Pane

• Window panes are container objects that represent an area of a window.

• They come in several different types.

• Defined in javax.swing package

Component Class

• Attributes– Position ( x and y with respect to the container component)– Name – Size (width and height)– Foreground color, background color– Font– Cursor– Enabled or not ( normal or grayed out)– Visible or not

Contd…

• Methods– setName(String)– isVisible(), isEnabled() (Boolean)– setVisible(), setEnabled()

Size and Position of a Component

• Position is represented by Point Object of java.awt.Point– point representing a location in (x, y)

coordinate space, specified in integer precision.

• Size by java.awt.Dimension– It has width and Height public members.

• Size and position together by java.awt.Rectangle

Methods for Size and Position

• With Dimension Class– Dimension getSize()– Dimension getSize(Dimension dim)

• With Point Class– Point getLocation()– Point getLocation(Point p)

• With Rectangle Class– Rectangle getBounds()– Rectangle getBounds(Rectangle rect)

Methods for Size and Position

Methods for Size and Position

Changing Size and Position of a Component

• Void setBounds( int x, int y, int width, int Height)

• Void setBounds( Rectangle rect)

• Void setSize(Dimension d)

• setLocation( int x, int y)

• setLocation( Point p)

Creating Window:Exampleimport javax.swing.JFrame;public class TryWindow {// The window objectstatic JFrame aWindow = new JFrame(“This is the Window Title”);public static void main(String[] args) {int windowWidth = 400; // Window width in pixelsint windowHeight = 150; // Window height in pixelsaWindow.setBounds(50, 100, // Set positionwindowWidth, windowHeight); // and sizeaWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);aWindow.setVisible(true); // Display the window}}

Creating Window: Example OUTPUT

Creating Window: Example OUTPUT

Creating Window: Example OUTPUT

Changing Size and Position of a Component

Variation in Size of a Component

ToolKit()

• Method of Component class

• getToolKit() returns an object of type ToolKit.

• It gives information about the environment in which application is running.

• E.g screen size in pixels

Example:NewWindowimport javax.swing.JFrame;

import java.awt.Toolkit;

import java.awt.Dimension;

public class TryWindow2 {

// The window object

static JFrame aWindow = new JFrame(“This is the Window Title”);

public static void main(String[] args) {

Toolkit theKit = aWindow.getToolkit(); // Get the window toolkit

Dimension wndSize = theKit.getScreenSize(); // Get screen size

// Set the position to screen center & size to half screen size

aWindow.setBounds(wndSize.width/4, wndSize.height/4, // Position

wndSize.width/2, wndSize.height/2); // Size

aWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

aWindow.setVisible(true); // Display the window

}

}

Visual Characteristics of Components

• void setBackground(Color aColor)

• Color getBackground()

• void setForeground(Color bColor)

• Color getForeground()

• void setCursor(Cursor aCursor)

• void setFont(Font aFont)

• Font getFont()

Methods Description

Defining Color

A screen color is represented by an object of class Color. You define a color value as a combination of the three primary colors: red, green, and blue. They are usually expressed in that sequence, and are oftenreferred to as RGB values.

Defining Color1. if you want the window in the previous example to have a pink

background, you could add the statement:aWindow.setBackground(Color.PINK);

2. When you have created a Color object, you can brighten or darken the color it represents by calling its brighter() or darker() methods by a predefined factor:thisColor.brighter(); // Brighten the colorthatColor.darker(); // Darken the color

3. To compare two Color objects you can use the equals() method. For example, to compare two colorsobjects colorA and colorB, you could write:if(colorA.equals(colorB)) {// Do something...}

Creating Cursors

• An object of the java.awt.Cursor class encapsulates a bitmap representation of the mouse cursor.

• Cursor myCursor = new Cursor(Cursor.TEXT_CURSOR);

Creating Cursors

Colors & Cursorsimport javax.swing.JFrame;import java.awt.Toolkit;import java.awt.Dimension;import java.awt.Color;import java.awt.Cursor;public class TryWindow4 {// The window objectstatic JFrame aWindow = new JFrame(“This is the Window Title”);public static void main(String[] args){Toolkit theKit = aWindow.getToolkit(); // Get the window toolkitDimension wndSize = theKit.getScreenSize(); // Get screen size// Set the position to screen center & size to half screen sizeaWindow.setBounds(wndSize.width/4, wndSize.height/4, // PositionwndSize.width/2, wndSize.height/2); // SizeaWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);aWindow.setCursor(Cursor.getPredefinedCursor(Cursor.CROSSHAIR_CURSOR));aWindow.getContentPane().setBackground(Color.PINK);aWindow.setVisible(true); // Display the window

}}

OUTPUT

Selecting Fonts

• Font myFont = new Font(“Serif”, Font.ITALIC, 12);• Font myFont = new Font(“Serif”, Font.ITALIC + Font.BOLD, 12);• GraphicsEnvironment e =

GraphicsEnvironment.getLocalGraphicsEnvironment(); Font[] fonts = e.getAllFonts();

Example: FontInfo

Swing ComponentsSwing Components

Component Description

JLabel Displays uneditable text or icons.

JTextField Enables user to enter data from the keyboard. Can also be used to display editable or uneditable text.

JButton Triggers an event when clicked with the mouse.

JCheckBox Specifies an option that can be selected or not selected.

JComboBox Provides a drop-down list of items from which the user can make a selection by clicking an item or possibly by typing into the box.

JList Provides a list of items from which the user can make a selection by clicking on any item in the list. Multiple elements can be selected.

JPanel Provides an area in which components can be placed and organized. Can also be used as a drawing area for graphics.

SwingComponents:Buttons

Creating a Swing Button & RadioButton & Label

Container content = aWindow.getContentPane();

JButton myButton=new JButton(“MyButton”);content.add(myButton);

JRadioButton myButton=new JRadioButton(“my radio button”);content.add(myButton);

JLabel Label = new JLabel("hiiiiiiiiiii"); content.add(Label);

Menus

• JMenuBar menuBar = new JMenuBar();frame.setJMenuBar(menuBar);

• JMenu fileMenu = new JMenu(“File”);menuBar.add(fileMenu);

• JMenuItem openMenu = new JMenuItem(“Open”);

• JCheckboxMenuItem circleItem = new JCheckboxMenuItem(“Circle”, true);

• JRadioButtonMenuItem item = new JRadioButtonMenuItem(“Curve”, true);fileMenu.add(openMenu);

Creating MenuBar, Adding Menu & MenuItems

Text Components

JPanel

• The JPanel class defines something like a physical panel that you can use as a container to group a set of components.

• JList Component

• JTable Component

Lay Out Managers

• A layout manager determines the way that components are arranged in a container.

• Layout manager for a container determines the position and size of all the components in the container.

• The classes that define layout managers all implement the LayoutManager interface

Flow Layout

• The flow layout manager places components in a row, and when the row is full, it automatically spills components onto the next row.

• Default position is centered.Container content = aWindow.getContentPane();

FlowLayout flow = new FlowLayout(); // Create a layout manager

content.setLayout(flow); // Set the container layout mgr

Layout Manager Heuristics

Left to right,Top to bottom

c

n

s

ew

FlowLayout GridLayout

BorderLayout

none, programmer sets x,y,w,h

null

One at a time

CardLayout GridBagLayout

JButton

FlowLayout

• It simply lays out components from left to right, starting new rows if necessary

GridLayout

• GridLayouts simply make a bunch of Components have equal size, displaying them in the requested number of rows and columns

LAB TASK 1

• Create a window

• Specify its bounds

• Specify its default close operation

• Specify its background color

• Specify its Cursor style

• Specify its layout

• Add 2 components

1. Button

2. RadioButton

LAB TASK 2

• Create a window

• Specify its bounds

• Specify its default close operation

• Specify its layout

• Add 6 buttons through for loop.

• Add 1 Label to it

LAB TASK 3

• Create a window

• Specify its bounds

• Specify its default close operation

• Add Menu Bar

• Add 2 menus

1. File

2. Elements

• Add 4 menu Items to File menu

New, Open, Close, Save

• Add 4 radio button menu Items to Elements menu

• Line, Rectangle, Circle, Curve

LAB TASK 4

Creating and Showing Frames Example

//1. Create the frame. JFrame frame = new JFrame("FrameDemo"); //2. Optional: What happens when the frame closes?frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //3. Create components and put them in the frame. //...create emptyLabel... frame.getContentPane().add(emptyLabel, BorderLayout.CENTER); //4. Size the frame. frame.pack(); //5. Show it. frame.setVisible(true);

Creating and Showing Frames Example

import java.awt.*; import javax.swing.*; public class H{ private static void createAndShowGUI() { JFrame frame = new JFrame("FrameDemo");frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JLabel emptyLabel = new JLabel("hiiiiiiiiiii"); emptyLabel.setPreferredSize(new Dimension(175, 100));frame.getContentPane().add(emptyLabel,BorderLayout.CENTE

R); frame.pack(); frame.setVisible(true); } public static void main(String[] args) { createAndShowGUI(); } }