How to Make Some Cakes
Planning
the Project | Designing
the Project | Programming
| Classes
Improving
the Project | Conclusion
| Assignments
Task
- to create a sequencing game where the task is to put four images
into a correct order
You need to know
- how to change a turtle's shape, and how to define events for
the turtle
You will learn
- how to define a new class where several turtle share identical
properties.
|
There are many sequences you can use in
this game. For example, you could have a game where pictures
of the four seasons have to be ordered correctly beginning
with Spring and ending with Winter. You could also have a
set of numbers which must be ordered, starting with the lowest
first. There are endless options.
This project, however, looks at the
four stages that go into baking cakes. On
the screen there will be four images reflecting the time sequence
of actions:
- Mixing the ingredients together.
- Pouring the mixture into the baking tray.
- Baking the cakes in the oven.
- Turning the cakes out to cool before
eating them.
|
 |
|
The images will be lined up at the bottom of the screen randomly.
Above them will be four rectangles into which they must be
dragged in the correct sequence. If the correct image is dragged
to the corresponding rectangle, then it will immediately 'jump'
into position. If the wrong image is chosen by the player,
then the image will return to its original position at the
bottom of the screen. In this way the player will know that
their choice was incorrect, and they will be able to choose
again.
Both the rectangles and the images will be turtles. A 'New
Game' button will allow the game to reset itself.
|
| |
|
You will need to have four images to correspond with the four
stages of baking a cake listed above. You can draw these in
Logomotion, or download a ready-made graphic by clicking
here.
All four of the images need to appear in
their correct time sequence as frames of one .LGF animation.
If you have downloaded the graphic supplied, then open it
up in Logomotion and have a look at it. You will see that
the images appear listed on the left-hand side of the Organiser
at the bottom of the screen.
|
 |
| |
One of the ways in which you can simplify the creation of your
project is to decide, in advance, on the names that each of your turtles
should be given. In this case, the image turtles will be called 1,
2, 3, and 4 respectively. The rectangles will
be named r1,
r2, r3 and
r4. Therefore, image 1 will belong to rectangle
r1 and so on...
Begin by creating the four image turtles. Right click on the turtle
and choose Change t1 from the dropdown menu.
Click on the Set Shape... button in the dialog window and
browse to where your .LGF has been saved. Click Open to finish.
| There are a few properties that you must
set for your turtle whilst you are in this dialog window. Firstly,
in the Basics tab view, make sure that the option Pen
down has not been ticked.
|
 |
|
Click on the Shape tab. Make sure that AutoDrag
is ticked because this will allow your turtle to be moved
freely around the screen by the player.
Since your .LGF consists of four frames, you will also need
to specify which frame is to appear as the turtle image. Tick
the Manual Frame Mode box and leave the Frame
set to 1.
You are now ready to give your turtle an Event to
follow.
|
 |
