Upload
fathia
View
26
Download
0
Tags:
Embed Size (px)
DESCRIPTION
308-203A Introduction to Computing II Lecture 4: Visual Programming A Case Study of OOP. Fall Session 2000. What is Visual Programming?. Answer: Just the point-and-click we know-and-love. Window. Desktop. Start. A good example of OOP. Windows, dialogs and all the other little boxes - PowerPoint PPT Presentation
Citation preview
308-203AIntroduction to Computing II
Lecture 4: Visual ProgrammingA Case Study of OOP
Fall Session 2000
What is Visual Programming?
Desktop
Window
Start
Answer: Just the point-and-click we know-and-love
A good example of OOP
• Windows, dialogs and all the other little boxes can be clearly visualized as individual objects with their own private instance data
• They share many behaviors, so code can be reused if it is arranged to leverage inheritance
A Simplified Case-Study
• Text-based: just arrays of char
• Simple visual hierarchy: just windows on a desktop (no mouse-clicks)
We will implement one from scratch:
A Simplified Case-Study
..............................
..............................
..********..........
..*Win 1 *..........
..* ++++++++...
..***+Win 2 +...
........+ +...
.…....++++++++...
..............................
“Desktop” with two windows
Helper Class “Coordinate”
class Coordinate {
Coordinate(int x, int y) { … } int getX( ) {…} ; int getY( ) {…};}
To draw text at certain x-y coordinates, itwill be handy to package up those coordinates:
The Class Hierarchy
DrawingAreaVector (JDK)
EmbeddedDrawingArea
ConcreteDrawingArea
Screen
Desktop
Window
TextWindow
DrawableVector
Coordinate
Abstraction of “Drawing”
• Drawable - things which can be drawn (the “painting”)• DrawingArea - where things can be drawn (the “canvas” )
DrawingAreas will provide methodsso that Drawable things can drawthemselves.
Abstraction of “Drawing”
• Drawable - things which can be drawn (the “painting”)• DrawingArea - where things can be drawn (the “canvas” )
interface Drawable {
void draw( );}
Abstraction of “Drawing”
• Drawable - things which can be drawn (the “painting”)• DrawingArea - where things can be drawn (the “canvas” )
abstract class DrawingArea {
void drawCharAt(Coordinate, char);char getCharAt(Coordinate);boolean checkValid(Coordinate) {…};
}
Making it more Concrete
class ConcreteDrawingArea extends DrawingArea {
char [] [] myData;
void drawCharAt(Coordinate, char) { … }char getCharAt(Coordinate) { … }
}
So what’s the difference?
• ConcreteDrawingAreas have real text data
• ConcreteDrawingAreas provide methods to access that data which were prescribed but not implemented in DrawingArea
• Note: even a ConcreteDrawingArea is little more than a stylized array of char
Screen
Problem: We still can’t actually print anything…
Solution: Add a class with more functionality
class Screen extends ConcreteDrawingArea {
// This just calls System.out.printlnvoid dump( ) { … }
}
Desktop
Problem: screens only remember characterdata and print it out… they don’t know aboutwindows and things
class Desktop extends Screen {
addItem(Drawable);removeItem(Drawable);bringToFront(Drawable);
}
Desktop is “Drawable,” too
class Desktop extends Screen {
void draw( ){ // for each Drawable thing, d, on the Desktop d.draw( );}
}
DrawableVector
The above is neatly handled by extendingthe JDK class Vector so that it is Drawable…
To draw yourself, just draw each elementin order.
The Class Hierarchy (so far)
DrawingAreaVector (JDK)
ConcreteDrawingArea
Screen
Desktop
DrawableVector
Coordinate
Any questions?
So what Drawables do we put on the Desktop?
It’s time for windows, dialogs, and such:the stuff of point-and-click…
Embedded Drawing Areas
Problem: Windows and dialogs and suchneed to move around easily and transparently.
Desktop
Window
Start
Window (0,0)
Embedded Drawing Areas
Problem: Windows and dialogs and suchneed to move around easily and transparently.
Desktop
Window
Start
Window (0,0)has moved
Embedded Drawing Areas
Solution: Remember offset inside anotherdrawing area.
Desktop
Window
Start
Embedded area
Embedding area
Embedded Drawing Areas
class EmbeddedDrawingAreaextends ConcreteDrawingArea
{int x_offset, y_offset;DrawingArea embedding;
void moveTo(x,y);}
Window
Problem: We can’t see where a windowends and the desktop begins.
Solution: Add a border.
Window
class Window extends EmbeddedDrawingArea{
char border;
drawBorder( ) { // new method }
drawCharAt( ) { // OVERRIDE }draw( ) { // OVERRIDE }
}
TextWindow
class TextWindow extends Window{
String text;
void setText(String);
draw( ) { // OVERRIDE }}
The Class Hierarchy
DrawingAreaVector (JDK)
EmbeddedDrawingArea
ConcreteDrawingArea
Screen
Desktop
Window
TextWindow
DrawableVector
Coordinate
Any questions?