tat kid jigsaw en

with Android Template

TAT#02E

Toni Setyawan, S.T., M.Pd. - flashbegin.com 1

EASY WAY TO DEVELOP

KID JIGSAW GAMES

ACHIEVEMENT INDICATORS OF LEARNING

Readers can create / modify Kid Games Jigsaw simple application

using Adobe Flash CS6 Android Template.

DESCRIPTION

A jigsaw puzzle is a puzzle that requires the assembly of tiles

or pieces of each other so as to form a three-dimensional image or

structure. Jigsaw pieces can be made of cardboard, wood, plastic,

rubber, metal or foam. Jigsaw puzzles can range in difficulty from

very easy three-piece puzzles for toddlers to the current record

holder, Life - The Great Challenge, with a whopping 24,000 pieces!

Play jigsaw is exciting and intriguing. But often times we are

in repotkan with many pieces of pieces that we have to manage. In

this module we will discuss how to create a digital version of jigsaw

games using Adobe Flash Pro CS6 for android mobile devices. You

do not need to be confused to think about action script because we

have provided a template for your modifications. With minimal

experience and knowledge of action script, we are sure you are able

to create "Kid Jigsaw Games”.

To reduce the effect of errors and facilitate finding out where

the mistakes so any changes do hold a trial run the program by

pressing ctrl-enter. When smoothly proceed further modification.

PREPARE STEPS

1. Open the Adobe Flash CS 6, wait until the display appears as

shown in the following pages.


2. Then click open and select the file "AT Games Kid Jigsaw.fla".

How to get the file reading section at the end of this module.

3. Here we are treated to a flash document with a size of 480 x

800 in accordance with the majority of the screen size of mobile

devices, but you can merubahkan then adjust the zoom

according to your wishes.

4. flash document, there are three scenes to simplify the

movement of the frame. Consider the following picture:

Clik the button to see the scene

Open

Active scene


STEPS TO CHANGE OPENING

1. Change the active scene into scene “opening”

2. Notice the timeline as shown below

3. Make any changes to your taste. Good for layers, image,

animation or sound. In this stage you are free to change

anything except the position of the frame (at the end) that

contains action scripts and do not alter its contents AS3.

STEPS TO CHANGE CLOSING

1. Ubah scene aktifnya menjadi scene “closing”

2. Perhatikan timeline seperti gambar dibawah ini

Frame with AS3

Frame dengan AS3


3. Make any changes to your taste. Good for layers, image,

animation or sound. In this stage you are free to change

anything except the position of the frame (at the end) that

contains action scripts and do not alter its contents AS3

STEPS TO CHANGE LAYOUT

1. Change the active scene into scene “core”

In this scene there are several views that represent the core of

this application. Display / layouts in this template can all be

replaced or added to suit your taste. But if the media were

replaced have instant name must be replaced with similar

medium with instant same name. To maintain the smoothness

of the program, the media (and the button movieclip) should

not be replaced but only modified, so the media was not

replaced but altered. Here is the view that there is in this

template.


2. Be careful in changing the layout of the image on the left,

because the composition of the image such as a slider and will

be discussed in the next section.

3. The leftmost image is the display when selecting the image and

image types can slide up and down. The middle image display

when selecting the level and last while playing.

STES TO CHANGE INFORMATION

1. Still in the scene "core", the information is the display that

appears when the "i button" is clicked

2. To change it you can open a movie clip in the library with the

name "tekskerabat".

Double click here


3. After the click will appear as below

4. In this stage you can change anything according to your taste.

See the following figure :

Sign if the view display on stage is mc “tekskerabat”

Don’t change


But do not change the properties of the movie clipnya symbol.

How to see the symbol of the properties is to right click on the

movie clip in the library and select Properties. Do not change

anything in the picture above, because it will make the action

script lost object to be called.

STEPS TO CHANGE JIGSAW PICTURE

1. Still in the scene "core", to replace the picture begins with a

double-click a movieclip with the name "mcgambar" in the

library.

2. Will then appear as shown below.

From the picture above there are two things that need our

attention. First make sure if you're really editing mcgambar by

Double click here

Tanda jika view tampilan di stage adalah mc “mcgambar”

Ancor movie clip


looking at the sign on the left above. Both ancor movie clip or a

point 0, 0 of movie clip should be at the top left end of the

image that we created. This is to ensure that the image display

and porongannya line with our expectations.

3. Note timelline movieclip as shown below.

AS3 layer is the layer that contains the script in the first frame.

Let it remain like this condition.

4. Picture layer is the layer that contains the images that will be

presented in a jigsaw games. Each frame contains one kind of

image.

5. To replace it you just remove the image on the layer and

replace with a new image.

Tips : There are two things to consider in the process of changing images, the images are mounted using the size of 400 X 400 pixels and replace it with another image of the same size. Two sure ancor fixed position at the top left corner of the image.

STEPS TO ADD JIGSAW PICTURE

1. Still in "mcgambar" and note the following Timeline

Right-click and select Insert Blank Keyframe or press F7

Keyframe appears empty


2. Fill in the empty frame with the new image that you want.

(remember the tips in the previous step on the size and position

of the image)

3. Change the active scene into scene "cores". Notice his timeline.

Action Script window will appear as shown below

4. Change the 8 to 9 which means there are 9 kinds of images.

5. Edit movieclip named "mcisipic" by double-clicking its name in

the library.

Double click here


Click and drag the "mcgambar" in the library to the stage and

plug in the bottom of the order. Arrange two columns down the

image, add it to the next line and do not change the

composition of the two columns. So add an image in multiples of

2 so that the composition of the image remains tersusum neat

option.

Tips : Tetap susun dua kolom kebawah, ini adalah desain yang dibuat untuk memudahkan dalam memodifikasi games jigsaw ini dengan macam gambar yang beragam.

Tips : Tampilan semua gambar akan sama tetapi pada saat program dijalankan akan muncul gambar yang berbeda beda sesuai dengan urutan yang ada di “mcgambar”.

6. Name the instant at mcgambar new entries with the name

"tbpic9" as before "tbpic8".

Tips : The name you enter must be in accordance with the rules

that have been set. This concerns the accuracy of the action script to call the movie clip.

Tips : Click the movie clip to bring up propertiesnya.

7. Try the result of the modifications you have done by pressing

ctrl-enter. On select new image should appear pillihan with the

new image. When a new image is clicked will jump to display

the level of choice. Once the level selected will appear

immediately Jigsaw pieces with a new image.

Instant name


STEPS TO CHANGE JIGSAW CUT

1. Still in the scene "core", select the level that you want to change

the flow of the pieces. Consider the following timeline image

2. To facilitate modifications eliminate the display of all layers

except the target and under.

3. Select the layer you want to change, then double click on the

state line rectangle which means entering into grub

Frame containing level 1




Sign of entry to the Group


4. After that there could change the flow of pieces to your taste.

Suppose as shown below

Tips : Here you are only allowed to replace the piece without

increasing the number of pieces. If you want to increase the number of pieces should use the step "increase the level”.

5. In this example we choose to change the ledge pieces at level 1

then the next step is to adjust the pieces in movieclipnya with

the plot. See in llibrary

6. Currently we are only making the flow potonganya but have not

changed the piece itself. To customize pieces with the plot. Let's

take the example of changing the mc Obj 1-1 pieces, then

double click on the mc.

Mc pot for level 1


7. Look at the picture above, to change the shape of the pieces

then we have to change the form in the layer mask. To facilitate

the process, create a new document with a white color and copy

groove stage pieces into a new document, then press Ctrl-B to

eliminate the groove groub in pieces.

Layer for mcgambar

Layer masking for gambar

