Integration Project
Draggable symbols
The most difficult task of the project to create draggable clips.- Drag one instance of each furniture graphics on the stage, hit F8 and transform it to the movie symbol. Call them mvChair, mvDrawer, mvSofa and so on.
- Open each movie for editing, add one more layer and add the button. Make this button invisible (leave only Hit state and delete Up, Over and Down stages). Each button must correspond to it's own symbol. So when you finish mvSofa, for example will include grSofa and invisible btSofa
- Add the following code to each button's press event handler.
on(press){ startDrag(this,true); if(Key.isDown(Key.RIGHT)) { this._rotation +=15;} if (Key.isDown(Key.LEFT)) { this._rotation -=15;} _root.textfurn.text = "desk"; }First line starts dragging – it is familiar to you. After that the code recognize if the right or left arrow key was pressed when the button is clicked and rotate the instance. The last line of code updates the text field which instance is named textfurn with the name of furniture item.You understand that the assigned value is different for each button – it may be "king size bed" or "armchair" for other buttons. It is important to remember those names because you will….
- Give any movie symbol (where the button is within) the linkage name which is the same as in the last line of the code. For our code example it will be desk
- For the same button in it's "release" handler add this code
on(release) { stopDrag(); if (eval(this._droptarget) == _root.basket ){ this.removeMovieClip(); } }This code is also familiar to your – if the furniture item is dropped over the basket instance – it will be simply deleted. - Test the movie – you shoud be able to drag furniture around the stage or rotate it by holding the left or right arrow and clicking the furniture item.
Below is the examples of draggable furniture items