Todays topics Java Recursion in Graphics Writing a

Today’s topics Java Recursion in Graphics Writing a Class Simple Animation Upcoming Simulation Reading Great Ideas, Chapters 5 Comp. Sci 001 18. 1

Using Recursion in Graphics v v Recursion can be a powerful tool Closely related to Fractals q q v v Self-similarity Keep zooming in: still looks the same Can produce very interesting figures with very little input Serpinsky Gasket is just a lot of triangles q Define recursively Comp. Sci 001 18. 2

Serpinsky Gasket v Start with triangle v Then put (1/2 size) triangles within triangle Comp. Sci 001 18. 3

Serpinsky Gasket v Continue process with ¼ sized triangles, etc v Insight: use Serpinsky Gaskets instead of triangles Comp. Sci 001 18. 4

Serpinsky public class Serpinsky extends java. applet. Applet implements Action. Listener { Graphics g; Canvas c; Int. Field i. Slow; Button b 1, b 2, b 3, b 4, b 5, b 6, b 7, b 8, b 9; Color col; int x, y, slow; public void init() { c = new Canvas(); c. set. Size(400, 400); add(c); g = c. get. Graphics(); b 1 = new Button("Start"); b 2 = new Button("Triangle"); b 3 = new Button("Gasket"); b 4 = new Button("Red"); Comp. Sci 001 18. 5

Serpinsky. 2 b 5 = new Button("Green"); b 6 = new Button("Blue"); b 7 = new Button("Black"); b 8 = new Button("White"); b 9 = new Button("Slow"); i. Slow = new Int. Field(10); col = Color. blue; slow = 0; b 1. add. Action. Listener(this); b 2. add. Action. Listener(this); b 3. add. Action. Listener(this); b 4. add. Action. Listener(this); b 5. add. Action. Listener(this); b 6. add. Action. Listener(this); b 7. add. Action. Listener(this); b 8. add. Action. Listener(this); b 9. add. Action. Listener(this); add(i. Slow); add(b 1); add(b 2); add(b 3); add(b 4); add(b 5); add(b 6); add(b 7); add(b 8); add(b 9); } Comp. Sci 001 18. 6

Serpinsky. 3 int mid(int a, int b) { return (a + b)/2; } void triangle(int x 1, int y 1, int x 2, int y 2, int x 3, int y 3) { int k; k = 0; while ( k < slow) k = k + 1; // code to slow down g. draw. Line(x 1, y 1, x 2, y 2); g. draw. Line(x 2, y 2, x 3, y 3); g. draw. Line(x 3, y 3, x 1, y 1); } Comp. Sci 001 18. 7

Serpinsky. 4 void serpinsky(int x 1, int y 1, int x 2, int y 2, int x 3, int y 3) { int size, limit=10; size = (x 2 -x 1)*(x 2 -x 1) + (y 2 -y 1)*(y 2 -y 1); if (size < limit) return; // base case: do nothing! i. e. : halting case triangle(x 1, y 1, x 2, y 2, x 3, y 3); // recursive calls serpinsky(x 1, y 1, mid(x 1, x 2), mid(y 1, y 2), mid(x 1, x 3), mid(y 1, y 3)); serpinsky(x 2, y 2, mid(x 2, x 1), mid(y 2, y 1), mid(x 2, x 3), mid(y 2, y 3)); serpinsky(x 3, y 3, mid(x 3, x 1), mid(y 3, y 1), mid(x 3, x 2), mid(y 3, y 2)); } Comp. Sci 001 18. 8

Serpinsky. 5 public void action. Performed(Action. Event event) { Object cause = event. get. Source(); if (cause == b 1) { g. set. Color(Color. white); // Color the whole canvas white g. fill. Rect(0, 0, 400); g. set. Color(Color. black); g. draw. String("Serpinsky Gasket", 20); } if (cause == b 2) { g. set. Color(col); triangle(50, 310, 200, 70, 350, 310); } if (cause == b 3) { g. set. Color(col); serpinsky(50, 310, 200, 70, 350, 310); } Comp. Sci 001 18. 9

Serpinsky. 6 if (cause == b 4) { col = Color. red; } if (cause == b 5) { col = Color. green; } if (cause == b 6) { col = Color. blue; } if (cause == b 7) { col = Color. black; } if (cause == b 8) { col = Color. white; } if (cause == b 9) { slow = i. Slow. get. Int(); } } } Comp. Sci 001 18. 10

Serpinsky Details v Note feature to slow down drawing q q v Get betters sense of how recursive calls work Also see how incredibly fast computer is… Note new graphics method void draw. String(String s, int x, int y) v Review recursive features q v What is done in the base case? What would figure be like if we drew nothing except q In the base case? Comp. Sci 001 18. 11

Writing a Class v Have been writing one class all along q q q v Write class named Serp which actually draws the gasket q q q v v Our applet is always a class Have used other classes such as Text. Fields Rewrite Serpinsky applet Class requires data (instance variables) Class requires methods (functions) Needs constructor (to initialize) (like init in applet) Now that we have such a class, can create many instances Use the new operator to accomplish this: new Serp(x 1, y 1, x 2, y 2, x 3, y 3, g); q q Where we pass in the 3 vertices of the triangle and the Graphics object Comp. Sci 001 18. 12

Serp. Class public class Serp. Class extends java. applet. Applet implements Action. Listener { Graphics g; Canvas c; Button b 1, b 2, b 3, b 4, b 5, b 6, b 7, b 8, b 9, b 10, b 11; Color col; int range = 70; public void init() { c = new Canvas(); c. set. Size(400, 400); add(c); g = c. get. Graphics(); b 1 = new Button("Start"); b 2 = new Button("NW"); b 3 = new Button("NE"); b 4 = new Button("SW"); b 5 = new Button("SE"); b 6 = new Button("CTR"); b 7 = new Button("Red"); b 8 = new Button("Green"); b 9 = new Button("Blue"); b 10 = new Button("Black"); Comp. Sci 001 18. 13

Serp. Class. 2 col = Color. black; b 1. add. Action. Listener(this); b 2. add. Action. Listener(this); b 3. add. Action. Listener(this); b 4. add. Action. Listener(this); b 5. add. Action. Listener(this); b 6. add. Action. Listener(this); b 7. add. Action. Listener(this); b 8. add. Action. Listener(this); b 9. add. Action. Listener(this); b 10. add. Action. Listener(this); b 11. add. Action. Listener(this); add(b 1); add(b 2); add(b 3); add(b 4); add(b 5); add(b 6); add(b 7); add(b 8); add(b 9); add(b 10); add(b 11); } public void action. Performed(Action. Event event) { Object cause = event. get. Source(); if (cause == b 1) { g. set. Color(Color. white); // Color the whole canvas white g. fill. Rect(0, 0, 400); g. set. Color(Color. black); g. draw. String("Serpinsky Gasket", 20); } Comp. Sci 001 18. 14

Serp. Class. 3 if (cause == b 2) { // NW int dx = -range, dy = -range; g. set. Color(col); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); } if (cause == b 3) { // NE int dx = range, dy = -range; g. set. Color(col); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); } if (cause == b 4) { // SW int dx = -range, dy = range; g. set. Color(col); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); } Comp. Sci 001 18. 15

Serp. Class. 4 if (cause == b 5) { // SE int dx = range, dy = range; g. set. Color(col); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); } if (cause == b 6) { // CTR g. set. Color(col); new Serp(50, 310, 200, 70, 350, 310, g); } if (cause == b 7) col = Color. red; if (cause == b 8) col = Color. green; if (cause == b 9) col = Color. blue; if (cause == b 10) col = Color. black; if (cause == b 11) col = Color. white; } Comp. Sci 001 18. 16

Serp. Class. 5 public class Serp { Graphics g; public Serp(int x 1, int y 1, int x 2, int y 2, int x 3, int y 3, Graphics gg) { g = gg; serpinsky(x 1, y 1, x 2, y 2, x 3, y 3); } public int mid(int a, int b) { return (a + b)/2; } public void triangle(int x 1, int y 1, int x 2, int y 2, int x 3, int y 3) { g. draw. Line(x 1, y 1, x 2, y 2); g. draw. Line(x 2, y 2, x 3, y 3); g. draw. Line(x 3, y 3, x 1, y 1); } Comp. Sci 001 18. 17

Serp. Class. 6 public void serpinsky(int x 1, int y 1, int x 2, int y 2, int x 3, int y 3) { int size, limit=200; size = (x 2 -x 1)*(x 2 -x 1) + (y 2 -y 1)*(y 2 -y 1); if (size < limit) // base case return; // do nothing triangle(x 1, y 1, x 2, y 2, x 3, y 3); // recursive calls serpinsky(x 1, y 1, mid(x 1, x 2), mid(y 1, y 2), mid(x 1, x 3), mid(y 1, y 3)); serpinsky(x 2, y 2, mid(x 2, x 1), mid(y 2, y 1), mid(x 2, x 3), mid(y 2, y 3)); serpinsky(x 3, y 3, mid(x 3, x 1), mid(y 3, y 1), mid(x 3, x 2), mid(y 3, y 2)); } } } Comp. Sci 001 18. 18

Simple Minded Animation v Simple Recipe 1. 2. 3. 4. 5. v Draw and Erase q q v Draw figure Delay Erases figure Shift slightly Repeat (step 1. , etc. ) Draw figure: is straight-forward Erase: overdraw with background color (white) Will demonstrate with Serpinsky Gasket Comp. Sci 001 18. 19

Moving Serpinsky public class Serp. Move extends java. applet. Applet implements Action. Listener { Graphics g; Canvas c; Int. Field i. Slow; Button b 1, b 2, b 3, b 4, b 5, b 6, b 7, b 8, b 9; Color col; int slow = 1000000; public void init() { c = new Canvas(); c. set. Size(400, 400); add(c); g = c. get. Graphics(); b 1 = new Button("Start"); b 2 = new Button("Move"); b 3 = new Button("Gasket"); b 4 = new Button("Red"); b 5 = new Button("Green"); b 6 = new Button("Blue"); b 7 = new Button("Black"); b 8 = new Button("White"); Comp. Sci 001 18. 20

Moving Serpinsky. 2 b 9 = new Button("Slow"); i. Slow = new Int. Field(10); col = Color. blue; b 1. add. Action. Listener(this); b 2. add. Action. Listener(this); b 3. add. Action. Listener(this); b 4. add. Action. Listener(this); b 5. add. Action. Listener(this); b 6. add. Action. Listener(this); b 7. add. Action. Listener(this); b 8. add. Action. Listener(this); b 9. add. Action. Listener(this); add(i. Slow); add(b 1); add(b 2); add(b 3); add(b 4); add(b 5); add(b 6); add(b 7); add(b 8); add(b 9); } public void delay() { double sum = 0. 0, x = 3. 14159265; int k = 0; while (k < slow) { sum = sum + 1. 0/x; k = k + 1; } } Comp. Sci 001 18. 21

Moving Serpinsky. 3 public void action. Performed(Action. Event event) { Object cause = event. get. Source(); if (cause == b 1) { g. set. Color(Color. white); // Color the whole canvas white g. fill. Rect(0, 0, 400); g. set. Color(Color. black); g. draw. String("Serpinsky Gasket", 20); } v Interesting Part Follows q Actual Motion done here Comp. Sci 001 18. 22

Moving Serpinsky. 4 if (cause == b 2) { // move int k = 0, range = 100; int dx = -range, dy = -range; while (k < range) { dx = dx + 2; dy = dy + 2; g. set. Color(col); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); delay(); g. set. Color(Color. white); new Serp(50+dx, 310+dy, 200+dx, 70+dy, 350+dx, 310+dy, g); g. set. Color(col); k = k + 1; } } Comp. Sci 001 18. 23

Moving Serpinsky. 5 if (cause == b 3) { g. set. Color(col); new Serp(50, 310, 200, 70, 350, 310, g); } if (cause == b 4) col = Color. red; if (cause == b 5) col = Color. green; if (cause == b 6) col = Color. blue; if (cause == b 7) col = Color. black; if (cause == b 8) col = Color. white; if (cause == b 9) slow = i. Slow. get. Int(); } } Comp. Sci 001 18. 24

Simple Minded Animation v v Did not show the Serp class which is unchanged Quality of animation is poor: flicker, not smooth q q v v Beats with monitor and outside lighting Speed dependence on processor and load Erases anything “below” Fixing this is outside the scope of this class Should do much in this class that we do outside Could (should) add a number of methods Let it handle the move, just pass new locations void set. Location(int new. X, int new. Y) void glide. To(int new. X, int new. Y) q The former would jump to new location, the latter would provide continuous motion q Comp. Sci 001 18. 25