SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    May 2006
    Location
    Australia
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Rotating a Circle 360degrees

    I am trying to create a animation where a circular cog shape rotates 360 degrees cleanly.

    Basically I've imported the shape, converted it to a movie clip, and added keyframes every 10 frames, at each keyframe i've set the transform rotate to 90 degree additions.

    So frame 10 has rotation set at 90, frame 20 set at 180, frame 30 set at 270, & frame 40 set at 360.

    The cog rotates, BUT it slightly moves in position (appears to wobble 1 pixel from its initial position) doesn't rotate smoothly, and it appears to stutter at the start of the animation when it loops.

    The circle is measurement is perfect (its a perfect circle) so I don't know where the wobble effect is comming from, and i'm really unsure as to how to make the rotation look a LOT smoother.

    Any help would be appreciated

    cheers

  2. #2
    SitePoint Wizard jim_morrison3's Avatar
    Join Date
    Apr 2004
    Location
    UK
    Posts
    2,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi! instead of creating an animation that many frame long instead you could have done it easily using the following script

    Code:
    this.onEnterFrame=function(){
    cog_mc._rotation++; //cog_mc is the instance name of your cog movie clip
    }
    Good Luck!
    There are things known and Things unknown
    And in between are the Doors.
    I love hand Coding.

  3. #3
    SitePoint Enthusiast
    Join Date
    May 2006
    Location
    Australia
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi I just tried this (below)


    Code:
    this.onEnterFrame=function(){
    cognition_logo_cog_MC._rotation++; //cog_mc is the instance name of your cog movie clip
    }
    but got the following error

    **Error** Scene=Scene 1, layer=cognition logo, frame=1:Line 1: Statement must appear within on/onClipEvent handler
    this.onEnterFrame=function(){

    Total ActionScript Errors: 1 Reported Errors: 1


    Apologies but I'm new to actionscripting.

    Thanks for your help so far

  4. #4
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Seems like you may have put the script in the wrong place.

    Either place the code on a frame in the movie clip and use:
    Code:
    this.onEnterFrame = function(){
    	this._rotation++;
    }
    Or place on the root in a frame and use
    Code:
    this.onEnterFrame = function(){
    	movieClipInstance._rotation++;
    }
    movieClipInstance is the instance name you gave the movieclip.

    You could if you need to change the speed use setInterval instead of onEnterFrame.

    Bare in mind the functionality will change and depend on how you have your movieclip and root time frame.

  5. #5
    SitePoint Enthusiast
    Join Date
    May 2006
    Location
    Australia
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks very much That worked perfectly.

    Moving on though, I need to skew the circle to the side, is there an easier & more accurate way of doing this other than the modify > tranform > rotate and skew tool?

  6. #6
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Never approached this but it can be done via Action Script. I would guess it would use some, if not a lot of trigonometry. Using scales and rotation may provide a simpler solution. I'm sure someone here will have approached this before but if not maybe a quick google would scream something.

  7. #7
    SitePoint Enthusiast
    Join Date
    May 2006
    Location
    Australia
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok so here's what I've come up with (thanks to your help)

    http://www.philtrated.com/stage/cog.swf

    Now (example below) I'm trying to skew the circle (1) to perfectly match (2)



    But it's almost impossible to match using the modify > tranform > rotate and skew tool.

    Is it possible to do in actionscript? I've done a quick search but couldn't find anything.

    Thanks

  8. #8
    SitePoint Wizard jim_morrison3's Avatar
    Join Date
    Apr 2004
    Location
    UK
    Posts
    2,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There is a Displacement filter in Flash 8 through which you can skew your objects dynamically. Try a google search for some examples.
    Good Luck!
    There are things known and Things unknown
    And in between are the Doors.
    I love hand Coding.

  9. #9
    SitePoint Enthusiast
    Join Date
    May 2006
    Location
    Australia
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok thanks heaps


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •