FORUMS: list search recent posts

How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?

COW Forums : Adobe Flash

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Vishal Medepalli
How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 8, 2012 at 4:08:01 pm

I'm working on an interactive project. I want to add multiple buttons on this wheel so than when the user drags the wheel and choose a button(i'e blade) which in turn is connected to a flv playback menu which plays the video that the user has choosen from the list, which is displayed on the wheel.

Here's the swf file --> 4386_rota.swf.zip


Return to posts index

demetri tashie
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 11, 2012 at 12:39:18 pm

your buttons/movieclip symbols can be placed right on top of ( or replace) each 'blade'.

then they are treated like any other movieclip/button symbol: give them each an instance name and script them in actionscript (an event listener listens for them being clicked, and then tells the video player component to play whichever flv/f4v you want)

some simple code like this could make it work ( note: this code was written outside of flash, so typos and mistakes are likely!):
vid1.addEventListener(MouseEvent.CLICK, changeVideo);
vid2.addEventListener(MouseEvent.CLICK, changeVideo);
vid3.addEventListener(MouseEvent.CLICK, changeVideo);

function changeVideo(e:MouseEvent):void {
flvPlayer.source=e.target.name+".flv";
flvPlayer.play();
}


this assumes a FLVPlayback Component with an instance name of 'flvPlayer' and the movieclips/buttons using instance names that correspond to the flvs being played, thus movieclip/button "vid1" plays "vid1.flv" etc

i hope that helps


Return to posts index

Vishal Medepalli
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 13, 2012 at 6:49:31 am

Will that serve the purpose i want to accomplish?
The wheel is interactive, as in the user can "DRAG" the wheel, as in spin it around its center of axis like in the attachment.

Is there something like "Parenting" (After Effects Property) in Flash? such that the blades have the property to behave as a button and it can be rotated along the center? along with the wheel?



Return to posts index


demetri tashie
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 13, 2012 at 4:29:00 pm

i don't use AE that much so i won't comment on that

however, what i explained is exactly possible and seems to be what you are asking for. rather than the major problem being having the 'blades' act as 'buttons' ( very easy in flash ) , it is rather to have the 'button' distinguish between a desired 'button click' as opposed to the 'mouse-down' of the drag and drop.

attached is an example illustrating it all. it was an old fashioned rotating television dial that i created for someone years ago. inside the dial movieclip, which has the instance name 'mc', i placed several new movieclips to act as 'buttons'. these are the 'colored blades'. they in turn have instance names corresponding to thier colors. i also added a semi-transparent mask to give it more of the feel of your original example where only half the dial was shown

4399_rotatingdial2.swf.zip

you can rotate the dial with the 'blades' at will via drag and drop ( you already know how to do that...)
each 'blade/button' is coded to listen for a double click, which will trigger a function, in this case to write the name of the 'button' double clicked in the dynamic text field.

if you are not sure how to target one movieclip symbol inside another, it is done with 'dot syntax'.
therefore the movieclip symbol with instance name 'red' inside the dial clip named 'mc'
would be targetted like this: mc.red
example:
mc.red.addEventListener(MouseEvent.DOUBLE_CLICK, myFunction);

i hope that makes more sense and helps


Return to posts index

Vishal Medepalli
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 16, 2012 at 9:47:58 am

Wow! Thank you Demetri. I'm a beginner in flash, just trying to learn few things. Could you please provide me with the .fla file for better understanding? Thanks.


Return to posts index

demetri tashie
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 16, 2012 at 6:50:07 pm

i am sorry i can't send the original .fla, as it was created for ( and paid for) as part of a job for someone else. i am glad to go over the steps on what to do again if you want. i am assuming that you created the original swf that you posted, so you understand how to make your movieclip, and to create its 'drag and drop' capabilities ( which in these cases equates as a rotating dial)

some steps:
1) create your dial with 'blades'. turn that into a movieclip symbol and give it an instance name ( for instance mine was called 'mc').

2) edit that movieclip symbol ('mc') by double clicking it and enter it's timeline.

3) create a new shape or whateer and turn that into a movieclip symbol. give it an instance name ( mine was called 'red'). place/position it on top of one of the 'blades' of the dial

4) repeat step 3 for all the blades.

