# \[AS2\] Using MovieClip onRollOver for MyButton class

**URL:** <https://forum.kirupa.com/t/as2-using-movieclip-onrollover-for-mybutton-class/57645>\
**Category:** flash\
**Created:** [July 15, 2004, 12:14am UTC](https://forum.kirupa.com/t/as2-using-movieclip-onrollover-for-mybutton-class/57645 "2004-07-15T00:14:07Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![elastin](https://avatars.discourse-cdn.com/v4/letter/e/c68b51/32.png) [@elastin](https://forum.kirupa.com/u/elastin)\
**Post date:** [July 15, 2004, 12:14am UTC](https://forum.kirupa.com/t/as2-using-movieclip-onrollover-for-mybutton-class/57645/1 "2004-07-15T00:14:07Z")

</div>

I’m creating MyButton class using the MovieClip class. The problem is getting onRollOver to reDraw MyButton. The scope appears to be wrong, please help. This is a simplified version to represent the problem.

// Menu.fla  
//Create an Instance of MyButton

var b:MyButton = new MyButton();

[//MyButton.as](https://MyButton.as) Class

class MyButton{  
private var mc:MovieClip;  
public var xPosition:Number;  
public var yPosition:Number;  
public var width:Number;  
public var height:Number;  
public var fill;

//Construct MyButton  
public function MyButton(){  
create();  
drawRect(0, 0, 100, 22, 0xccddaa);  
drawOver();  
}

//Create MovieClip Instance  
private function create():Void {  
mc = \_root.createEmptyMovieClip(“buttonx”, 0);  
}

//draw MyButton Shape  
private function drawRect(xPosition, yPosition, width, height, fill) {  
var ax = xPosition+width;  
var ay = yPosition;  
var bx = xPosition;  
var by = yPosition+height;  
mc.clear();  
mc.beginFill(fill, 90);  
mc.lineStyle(1, 0xccddee);  
mc.moveTo(xPosition, yPosition);  
mc.lineTo(ax, ay);  
mc.lineStyle(1, 0xccddee);  
mc.lineTo(ax, by);  
mc.lineStyle(1, 0xccddee);  
mc.lineTo(bx, by);  
mc.lineStyle(1, 0xccddee);  
mc.lineTo(bx, ay);  
mc.endFill();  
}

//reDraw MyButton onRollOver  
private function drawOver(){  
mc.onRollOver = function(){  
drawRect(0, 0, 100, 22, 0x000000);  
}  
}  
}

---

<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 19, 2004, 9:00pm UTC](https://forum.kirupa.com/t/as2-using-movieclip-onrollover-for-mybutton-class/57645/2 "2004-07-19T21:00:24Z")

</div>

I guess no one cared.  
I can do it this way but I’m not reusing my initial shape like I would like.

```auto
class MyButton{
 private var mc:MovieClip;
 public var xPosition:Number;
 public var yPosition:Number;
 public var width:Number;
 public var height:Number;
 public var fill;
//Construct MyButton
 public function MyButton(){
  create();
  drawRect(0, 0, 100, 22, 0xccddaa);
  drawOver(0, 0, 100, 22, 0x00ff00);
 }
//Create MovieClip Instance
 private function create():Void {
  mc = _root.createEmptyMovieClip("mc", 0);
 }
//draw MyButton Shape
 private function drawRect(xPosition, yPosition, width, height, fill) {
  var ax = xPosition+width;
  var ay = yPosition;
  var bx = xPosition;
  var by = yPosition+height;
  mc.clear();
  mc.beginFill(fill, 90);
  mc.lineStyle(1, 0xccddee);
  mc.moveTo(xPosition, yPosition);
  mc.lineTo(ax, ay);
  mc.lineStyle(1, 0xccddee);
  mc.lineTo(ax, by);
  mc.lineStyle(1, 0xccddee);
  mc.lineTo(bx, by);
  mc.lineStyle(1, 0xccddee);
  mc.lineTo(bx, ay);
  mc.endFill();
 }
//reDraw MyButton onRollOver
 private function drawOver(xPosition, yPosition, width, height, _fill){
  var ax = xPosition+width;
  var ay = yPosition;
  var bx = xPosition;
  var by = yPosition+height;
  mc.onRollOver = function(){
   var fill = _fill;
   this.clear();
   this.beginFill(fill, 90);
   this.lineStyle(1, 0xccddee);
   this.moveTo(ax, ay);
   this.lineTo(ax, ay);
   this.lineStyle(1, 0xccddee);
   this.lineTo(ax, by);
   this.lineStyle(1, 0xccddee);
   this.lineTo(bx, by);
   this.lineStyle(1, 0xccddee);
   this.lineTo(bx, ay);
   this.endFill();
  }
 }
}

```

---

<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 23, 2004, 3:40am UTC](https://forum.kirupa.com/t/as2-using-movieclip-onrollover-for-mybutton-class/57645/3 "2004-07-23T03:40:05Z")

</div>

This is what I wanted to do:

```auto
 
[size=2]class MyButton{ 
 
private var mc:MovieClip; 
 
public var xPosition:Number; 
 
public var yPosition:Number; 
 
public var width:Number; 
 
public var height:Number; 
 
public var fill; 
 
//Construct MyButton 
 
public function MyButton(){ 
 
create(); 
 
drawRect(0, 0, 100, 22, 0xccddaa); 
 
drawOver(0, 0, 100, 22, 0x00ff00); 
 
} 
 
//Create MovieClip Instance 
 
private function create():Void { 
 
mc = _root.createEmptyMovieClip("mc", 0); 
 
} 
 
//draw MyButton Shape 
 
private function drawRect(xPosition, yPosition, width, height, fill) { 
 
var ax = xPosition+width; 
 
var ay = yPosition; 
 
var bx = xPosition; 
 
var by = yPosition+height; 
 
mc.clear(); 
 
mc.beginFill(fill, 90); 
 
mc.lineStyle(1, 0xccddee); 
 
mc.moveTo(xPosition, yPosition); 
 
mc.lineTo(ax, ay); 
 
mc.lineStyle(1, 0xccddee); 
 
mc.lineTo(ax, by); 
 
mc.lineStyle(1, 0xccddee); 
 
mc.lineTo(bx, by); 
 
mc.lineStyle(1, 0xccddee); 
 
mc.lineTo(bx, ay); 
 
mc.endFill(); 
 
} 
 
//reDraw MyButton onRollOver 
 
private function drawOver(_x, _y, _w, _h, _fill){ 
 
//create reference to object
var ButtonObj:MyButton = this;
mc.onRollOver = function(){ 
 
ButtonObj.drawRect(_x, _y, _w, _h, _fill);
 
} 
 
} 
 
}
 
[/size]

```

In menu.fla

```auto
 
var b:MyButton = new MyButton();
 

```

Hope this helps someone:)