# \[FMX\]Animation with actionscript

**URL:** https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034
**Category:** flash
**Created:** [March 10, 2004, 9:25am UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034 "2004-03-10T09:25:40Z")
**Posts on this page:** 10
**Page:** 1

<div class="post-metadata">

### Author: ![dboers](https://avatars.discourse-cdn.com/v4/letter/d/bbe5ce/32.png) [@dboers](https://forum.kirupa.com/u/dboers)
#### Post date: [March 10, 2004, 9:25am UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/1 "2004-03-10T09:25:40Z")

</div>

The following animation is made with a simple motion tween in wich the square first change in width before it change in height.  
How do I accomplish the same effect with actionscript?

[http://www.testfolder.com/property.htm](http://www.testfolder.com/property.htm)

I mean that first the width change and when that is finished that the height change.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 7:08pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/2 "2004-03-12T19:08:09Z")

</div>

divarch,

Ok, I downloaded the file, dropped 6 jpgs into the apropriate directory (I didn’t want to change your script yet), renaming them img1.jpg thru img6.jpg. Each of these jpgs are roughly 150x150 pixel pics. And clicked test movie.

When it first brings up the test movie window, it is a blank area with a next and prev button.

When I click on NEXT or PREV the first time, I see what I believe to be the resizing frame resizing itself down to nothing (it shrinks and idsappears). After that, clicking the buttons dont do anything (I assume this is because the mc is already shrunk down to nothing).

Any ideas as to why this might be?

I have Flash MX, not MX pro, will this script work with MX?

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 7:42pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/3 "2004-03-12T19:42:53Z")

</div>

Do U get any output in the trace, about not finding the image?  
I guess not, cause you would say so…

It is made in MX, and AS1, so that’s not the problem.  
Only frames, without images, strange…?\>:stunned:

It works on my end, so I guess I could try changing few things, but as I said, it is an experiment I made, and veeerrry BETA.

Cheers, and post if you have (don’t have) luck.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 7:51pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/4 "2004-03-12T19:51:42Z")

</div>

I would attach the FLA, but it is exactly the one you sent me. Its not working for me.

Maybe is there an update, hotfix, or something that I need to do with Flash MX?

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 7:56pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/5 "2004-03-12T19:56:39Z")

</div>

No, I doubt it.  
I am now making a revised edition with separate buttons for each clip, so we shall see.  
The code is the prob posssibly, I didn’t knew then, what I know now, so I will break it, and fix it.  
But, maybe not tonite, it’s getting late here

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 8:32pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/6 "2004-03-12T20:32:13Z")

</div>

Ok, I found the answer… or atleast a partial one.

The reason why the pics were not showing up was because when I had saved them in photoshop, I had saved them with the “progressive 5” setting type of JPG.

I had no idea that progressive pics wont show up in Flash. I still dont know why, but I just read that in a different post.

* * *

Now the only issue with your script is that the resizing of the framing box, doesn’t necessarily acheive the right size to frame the loaded pic. But, at least I can see the pic now, which is a good thing. I can build on this now

Thanks a ton for your input.

Jason

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 12, 2004, 8:38pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/7 "2004-03-12T20:38:12Z")

</div>

About, not achieving the right size, find the conditional checking clip width and height, and replace ‘||’ with '&&'  
It should wait both values, not just the other.  
See if it helps

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 13, 2004, 5:26pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/8 "2004-03-13T17:26:25Z")

</div>

OK, today I found time to make more serious version, so here it is.  
What the hell, it even has a preloader built in :cool:  
It is made out of 3 functions, calling each other.  
There are parts not necessary for the actual function, but are visually appealing.

I have added comments about what to do before start, so anyone interested can test it.  
And post impressions, of course.

Cheers

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 15, 2004, 5:22pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/9 "2004-03-15T17:22:19Z")

</div>

I appreciate you sharing.

Your code is based on the idea of dynamically created buttons from an array. Under normal circumstances that would be a good thing.

I happen to have a situation where my buttons have to be all over the screen, not in tidy rows. So, I created my buttons manually.

