1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110
|
<html>
<head>
<title>Teachpack : Animated Images</title>
</head>
<body bgcolor="#ffffff" text="#000000"
link="#009900" vlink="#007700" alink="#cc0000">
<a href="index.html">Teachpacks for How to Design Programs</a>
<h1>Animated Images</h1>
<hr> <h3><a name="world.ss">world.ss</a></h3> <!-- DOCNOTE="teach=world.ss" -->
<p>The teachpack provides two kinds of functions. The first four allow
students to simulate a small world of animated drawings and games:
<menu>
<li><code><a name="big-bang">big-bang</a> : Number Number Number World -> true</code><br>
<code>(big-bang width height n w)</code>
creates and shows a width x height canvas,
starts the clock,
makes it tick every n seconds,
and makes w the first world
<li><code><a name="on-tick-event">on-tick-event</a> : (World -> World) -> true</code><br>
<code>(on-tick-event tock)</code> means that DrScheme must call <code>tock</code>
on the current world every time the clock ticks; it uses the result as the next world
<li><code><a name="on-key-event">on-key-event</a> : (World KeyEvent -> World) -> true</code><br>
<code>(on-key-event change)</code> means that DrScheme must call
<code>change</code> on the current world and a (representation of the)
keyevent for every keystroke the programmer (user of the computer) makes; it uses
the result as the next world
<pre>
<code>
;; A KeyEvent is one of:
;; -- Char (char?)
;; -- Symbol (symbol?)
</code>
When the Keyevent is a char, the programmer (user of the computer) has hit an
alphanumeric key. Symbols such as <code>'left</code>, <code>'right</code>,
<code>'up</code>, <code>'down</code>, <code>'release</code> denote arrow keys
or the events of releasing a key on the keypad.
</pre>
<li><code><a name="on-mouse-event">on-mouse-event</a> : (World Number Number MouseEvent ->
World) -> true</code><br> <code>(on-mouse-event clack)</code> means that
DrScheme must call <code>clack</code> on the current world, the current
<code>x</code> and <code>y</code> coordinates of the mouse, and and a
(representation of the) mouseevent for every action of the mouse the programmer
(user of the computer) makes; it uses the result as the next world
<pre>
<code>
;; A MouseEventType is one of:
;; - 'button-down
;; - 'button-up
;; - 'drag
;; - 'move
;; - 'enter
;; - 'leave
</code>
The symbols denote the appropriate action with the mouse and (any of)
its button(s).
</pre>
<li><code><a name="on-redraw">on-redraw</a> : (World -> Image) -> true</code><br>
<code>(on-tick-event world->image)</code> means that DrScheme
calls <code>world->image</code> whenever the canvas must be redrawn; the
result is displayed in the teachpack's canvas
<li><code><a name="end-of-time">end-of-time</a> : String u Symbol -> World</code><br> When DrScheme
evaluates <code>(end-of-time)</code>, it stops the clock and displays the
given string or symbol; no further tick events, key events, or redraw events
take place until the world is created again. </menu></p>
<p>The rest are functions for creating scenes:
<menu>
<li><code><a name="nw:rectangle">nw:rectangle</a> : Number Number Mode Color -> Image</code><br>
<code>(nw:rectangle width height mode color)</code>
creates a width x height rectangle, solid or outlined,
with its anchor in the NW corner
<li><code><a name="empty-scene">empty-scene</a> : Number Number -> Scene</code><br>
<code>(empty-scene width height)</code>
creates a width x height "scene" (frame with origin in NW)
<li><code><a name="place-image">place-image</a> : Image Number Number Scence -> Scene</code><br>
<code>(place-image image x y scene)</code>
places image at (x,y) into scene; (x,y) are comp. graph. coordinates
<li><code><a name="add-line">add-line</a> : Scene Number Number Number Number Color -> Scene</code><br>
<code>(add-line scene x0 y0 x1 y1 c)</code>
places a line of color <code>c</code> from <code>(x0,y0)</code> to
<code>(x1,y1)</code> into <code>scene</code>;
<code>(x,y)</code> are comp. graph. coordinates
<li><code><a name="run-movie">run-movie</a> : (Listof Image) -> true </code><br>
<code>(run-movie loi)</code>
shows the list of images in loi, time-delayed
</menu></p>
<p>Finally, the teachpack provides all the functions that image.ss provides
except <code>add-line</code>, which has a slightly different functionality.</p>
<br>
<br>
</body>
</html>
|