+ All Categories
Home > Documents > 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...

Date post: 03-Jan-2016
Category:
Upload: deborah-allison
View: 235 times
Download: 0 times
Share this document with a friend
52
GUI in Java
Transcript
Page 1: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

GUI in Java

Page 2: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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.

Page 3: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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)

Page 4: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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.

Page 5: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.
Page 6: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Subclasses of Component Class

Page 7: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.
Page 8: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 9: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 10: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Contd…

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

Page 11: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 12: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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)

Page 13: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Methods for Size and Position

Page 14: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Methods for Size and Position

Page 15: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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)

Page 16: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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}}

Page 17: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Creating Window: Example OUTPUT

Page 18: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Creating Window: Example OUTPUT

Page 19: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Creating Window: Example OUTPUT

Page 20: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Changing Size and Position of a Component

Page 21: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Variation in Size of a Component

Page 22: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 23: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

}

}

Page 24: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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()

Page 25: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Methods Description

Page 26: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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.

Page 27: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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...}

Page 28: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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);

Page 29: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Creating Cursors

Page 30: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

}}

Page 31: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

OUTPUT

Page 32: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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();

Page 33: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Example: FontInfo

Page 34: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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.

Page 35: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

SwingComponents:Buttons

Page 36: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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);

Page 37: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Menus

Page 38: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

• 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

Page 39: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

Text Components

Page 40: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 41: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 42: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 43: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 44: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

FlowLayout

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

Page 45: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

GridLayout

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

Page 46: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.
Page 47: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 48: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 49: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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

Page 50: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

LAB TASK 4

Page 51: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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);

Page 52: GUI in Java. Graphical User Interface Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides users with basic level of.

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(); } }


Recommended