Abstract windowing toolkit
This presentation is the property of its rightful owner.
Sponsored Links
1 / 28

Abstract Windowing Toolkit PowerPoint PPT Presentation


  • 101 Views
  • Uploaded on
  • Presentation posted in: General

Abstract Windowing Toolkit. Design Goal: allow the programmer to build o GUI that looks good on all platforms

Download Presentation

Abstract Windowing Toolkit

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Abstract windowing toolkit

Abstract Windowing Toolkit

  • Design Goal:

    • allow the programmer to build o GUI that looks good on all platforms

    • provide a well-designed object-oriented interface to low-level services and resources (tracking the mouse, reading the keyboard, writing to the screen etc.) so programmers don't have to worry about the details

  • The user interface elements provided by the AWT are implemented using each platform's native GUI toolkit, thereby preserving the look and feel of each platform.


Abstract windowing toolkit1

Abstract Windowing Toolkit

  • java.awt

    • Graphics

      • colors, images, fonts, polygons, e.t.c.

    • Components

      • GUI (graphical user interface) components (buttons, menus, lists, dialog boxes)

    • Layout Managers

      • classes which control the layout of components within their container objects

  • java.awt.datatransfer (classes for cut-and-paste)

  • java.awt.event (classes for event handling)

  • java.awt.image (classes for image manipulation)


Inheritance relationship between the user interface component classes

Inheritance relationship between the user interface component classes


Component classes detailed

Component classes (detailed)


The basic awt components

The basic awt components


Basic applet

Basic Applet

import java.awt.*;

import java.applet.*;

public class Example1 extends Applet {

public void paint(Graphics g) {

g.drawString("First applet", 10, 10);

}

}


Html code that contains the applet

HTML Code that contains the applet

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

<HTML>

<HEAD>

<TITLE>Applet Test Page</TITLE>

</HEAD>

<h1>Applet Test Page</h1>

<applet

code="Example1.class"

width=400

height=400

name="Applet1">

</applet>

</BODY>

</HTML>


Another example

Another Example

import java.awt.*;

import java.applet.*;

public class Example2 extends Applet {

Button

b1 = new Button("Button 1"),

b2 = new Button("Button 2");

public void init() {

add(b1);

add(b2);

}

}


How awt components draw themselves

How AWT components draw themselves

  • programs can draw only when AWT tells them to

  • AWT orders drawing requests by making them run in a single thread

  • AWT orders a component to draw itself by invoking its update() method

  • The default implementation of the update() method clears the Component’s background and then calls the paint() method

  • The default implementation of the paint() method does nothing

  • AWT can call the paint() method directly (e.g. when an area of a Component is revealed after being hidden behind an other window)

  • a Graphics object is the only argument of paint() and update()

    • represents the context in which the component can perform its drawing

  • The Graphics class provide methods for drawing and filling lines, rectangles e.t.c., images, text, for setting and getting colors and fonts e.t.c.


Creating the components of a simple editor a the menus

Creating the components of a simple editor (a) The Menus

  • Create a new class which extends the Frame class

    • public class SimpleEditor extends Frame{ . . . }

      In the Constructor

  • Create a MenuBar object

    • MenuBar menubar = new MenuBar();this.setMenuBar(menubar); // this refers to the Frame object

  • Create and add the Menu objects (File) to the menu bar

    • Menu file = new Menu(‘’File’’);menubar.add(file);

  • Create and add the MenuItem objects to the Menu containers (Open, New, Save, Save as, Exit)

    • MenuItem open = new MenuItem(‘’Open’’);file.add(open);


Creating the components of a simple editor b the panel

Creating the components of a simple editor (b) The Panel

  • Create a new TextArea object and add it to the scroll pane

    • TextArea textArea = new TextArea();pane.add(textArea);

  • Set the frame size and pop it up

    • this.setSize(300, 300);

    • this.pack();

    • this.show();


Java awt event events listeners adapters

