Change button frame by name?

[proyb2]

How do I get the button by name and set frame? Is it ideal to store button index in array for performance?

for(i=0;i<30;i++){   game.add.button(i*30, 0, 'button', keypress, this, 0, 0, 1).name="btn"+i}

[Daniel Belohlavek]

Do you mean something like this?

var foo = {    over: 1,    out: 2,    down: 3,    up: 4}button.setFrames(foo.over, foo.out, foo.down, foo.up);

[proyb2]

Nope, to get sprite unique name from stage and set frame. I could only find getAt().frame=1 but don't see any api to getName().frame=1? Just wonder, is there a more efficient way to set frame without looping through all object every few millseconds?

[Daniel Belohlavek]

I still don't quite understand what you need but I'm going to throw some info anyways, please tell me if i'm getting closer 

 

Both the Sprite and the Button class have key parameters, so if you do:

function preload() {    game.load.image('sky', 'http://i.imgur.com/826zH6I.png');}function create() {    var bg = game.add.sprite(0, 0, 'sky');    console.log(bg.key);}

The result should be "sky".

 

Then you can do:

game.add.button(0, 0, bg.key);

And you would get a button with the same image as an sprite, If you are going to test this, please don't use the sky image, use something smaller

 

Now, if you load a spritesheet instead of an image you can do:

// The nulls are for callback and callback contextgame.add.button(0, 0, anim_spritesheet.key, null, null, 1, 2, 3, 4);

This will allow you to access the frames.

 

 

Hope it helps!

[proyb2]

I still don't quite understand what you need but I'm going to throw some info anyways, please tell me if i'm getting closer 

 

Both the Sprite and the Button class have key parameters, so if you do:

function preload() {    game.load.image('sky', 'http://i.imgur.com/826zH6I.png');}function create() {    var bg = game.add.sprite(0, 0, 'sky');    console.log(bg.key);}

The result should be "sky".

 

Then you can do:

game.add.button(0, 0, bg.key);

And you would get a button with the same image as an sprite, If you are going to test this, please don't use the sky image, use something smaller

 

Now, if you load a spritesheet instead of an image you can do:

// The nulls are for callback and callback contextgame.add.button(0, 0, anim_spritesheet.key, null, null, 1, 2, 3, 4);

This will allow you to access the frames.

 

 

Hope it helps!

 

 

Sorry, the code you mentioned have been done before. To clarify, say I created a set of piano keyboards of 88 keys from C0 to C7:

keyboard = game.add.group();item = keyboard.create(i, 'wkey', 0)item.input.start(0, true)item.events.onInputDown.add(kpress)item.events.onInputUp.add(krelease)item.events.onInputOut.add(kmoveoff)item.name="C0"

 

and each items is added into the stage, I could change the frame to depress key in onInputDown event thru my mouse, in other method, how do you depress "C0" or other keys if Phaser received an input from MIDI events like "C0" and Phaser will lookup for an items with that name and depress or change frame to 1?

[proyb2]

I found iterate is implemented for my use case, is it more efficient than looping thru array method?

keyboard.iterate("name", "C4", 2).frame=1

[Daniel Belohlavek]

Try creating the keys inside an array, something like keys[index] = keyboard.create...

Then, since you know the order of the keys you could say that index 0 is key C0 (or whatever, I have no knowledge of any musical instrument)

You could even use an object:

var obj = {    "C0": 0,    "C7": 7}keys[ obj["C0"] ]; // it's the same as doing keys[0] and would return the button saved at index 0 of the array.

With this you can make a function that takes a parameter of type string (the key name), gets the correct button and changes its frame.

[proyb2]

Wow, that's a great idea! Thanks!

[Daniel Belohlavek]

@proyb2 no problem, please remember to set the topic as answered to help future readers ^^