5) write your actionscript code for the 'drag and drop' /rotating dial. you already know this since it was part of the original swf that you posted

6) write code for the movieclip/blade/buttons to do what you want them to do. for instance:
mc.red.addEventListener(MouseEvent.DOUBLE_CLICK, myFunction);

function myFunction(e:MouseEvent):void {
myVideoPlayer.source="redVideo.f4v";
myVideoPlayer.play();
}


i hope that helps. if there are specifics you don't undetrstand, please ask


Return to posts index


Vishal Medepalli
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 17, 2012 at 11:48:40 am

I'm getting the error "The class or interface 'MouseEvent' could not be loaded." Maybe because the publish settings are set to AS2 as the drag/rotation code is written in AS2.

wheel.getMouseRotation = function(){
var x = this._parent._xmouse-this._x;
var y = this._parent._ymouse-this._y;
return Math.atan2(y,x)*180/Math.PI;
};
wheel.positionToMouse = function(){
this._lastrotation = this._rotation;
this._rotation = this.getMouseRotation() - this._clickrotation;
};
wheel.spin = function(){
this._rotation += this.spinSpeed;
this.spinSpeed *= .9;
};
wheel.onPress = function(){
this._clickrotation = this.getMouseRotation() - this._rotation;
this.onEnterFrame = this.positionToMouse;
};
wheel.onRelease = wheel.onReleaseOutside = function(){
this.spinSpeed = this._rotation - this._lastrotation;
if (this.spinSpeed > 180) this.spinSpeed -= 360;
else if (this.spinSpeed < -180) this.spinSpeed += 360;
this.onEnterFrame = this.spin;
};


Return to posts index

demetri tashie
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 17, 2012 at 12:39:29 pm

yes. AS2 and AS3 are not the same, nor not interchangable. sorry, buti do not work in AS2.

maybe try re-posting, but be sure to put AS2 in your subject line

good luck with the project


Return to posts index

Vishal Medepalli
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 18, 2012 at 10:49:22 am

Oh, okay. :(

I found the code for "Drag-Rotation" in AS3.


import flash.events.MouseEvent;

var ax,ay,bx,by,thetaA,thetaB,oldRotation:Number;

function dragger(evt:MouseEvent)
{
if (evt.type == MouseEvent.MOUSE_DOWN)
{

oldRotation = wheel.rotation;
ax = stage.mouseX - wheel.x;
ay = stage.mouseY - wheel.y;
thetaA = Math.atan2(ay,ax) * 180 / Math.PI;

stage.addEventListener(MouseEvent.MOUSE_MOVE,dragger);
stage.addEventListener(MouseEvent.MOUSE_UP,dragger);
}
else if (evt.type == MouseEvent.MOUSE_UP)
{
stage.removeEventListener(MouseEvent.MOUSE_MOVE,dragger);
stage.removeEventListener(MouseEvent.MOUSE_UP,dragger);
}
else if (evt.type == MouseEvent.MOUSE_MOVE)
{
bx = stage.mouseX - wheel.x;
by = stage.mouseY - wheel.y;
thetaB = Math.atan2(by,bx) * 180 / Math.PI;


if(thetaA<0) {
thetaA += 360;
}else {
thetaA -= 360;
}
if(thetaB<0) {
thetaB += 360;
}else {
thetaB -= 360;
}

var angleDiff:Number = thetaB - thetaA;
wheel.rotation = oldRotation + angleDiff;
}
}

wheel.addEventListener(MouseEvent.MOUSE_DOWN,dragger);



Works good so far, but is there any way to make it even simpler? Like the one i've posted which is in AS1.

And I'm able to make the double click part work in my swf. Should I set the enable DOUBLE_CLICK boolean value to true for the double click to work? Like in the swf you provided?


Return to posts index


demetri tashie
Re: How can i add buttons to every blade of this interactive wheel? And in turn i want to connect the buttons to a flv playback menu. Any suggestions?
on Jul 19, 2012 at 2:28:14 am

now i'm confused. so you WERE looking for the code for the drag? i assumed you had that worked out since you made it work in the first sample. did you create that sample or did someone else? and it was in AS1 ??????

i haven't looked at deeply or tested your code, so, presuming it works, it might be able to make it simpler, but i am not sure what the goal is there.

and yes, you do need to enable the double click for it to work correctly


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]