External Images with dynamic corners
The goal is to show how to display external images from a server directory and to dynamically place 2 corners around.
A PHP script 'll be used to read the directory. For the rest, it 's basically a script and a good understanding of progamming is required. setInterval method 'll be used.
Remarks :
I did not burden to test images loading ( a sophisticated script 'd have to ) Otherwise, images stored in the directory have gotten same zize.
Which simplify matters. In the following demo, click on stage to get next image. You could accelerate with a doubleclick.
We gonna describe the differents stages right away.
Creating Objects
1 - Set up Movie size 640x480 (background color #000033). Frame Rate : 100.
Be sure in Export, Mask off-stage objects is toggled.
We'll see in the script how successive clicks allow next images to display.
First, create the external rectangle 640x480 fully transparent. Anchor point : Top Left. Name it as mentioned.
Watch out carefully the next images :
3 - Draw a vertical line as shown hereafter :
and another one :
4 - Draw an horizontal line as shown hereafter :
and another one :
5 - You gonna draw upper corner. It's made with a colored external rectangle and an internal one (same color as background)
First external rectangle :
then internal rectangle (background color #000033)
Group the two ones. Name it CoinH. Target toggled.
6 - Then, draw the lower corner. First external rectangle :
then internal rectangle (background color #000033)
Group the two ones. Name it CoinB. Target toggled.
7 - Insert a sprite named Conteneur. It'll be used as a container for images.
PHP Script
Warning :
This example 'll use a PHP script (server side).
Then, to test your creation, you 'll need :
- either an Apache web server set on your computer ( with PHP installed )
- either put your files on your web directory , provide that your host allows PHP scripting.
With your favourite text editor, enter the following script :
Save as readir.php. You'll need it on the server.
Explanations :
We scan the directory /imageflash. While there are files in this directory, we 'll get width and height of images but, at end, we 'll only get the lowest ones.
( Anyway, that doesn't matter right here, all images are same )
The content of variables nb_total_image , largeur_min_image , hauteur_min_image , fini 'll be read by SwishMax script.
SwishMax Scripts
First main script in Scene_1
Script of virtual button b_virt :
on (press)
{ (compteur%2 == 0) ? go2() : go1(); }
If rest of 'compteur' divide by 2 is equal to 0 ( so compteur is even ) then runs go2 ( corners 'll back off ).
As compteur increases, next time rest 'll be équal to 1 and go1 'll run so corners 'll move around image.
A better hint :
In the previous code, an overflow of variable compteur could occur after a very high number of clicks. ( In practice no!)
For purists, we get a workaround :
- Declare compteur as boolean.
- Set up compteur=false;
- Replace compteur++; and compteur--; with compteur= ~compteur;
(i.e. complement to 1)
At last, for virtual button, replace code with
on (press) { if (compteur) go2(); else go1(); }
An advantage using setInterval is that we can accelarate process with successive clicks.
It's up to you to adapt the scripts to fit with different sizes of images but it'd be a tough work. Good luck.