Upload
milo-parks
View
214
Download
1
Embed Size (px)
Citation preview
User Interface Summary
Displayable
Screen Canvas
Form Alert List Textbox
Item
DateField ImageItem TextFieldStringItem Gauge ChoiceGroup
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
void paint(Graphics g) – carry out the drawing
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
void paint(Graphics g) – carry out the drawing
void repaint() – invoke to redraw Canvas (calls paint())
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
void paint(Graphics g) – carry out the drawing
void repaint() – invoke to redraw Canvas (calls paint())
void keyPressed(int keyCode) – invoked when key is pressed
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
void paint(Graphics g) – carry out the drawing
void repaint() – invoke to redraw Canvas (calls paint())
void keyPressed(int keyCode) – invoked when key is pressed
void keyReleased(int keyCode) – invoked when key is released
Canvas A type of screen that allows drawing and capturing keypad input
Abstract class – need to inherit and implement specific behaviors
void paint(Graphics g) – carry out the drawing
void repaint() – invoke to redraw Canvas (calls paint())
void keyPressed(int keyCode) – invoked when key is pressed
void keyReleased(int keyCode) – invoked when key is released
Key codes: Canvas.KEY_NUM0 ... Canvas.KEY_NUM9
Canvas.KEY_STAR ... Canvas.KEY_POUND
Canvas.LEFT ... Canvas.RIGHT
Canvas Treat as a regular Form
void addCommand(Command c)
void setCommandListener(CommandListenr l)
void setTitle(String text)
void setTicker(String text)
int getWidth()
Int getHeight()
Canvas Treat as a regular Form
Canvas gameView = new MahjongCanvas();
Display.getDisplay(this).setCurrent(gameView);
Canvas Drawing takes place in void paint(Grpahics g);
Graphics class provides capabilities for drawing lines, rectangles, images
void paint(Graphics g)
{
int red = 0x00FF000000;
g.setColor(red);
g.drawLine(x1, y1, x2, y2);
int green = 0x0000FF00;
g.setColor(green);
g.drawRect(x, y, width, height);
g.fillRect(x, y, width, height);
int blue = 0x000000FF;
g.setColor(blue);
g.drawString(text, x, y, anchor);
}
Canvas Drawing takes place in void paint(Grpahics g);
Graphics class provides capabilities for drawing lines, rectangles, images
void paint(Graphics g)
{
for (int i = 0; i < shapes.size(); ++i) {
Shape s = (Shape) shape.elmentAt(i);
this.setColor( s.getColor() );
s.draw( g );
}
}
Canvas Placement of Text and Images (Anchor Points)
BASELINE, TOP, BOTTOM, RIGHT, LEFT, HCENTER, VCENTER
g.drawLine(this.getWidth()/2, 0, this.getWidth()/2, this.getHeight());
g.drawLine(0, 20, this.getWidth(), 20);
g.drawString("Canvas Caption", this.getWidth()/2, 20, Graphics.BASELINE | Graphics.HCENTER);
g.drawLine(0, 50, this.getWidth(), 50);
g.drawString("Canvas Caption", this.getWidth()/2, 50, Graphics.BASELINE | Graphics.LEFT);
g.drawLine(0, 80, this.getWidth(), 80);
g.drawString("Canvas Caption", this.getWidth()/2, 80, Graphics.BASELINE | Graphics.RIGHT);
g.drawLine(0, 110, this.getWidth(), 110);
g.drawString("Canvas Caption", this.getWidth()/2, 110, Graphics.LEFT | Graphics.TOP);
g.drawLine(0, 140, this.getWidth(), 140);
g.drawString("Canvas Caption", this.getWidth()/2, 140, Graphics.LEFT | Graphics.BOTTOM);
Canvas Placement of Text and Images (Anchor Points)
BASELINE, TOP, BOTTOM, RIGHT, LEFT, HCENTER, VCENTER
g.drawLine(this.getWidth()/2, 0, this.getWidth()/2, this.getHeight());
g.drawLine(0, 20, this.getWidth(), 20);
g.drawString("Canvas Caption", this.getWidth()/2, 20, Graphics.BASELINE | Graphics.HCENTER);
g.drawLine(0, 50, this.getWidth(), 50);
g.drawString("Canvas Caption", this.getWidth()/2, 50, Graphics.BASELINE | Graphics.LEFT);
g.drawLine(0, 80, this.getWidth(), 80);
g.drawString("Canvas Caption", this.getWidth()/2, 80, Graphics.BASELINE | Graphics.RIGHT);
g.drawLine(0, 110, this.getWidth(), 110);
g.drawString("Canvas Caption", this.getWidth()/2, 110, Graphics.LEFT | Graphics.TOP);
g.drawLine(0, 140, this.getWidth(), 140);
g.drawString("Canvas Caption", this.getWidth()/2, 140, Graphics.LEFT | Graphics.BOTTOM);
Canvas Placement of Text and Images (Anchor Points)
BASELINE, TOP, BOTTOM, RIGHT, LEFT, HCENTER, VCENTER
Lab Create a class Rectangle that represents a 2D rectangle
data members: ulx, uly, width, height
methods: constructor
void draw(Graphics g)
void move(int dx, int dy)
Create a class ShapesCanvas that extends Canvas
data members: collection of Rectnagles
methods: constructor
void paint(Graphics g) <-- override: draw shapes
void keyPressed(int keyCode) <-- override