java.awt.event - Events, Listeners, Adapters

  • Events

    • represent event occurrences

    • java.awt.AWTEvent is the superclass of all the awt events

    • ActionEvent, TextEvent, MouseEvent, KeyEvent e.t.c.

  • Listeners

    • extend the java.util.EventListener interface

    • provide methods that handle events

    • ActionListener, TextListener, MouseListener, KeyListener e.t.c.

  • Adapters

    • implement the corresponding listener, providing empty bodies for all the methods of it (it is useful when we don’ t want to implement all the methods of a listener).

    • MouseAdapter, KeyAdapter e.t.c.


Example with events

Example withEvents

import java.awt.*;

import java.awt.event.*; // Must add this

import java.applet.*;

public class Example5 extends Applet {

Button

b1 = new Button("Button 1"),

b2 = new Button("Button 2");

public void init() {

b1.addActionListener(new B1());

b2.addActionListener(new B2());

add(b1);

add(b2);

}

class B1 implements ActionListener {

public void actionPerformed(ActionEvent e) {

getAppletContext().showStatus("Button 1");

}

}

class B2 implements ActionListener {

public void actionPerformed(ActionEvent e) {

getAppletContext().showStatus("Button 2");

}

}

}


Adding events to our editor

Adding events to our editor

  • Opening a document

    • open.addActionListener(new ActionListener(){ public void actionPerformed(ActionEvent e) { openDocument(); }});

  • Saving a document

    • save.addActionListener(new ActionListener(){ public void actionPerformed(ActionEvent e) { saveDocument(); }});

  • Handling window close requests

    • this.addWindowListener(new WindowAdapter(){ public void windowClosing(WindowEvent e){ System.exit(0); }});


Opening a file file dialogs

Opening a file - File Dialogs

displaying an open file dialog

FileDialog dialog = new FileDialog(this, "Select a file", FileDialog.LOAD);

dialog.show();

if(dialog.getFile() == null) return;

filename = dialog.getDirectory() + File.separator + dialog.getFile();

to display a save file dialog

FileDialog dialog = new FileDialog(this, "Select a file", FileDialog.SAVE);

dialog.show();


Layout managers

Layout Managers

  • A Layout Manager is an object that controls the position and the size of components in a container

  • Every layout manager implements the LayoutManager interface

  • By default, every Container has a layout manager object that controls its layout

    • for Panel objects: instances of the FlowLayout class

    • for Window objects: instances of the BorderLayout class

  • There are five layout manager classes in AWT

    • FlowLayout

    • GridLayout

    • BorderLayout

    • CardLayout

    • GridBagLayout


Borderlayout

BorderLayout

  • It’s the default layout manager for all Windows (Frames, Dialogs, e.t.c.)

  • the layout is divided into five areas: North, South, East, West and Center

  • Using BorderLayout

    • setLayout(new BorderLayout());add(“North”, new Button(“North”));add(“South”, new Button(“South”));add(“East”, new Button(“East”));add(“West”, new Button(“West”));add(“Center”, new Button(“Center”));

  • to insert gaps between the components we use the following constructor:

    • public BorderLayout(int horizontalGap, int verticalGap)


Flowlayout

FlowLayout

  • It’s the default layout manager for all Panels

  • It simply lays out components (at their preferred size) from left to right, starting new rows if there is not enough space

    • setLayout(new FlowLayout);add(new Button(«This is a long-named button»));add(new Button(«Hello»));

  • Within each row the components are centered (by default), left-aligned or right-aligned

  • Constructors

    • public FlowLayout()

    • public FlowLayout(int alignment)

    • public FlowLayout(int alignment, int horizontalGap, verticalGap)

    • alignment: FlowLayout.LEFT, FlowLayout.RIGHT, FlowLayout.CENTER


Gridlayout

GridLayout

  • Arranges components into a grid of rows and columns

  • The cells are equal size based on the largest component in the grid

  • Adding components

    • setLayout(new GridLayout(0,2));//construct a GridLayout with two //columns and unspecified number of rowsadd(new Button(“Button 1”));add(new Button(“2”));add(new Button(“Button 3”));add(new Button(“Long-Named Button 4”));add(new Button(“Button 5”));

  • At least one of the rows and columns must be non-zero


Cardlayout

