problem - piano roll on stage using an array

[nolimit966]

hello there, I am trying to create a piano roll of 25 keys using an array which uses just 1 movieclip for the white keys which is duplicated across the screen 25 times and renamed in the array to a1, b1, c1, d1, e1, f1. I have never properly tried to do this with a single item being used multiple times before.
Could anyone please help? Each key is approx 45 pixels in width.

Heres all what i have so far

stop();
var keys:Array = [keys_mc];

var xPosition:Number = 50;
var yPosition:Number = 15;


for(i=0;i<button.length;i++)
    {
        
    }

keys_mc.addEventListener(MouseEvent.CLICK, clickHandler);

function clickHandler(event:MouseEvent):void 
{
   gotoAndStop("keyDown");
}

Any help is appreciated.
Thanks

[henke37]

You just need basic geometry. You already have the loop structure down, so it is just a matter of writing the body.

The body needs to update the position variable as it progresses, so increment said variable with the width + padding.

Piano keyboards are fun in that they have these black keys wedged between the other keys. You can deal with this rather easily, just measure the width carefully so that the overlap is allowed to happen.

[nolimit966]

cheers man! That worked but im not too good at Geometry. I added the following to my for loop but its not really worked too well. It displays the key but its right at the top right of the page. I need a row of 25 keys which are 45 pixels wide span across the bottom of my scene.
Here is what i used:

for(var number:Number = 0; number < keysArray.length; number++)
    {
    canvas.addChild(keysArray[number]);//adds the elements of the array to the stage/canvas
    keysArray[number].itemAngle = Math.PI * 2 / keysArray.length * number; //placing the item on the stage in position
    // canvas.setChildIndex(keysArray[number], number);
    }

Can you help please?

Thank you! :-)!