# \[FMX\] Shape Tweening With Ease Via AS

**URL:** <https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213>\
**Category:** flash\
**Created:** [July 21, 2003, 12:55am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213 "2003-07-21T00:55:58Z")\
**Posts on this page:** 13\
**Page:** 1

<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:** [July 21, 2003, 12:55am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/1 "2003-07-21T00:55:58Z")

</div>

Hi I have hit a road block yet again. How would I go about tweening a simple square with AS and with ease. Figure a box about 30x30 to about 300x300.

Thanks in advance

---

<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:** [July 21, 2003, 1:07am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/2 "2003-07-21T01:07:47Z")

</div>

```auto
// part 1
box = createEmptyMovieClip("mc", ++depth);
box.beginFill(0xff6600, 70)
box.moveTo(-15, -15)
box.lineTo(-15, 15)
box.lineTo(15, 15)
box.lineTo(15, -15)
box.lineTo(-15, -15)

box._x = (Stage.height/2)-15
box._y = (Stage.width/2)-15

// part 2
box.onEnterFrame = function() {
	var diff = Math.round(300-this._width)
	this._width += diff/4
	this._height += diff/4
}

```

the first part of the script draws the box and positions it at the middle of the stage… the second part does the easing 🙂

---

<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:** [July 21, 2003, 1:46am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/3 "2003-07-21T01:46:35Z")

</div>

thank you very much, that was an excellent example 🙂

---

<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:** [July 21, 2003, 2:24am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/4 "2003-07-21T02:24:39Z")

</div>

in these two lines

```auto
this._width += diff/4
this._height += diff/4

```

try different values instead of 4 🙂

---

<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:** [July 24, 2003, 4:21am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/5 "2003-07-24T04:21:44Z")

</div>

A3, i can’t seem to make a border around my mc that i created. i looked up the drawing methods in the reference but can’t seem to find what i need. i then thought of creating an addition mc that would be just the border or the box(mc) but i also can’t figure out how to take the fill out. when i use endFill() the box dissapears. any ideas?

thanks

---

<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:** [July 24, 2003, 4:25am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/6 "2003-07-24T04:25:18Z")

</div>

can i have a look at the code (no fla:))

---

<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:** [July 24, 2003, 5:08am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/7 "2003-07-24T05:08:02Z")

</div>

yes you may

```auto

box = createEmptyMovieClip("mc", ++depth);
box.beginFill(0xffffff, 80)

box.moveTo(-5,-5)
box.lineTo(-5,5)
box.lineTo(5,5)
box.lineTo(5,-5)
box.lineTo(-5,-5)
box._x = 160
box._y = 225

box.onEnterFrame = function() {
        var diff = Math.round(275-this._width)
        this._width += diff/2
        this._height += diff/2
}

```

i have 2 more boxes as well, but i wont post it cuz im sure you’ll see what i mean

---

<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:** [July 24, 2003, 5:16am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/8 "2003-07-24T05:16:10Z")

</div>

oops ahmed i refered to you before as A3, sry about that 🙂

---

<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:** [July 24, 2003, 5:24am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/9 "2003-07-24T05:24:06Z")

</div>

the code works fine here… you’re using white for fill color, maybe that’s why you don’t see it :beam:

---

<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:** [July 24, 2003, 5:25am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/10 "2003-07-24T05:25:19Z")

</div>

no no, i see it but i want it to have a different color border

---

<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:** [July 24, 2003, 5:27am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/11 "2003-07-24T05:27:40Z")

</div>

aahh sorry

just use lineStyle(0, 0xff6600); instead of beginFill 🙂

---

<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:** [July 24, 2003, 5:29am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/12 "2003-07-24T05:29:11Z")

</div>

sweet i tryed something like that but i couldnt get it to work.

thanks again 🙂

---

<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:** [July 24, 2003, 9:33am UTC](https://forum.kirupa.com/t/fmx-shape-tweening-with-ease-via-as/26213/13 "2003-07-24T09:33:17Z")

</div>

why not try

onClipEvent(load) {

```
_x = 0
_y = 0
scaleSpeed = 10
speed = 5
endx = 300
endy = 300

```

}

onClipEvent(enterFrame) {  
this.\_xscale += (500 - this.\_xscale) / scaleSpeed; //or try scaleSpeed  
this.\_yscale += (500 - this.\_yscale) / scaleSpeed;  
\_x += (endX-\_x)/speed;  
\_y += (endY-\_y)/speed;

}