CardLayout

  • Helps to manage two or more components that share the same display space.

  • Adding componentsPanel cards = new Panel();cards.setLayout(new CardLayout());...//Create a Panel named p1. Put buttons in it....//Create a Panel named p2. Put a text field in it.cards.add("Panel with Buttons", p1);cards.add("Panel with TextField", p2);

  • Showing its components((CardLayout)cards.getLayout()).show(cards, “Panel with Buttons”);

  • Choosing a componentpublic void first(Container panel)public void next(Container panel)public void previous(Container panel)public void last(Container panel)public void show(Container panel, String name)


Gridbaglayout

GridBagLayout

  • The most flexible and complex layout manager

  • Places components in a grid of rows and columns

  • the applet specifies the size and position characteristics of its components is by by means of GridBagConstraints

  • GridBagLayout gridbag = new GridBagLayout();GridBagConstraints c = new GridBagConstraints();setLayout(gridbag);//...Create the component...//...Set instance variables in the GridBagConstraints instance... gridbag.setConstraints(theComponent, c);add(theComponent);


Gridbagconstraints instance variables

GridBagConstraints instance variables

  • gridx, gridy : Specify the column and row of the upper left of the component

  • gridwidth, gridheight : Specify the number of columns or rows in the component's display area

  • fill : how to resize the component when its display size is larger than its requested size

  • ipadx, ipady : how many pixels to add to the minimum size of the component

  • insets : the minimum amount of space between the component and the edges of its display area

  • anchor : where to place the component when it’s smaller than its display area

  • weightx, weighty : how to distribute space among columns (weightx) and among rows (weighty)


Absolute positioning

Absolute Positioning

  • we do not use any layout manager

    • setLayout(null);

  • adding the components

    • Button b1 = new Button(«one»);

    • add(b1);

  • specifying the exact size and position

    • We overwrite the paint(Graphics g) method and specify the position and size of each component:

      • b1.reshape(70 + insets.left, 35 + insets.top, 50, 20);

  • We should avoid using absolute positioning in order to guarantee a platform-dependent component appearance


Example with layouts panels 1

Example withlayouts/panels (1)

import java.applet.*;

import java.awt.*;

public class Example6 extends Applet

{

public void init()

{

Panel p;

setLayout(new BorderLayout());

p = new Panel();

p.add(new TextArea());

add("Center", p);

p = new Panel();

p.add(new Button("One"));

p.add(new Button("Two"));

Choice c = new Choice();

c.addItem("one");

c.addItem("two");

c.addItem("three");

p.add(c);

add("South", p);

}

continued…


Example with layouts panels 2

Example withlayouts/panels (2)

public static void main(String [] args)

{

Frame f = new Frame("Example 6");

Example6 ex = new Example6();

ex.init();

f.add("Center", ex);

f.pack();

f.show();

}

}


Common problems

Common problems

  • when a window never shows up

    • set the window size or pack it

  • when the component never shows up

    • if the container is already visible call validate() on the container after adding the componenô

  • How can I specify a component’s exact size?

    • standard components size depends on the platform and the fonts that are used. You don’t need to specify their exact size.

    • for custom components you need to override getMinimumSize() and getPreferreSize() methods.

    • component sizes are subject to the layout manager you use


Shapes text images

Shapes, Text, Images

  • The class Graphics provides methods for drawing Lines, Rectangles (simple, 3D and round-edged rectangles), Ovals, Arcs and Polygons.

    • g.drawLine(10, 10, 120, 100);

  • drawing text

    • g.drawString(«Hello World», 50, 50); //g: instance of Graphics

  • setting fonts

    • g.setFont(new Font(new Font(«Helvetica», Font.ITALIC, 14)));

  • loading Images

    • Image image = getImage(URL); //in an applet

    • Image image = Toolkit.getDefaultToolkit().getImage(filenameOrURL);

  • displaying Images

    • g.drawImage(image, 0, 0, this);


Extending awt jfc swing

Extending AWT – JFC Swing

  • a new GUI API based on AWT

    • new visual components (tables, split panes, toolbars, trees, progress bars e.t.c)

    • drag and drop support

    • pluggable Look & Feel support

  • two releases

    • JFC 1.1 (for use with JDK 1.1)

    • JDK 1.2

  • For each AWT component there is a equivalent Swing component (JButton, JLabel, JFrame, e.t.c.)

    • Swing components are implemented with absolutely no native code

    • They have much more capabilities than AWT components


  • Login