So, I made a couple of tweaks to your code related. But, its not working. I am wondering if you can spot the prob and/or suggest a better way to do it.

[AS]

//inititate vars and functions  
var path = “…/images/p”;  
init();  
//startup definition

function init() {  
//—optional–  
preloader.\_x = border.\_x;  
preloader.\_y = border.\_y;  
//--------------  
var startY = btn.\_y;  
btn.\_visible = 0;  
preloader.\_alpha = 0;  
/\* ------------------------my change 1-------------------------------------_/  
for (var i = 1; i\<=100; ++i) {  
this[“p”+i].onrelease = loader;  
/_ ----------------------------- end my change 1--------------------------_/  
}  
//}  
//clip loader definition  
function loader(j) {  
//clear interval, not to overlap, when jumping from btn to btn  
clearInterval(loadInt);  
//return objects to initital state  
preloader.\_alpha = 100;  
preloader.bar.\_xscale = 0;  
//actual container definition  
this.createEmptyMovieClip(‘holder’, -1);  
holder.\_x = holder.\_y=30;  
holder.\_alpha = -50;  
/_ -----------------------my change 2--------------------------------------_/  
/holder.loadMovie(path+imgArray[j]+".jpg");/  
holder.loadMovie(path+this.\_name+".jpg");  
/_ --------------------end my change 2-----------------------------------\*/  
///  
loadInt = setInterval(preload, 50, holder);  
}  
//preloading  
function preload(clip) {  
//‘border’ is used as a separate clip, to achieve the outline effect  
//align the preloader with ‘border’ clip  
//  
//in-built preloader, could be defined elsewhere,  
//or used as a custom class component  
preloader.\_x = border.\_x;  
preloader.\_y = border.\_y;  
var loaded = clip.getBytesLoaded();  
var total = clip.getBytesTotal();  
var percent = Math.round((loaded/total)\*100);  
preloader.bar.\_xscale = percent;  
preloader.\_txt.text = “loading … “+percent+” %”;  
//  
//this is why preloader is necessary  
if (loaded == total) {  
var targW = clip.\_width;  
var targH = clip.\_height;  
var x = clip.\_x+clip.\_width/2;  
var y = clip.\_y+clip.\_height/2;  
var dX = x-border.\_x;  
var dY = y-border.\_y;  
//  
preloader.\_txt.text = “complete … “+percent+” %”;  
preloader.\_alpha -= 7;  
}  
border.onEnterFrame = function() {  
//just use the preload values again, to separate this event  
if (loaded == total) {  
var diffW = targW-this.\_width;  
var diffH = targH-this.\_height;  
this.\_x += dX/10;  
this.\_y += dY/10;  
this.\_width += diffW/5;  
this.\_height += diffH/5;  
//when ‘diff’ becomes small beyond visual recognition  
//initiate image fade in effect  
if ((Math.abs(targH-this.\_height))\<0.3 && (Math.abs(targW-this.\_width))\<0.2) {  
clip.\_alpha += 5;  
if (clip.\_alpha\>=100) {  
//when alpha reached, delete everything  
//to return to ‘init’ phase,  
//and wait another ‘loader()’ command  
clearInterval(loadInt);  
delete border.onEnterFrame;  
}  
}  
}  
};  
}  
//---------- HAVE FUN ------------ 13.03.2004.

```auto

```

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 15, 2004, 5:28pm UTC](https://forum.kirupa.com/t/fmx-animation-with-actionscript/45034/10 "2004-03-15T17:28:28Z")

</div>

> \*Originally posted by DChihorn \*  
> \*\*

```auto
/* ------------------------my change 1-------------------------------------*/
	for (var i = 1; i<=100; ++i) {
                      this["p"+i].onrelease = loader;
/* ----------------------------- end my change 1--------------------------*/
	

```

\*\*

First thing I noticed:  
‘this[“p”+i].onrelease’ should be ‘on **R** elease’

Try that, first, and show me how your image array looks like.