Layer test objecs

Layer Action Script


8. Then create a shape with the piece groove.

9. Copy the movie clip pieces into pieces. Pieces 1 for "mc Obj 1-

1", 2 Pieces to "mc Obj 1-2" and 3 Pieces to "mc Obj 1-3", then

centerkan to ancor either vertically or horizontally.

Tips : For memperbudah and enhance the position at the end of

regulation, reposition the mask shape on the x and y coordinates with numbers easily. Example x: -108.5 changed to -110 and Y: -156.80 be - 155

Pieces 1

Pieces 2

Pieces 3

sempurnakan


10. Adjust the position of "mcgambar" in accordance with the

groove pieces. For conditioning your first piece for "mcgambar"

the top left. See the next page.

11. Lock all layers, then you will get something like the image

below.

12. Perform steps 9-11 for the other pieces on the movie clip "mc

Obj 1-2" and "1-3 mc Obj".


13. Once all the pieces have been appropriate, the next step is to

set the correct point for all the pieces.

14. Arrange the pieces and to facilitate the setting point of the truth

moved while the target layer to the top layer pic. Then bring the

point of truth in the target layer to the pieces of truth point. Do

not be mistaken, the point of truth with instant name "target1"

point to the truth mc clip "mc Obj 1-1", "target2" point to the

truth mc clip "mc Obj 1-2" and "target3" mc clip to the point of

truth "Obj 1-3 mc ".

Tips : mc set pieces and carefully targeted to produce a perfect image composition results.

point of truth “target1”

point of truth “mc Obj 1-1”

Move layer “target” to the top layer “pic”


STEPS TO ADD LEVEL

1. Masih dalam scene “core”, pilih level yang akan anda ubah alur

potongannya. Perhatikan gambar timeline berikut

2. To increase the level, means we have to add to the frame. The

first step is to make the back of an empty frame in the layer

"pic" and layer "target". Right-click the last frame then select

insert blank keyframe. Adjust the other frame and see the

results as shown below

3. At the target layer, make a rectangular image and cuts

Frame that contains level 1





4. In the previous picture, there are 16 pieces, this means that we

have to copy the "mc Obj x1" to "mc Obj 5.1" and so on a

number of 16 new movieclip.

5. Next, change the sprite each motorcycle according to the groove

cut in the same manner as steps 7-12 on “STEPS TO CHANGE

JIGSAW CUT”.

6. Once the piece is complete enter the movie clip "Target" from

the library to the stage by clicking and drug. Copy as many as

16 (since there are 16 pieces) and give instant sequentially

name "target1", "target2" and so on.

7. The key to the target layer and the next steps to fill a new

frame on the layer pic.

8. Enter by clicking and drug movie clip "mc Obj 5.1" and

seterusmya into the stage. Name the instant sequentially

"obj1", "obj2" and so on.

9. Stacking "mc Obj 5.1" and adjust the target in the same way as

step 13-14 on “STEPS TO CHANGE JIGSAW CUT”.

Tips : mc set pieces and carefully targeted to produce a perfect image composition results.

Tips : store and try on every modification, if an error occurs you will easily find out which parts of the program that makes the error.


CLOSING

The last step in order to flash this document can be published

or android app apk file we've discussed in the blog. To learn please

visit:

http://flashbegin.com

After the surgical study and understand this module means

you are able to create media-based learning android application.

Furthermore, to know how to get the “AT Games Kid Jigsaw.fla”

visit our blog at

http://temp.flashbegin.com

Toni Setyawan, S.T., M.Pd. - flashbegin.com

how to get template fla, visit :

http://temp.flashbegin.com

or

email me : [email protected] subject : “need flashbegin template”

flashbegin.com Tutorial Android Template (TAT)

tat kid jigsaw en

Software

jigsaw pieces

scene core

jigsaw puzzles

pieces of pieces

games kid

flash document

contents as3 steps

action scripts