|
Go to the Events tab and click on the Add button.
From the list of choices select OnLeftUp. Click OK.
Before you add any other commands, think about what you want
your turtle to do:
- If image 1 is dragged to r1, it will jump
into the rectangle.
- If image 1 is dragged to any of the other three
rectangles, it will return to its home position at the bottom
of the screen.
|
What does the event onLeftUp
have to find out?
- whether the turtle covers with something;
the best thing is if it covers one of the boxes that's place
belongs to it e.g. the turtle viewed as the third frame
belongs evidently to the box r3, because the frames
in the image were in the good time sequence,
- if yes, it "jumps" into its place
during creating the images in the box sheet and images
that form the time sequence we have to be careful to put
their Hot Spot
in the same place, e.g. in the middle of the image
- if not, the turtle will return
in its original place - home position- after our
creating and moving all turtles - images and boxes select
for each turtle in its context menu, the item Change,
the tab Position and for each turtle press the button
Set Current, so the turtle considers its current
position as its home position.
Use these instructions and create four turtles
- boxes and 4 turtles - images with arranged properties and the
event. Use copying through the Clipboard. If you cannot define
the event onLeftUp
study here.
In previous programming we
could see that all 4 turtles - images are the same. Evidently
you create one turtle and copy it through the Clipboard. Thus
we designed the common properties of all the turtles images.
We can define the class with these properties - pen up, auto drag,
shape and event onLeftUp. (We do not have to use the Object
Oriented Programming in Imagine and we can stop here on this level
of programming).
Open New project, built
on object oriented programming principles from the beginning.
At the beginning we define the new class pictureToGame.
We can define it in several ways e.g. in the line too:
?
newClass "turtle "pictureToGame
        [autoDrag true pen pu setFrameMode
yes shape (loadImage "cake)]
Note: we type the commands
into several lines to be more readable in our explanation, if
we define the event; we have to type all the commands in one line.
We define the event onLeftUp
for the class, too open Explore Project Window, double
click on the class and the similar dialogue Change of any
object will open, but there are only three tabs in this dialogue:
Events, Variables a Procedures. Add the event
onLeftUp
; check up whether the image is in the right box:
ifElse overlapped <>
[]
that [ifElse (first overlapped) = (word "r frame)
[setPos ask first overlapped [pos]][home]]
[home]
We explain these commands:
does anybody cover the turtle
that is released with left mouse button?
if yes: Compare the name of the
turtle that covers the released turtle and the name created of
the letter "r" and the released turtle's frame. Are they
equal?
if yes: the released turtle
will go to its position, i.e. to the box's position
if not: the released turtle will return home
if not: the released turtle will
return home
Equally as in the previous project create the
turtles - boxes with the appropriate shape and with names r1,
..., r4 the turtle t1, that is living in the
page from the beginning of Imagine either cancel or rename to r1
and assign the box shape to it.
In the line now create the new turtle - image
that will be the object (instance) of our new class pictureToGame.
During creating the image we determine what will be different for
this special instance from other instances of this class. Evidently
in our case it is the name of this turtle ant its position:
?
new "pictureToGame [name 1 pos [-160 -90]]
Try to drag this picture and put it on one
of the boxes. As the shape of the turtle has got the frame 1, it
jumps only on the first box. If we try to put the image on another
box or anywhere, it will return in its home position.
Try to change the frame of this turtle:
?
1'setFrame 2
and drag it and put into the boxes. Where
will it jump now?
Similarly in the line create next 3 turtles
- images for the game:
?
new "pictureToGame [name 2 pos [-20 -90]]
? new "pictureToGame [name 3 pos [120 -90]]
? new "pictureToGame [name 4 pos [260 -90]]
Finally insert the button on the page - we
select different frames for each turtle and put it into home position
by pressing this button:
let
"sFrame shuffle [1 2 3 4]
repeat 4 [ask repc [setFrame item repc :sFrame home]]
You must realize that some turtles are drawn
under other ones evidently it is because they were formed
earlier. During dragging the turtles this fact spoils the look of
the project. That's why we design the event onLeftDown,
that at click on the turtle - image allows its moving over other
ones.
Firstly think over whether this event belongs
to the whole class pictureToGame
or to individual turtles - images (i.e. whether it is "equal" or
whether it must be different for each of them).
Evidently you can see that it is common event
for the whole class - press the Explore Project Window and type
the event onLeftDown
into the class pictureToGame
Press the Explore Project Window and
view the parents of all objects. We can see very well what is on
the page:
It was our first meeting with classes, terminology
and their using in Imagine. We do not have enough space for explaining
Object Oriented Programming, so we suggest you to read something
about this topic in the literature.
- Complete the project with other images
e.g. instruction how to draw a house. Create the variable with
loaded images. Think over the fact who is the variable's owner
and whether there is something to change in the class pictureToGame.
(Now each instance has several possibilities for its shape, so
the property "shape is not equal for the whole class. Evidently
we cancel the variable shape.
After its canceling only in the line try new instance of the
class pictureToGame
. What shape it will be?) Edit the project this way - the button
New game select one of images set - cakes or drawing the
house.
- Insert other sets of images into the
game and edit the button New game to select one of them.
Help: if we have global variables
"cake, "house, "picture a "marks
with images in the event onPush
of the button b1
use the commands:
let "k pick [cake house
picture marks]
repeat 4 [ask repc [setShape thing :k]]
In simple logic
games for little children we often meet the assignments where
are the players expected to put the images into the time sequence
as they happened. The most elementary examples are making cakes,
drawing a picture, hanging a picture on the wall, a procedure
how to put a wardrobe together. There are more difficult sequences
such as the sequence of seasons in the year, various mathematical
sequences, crossing the road by several cars according to the
traffic signs. The most difficult problem is to find appropriate
images for these games. We help ourselves by finding them in Internet
again, where you should find images for the game.
|