Member Avatar for Member #334542

I am doing a flash slideshow animation which animate from left to right by changing their x position. And I am using the tween which is a package of flash

import import fl.transitions.*;
import fl.transitions.easing.*;

while moving the image is jerking a lot.

How to avoid flickering of images while moving from one position to another position, it sucks me.

I know it will be possible with bitmap class, but It have some limitation of image width. I had attached 6 images one by one. Please help me to solve this. I am using AS3.0

  • 4 Contributors
  • 4 Replies
  • 103 Views
  • 2 Weeks Discussion Span
  • Latest Post Latest Post by surindersharma

Dani AI

Generated

@Member334542 — the jerky movement you describe is common with Flash when images are rendered at non-integer positions, re-rasterised with filters, or when large vector/movieclip content is redrawn each frame. @Iamthwee and were right to look at the tween engine and framerate, but the flicker usually comes down to how Flash is rasterising each frame. Try the checklist below (ordered by easiest-to-test).

  1. Force integer positioning (pixel snapping). Fractional x/y values cause sub-pixel anti-aliasing that looks like jitter. Round the position each frame or in the tween onUpdate:
  stage.addEventListener(Event.ENTER_FRAME, onEF);
  function onEF(e:Event):void {
    myImage.x = Math.round(myImage.x);
  }
  1. Use cacheAsBitmap and smoothing selectively. Rasterise static vectors before moving:
  myClip.cacheAsBitmap = true;
  var bmp:Bitmap = loader.content as Bitmap;
  if (bmp) bmp.smoothing = true;

Warning: caching big movieclips uses memory and looks bad when you scale/rotate them. Disable cache for those cases.

  1. Remove filters while animating. Filters (shadows, glows) force re-caching every frame and cost CPU. Set myClip.filters = [] during motion and reapply afterwards.

  2. If images are large, tile them or use a blit approach. Instead of one oversized BitmapData (which hits platform limits), keep a composition Bitmap sized to the viewport and copyPixels or draw the smaller source bitmaps into it each frame. That avoids vector rasterisation and gives very smooth translation.

  3. Check embedding and stage settings. Test without HTML wmode=transparent/opaque (they can disable hardware compositing) and experiment with Stage.quality for a balance between quality and speed.

If you try the above and still see problems, post a small test SWF or the way images are loaded/structured so others (for example or ) can point out a specific bottleneck.

Recommended Answers

All 4 Replies

Member Avatar for Member #46692

Here would be my suggestions.

1) Check the frame rate. Changing it might help the jerkiness.
2) Use a better, bug free tweener class like tween lite. I've read the tweener engine that ships with flash is buggy.
3) Use bitmaps maybe?
4) Attach your file so we can peruse?

Member Avatar for JasonHippy

Hey Raja, I don't know if you've already solved this but I'd pretty much agree with Iamthwee!

Upping the frame rate of your final movie should minimise jerkiness a little. And it is true, the default flash tweens can be a little buggy at times...Also Tween lite is a very good alternative tweening library...very fast in AS3 too!

Otherwise, if you're only going to be using one or two different tweens in your swf, then you could take a look at Robert Penners website:
http://robertpenner.com/easing/

He's released several tweening algorithms for AS1 and AS2 over the years. They are pretty simple (in the sense that there isn't much code!) and quite fast (especialy when ported to run in the AS3 engine)...Some of the code can be quite hard to understand in places as he's used one letter variable names for a lot of the parameters and calculations in the algorithms...This was because longer variable names incurred a considerable performance hit in AS1/AS2. So to maximise the speed and efficiency of .swf's using his easing algorithms, he used single letter variable names.

If you want to know what the single letter parameters and variables represent, take a look at the free chapter from his book (also downloadable from his site...Click on the "Tweening chapter of my book" link!)

Anyway, take a look at his site, if you like the look of any of his tweens, all you do is download the AS2 versions of his tweens, port them to AS3 (by enclosing the AS2 code with "Package { }"...It's really that easy!) and then use them in your app. That way you'll knock a few Kb from your final .swf's size.

To round up, if you want to use loads of different tweens, check out a library like tween lite.
If you only want to use one or two different tweens, you could take a look at Robert Penners easing algorithms and use one or two of those and save a few Kb in your final .swf.

I don't think that using bitmaps makes any difference though..But other than that I concur with Iamthwee!
Cheers for now,
Jas.

Member Avatar for Member #334542

I agree with you both, Some other tweening classes like TweenLite, Tweener(Caurina) will help. Increasing framerate is not helped me. I know Bitmap class is a good method to solve this, but Size of the movieclip have some limitations.

Anyway thanks for both, my client will not notice anything and not giving any feedback, so cheers for now!

Member Avatar for surindersharma

Hey Raja, I don't know if you've already solved this but I'd pretty much agree with Iamthwee!

Upping the frame rate of your final movie should minimise jerkiness a little. And it is true, the default flash tweens can be a little buggy at times...Also Tween lite is a very good alternative tweening library...very fast in AS3 too!

Otherwise, if you're only going to be using one or two different tweens in your swf, then you could take a look at Robert Penners website:
http://robertpenner.com/easing/

He's released several tweening algorithms for AS1 and AS2 over the years. They are pretty simple (in the sense that there isn't much code!) and quite fast (especialy when ported to run in the AS3 engine)...Some of the code can be quite hard to understand in places as he's used one letter variable names for a lot of the parameters and calculations in the algorithms...This was because longer variable names incurred a considerable performance hit in AS1/AS2. So to maximise the speed and efficiency of .swf's using his easing algorithms, he used single letter variable names.

If you want to know what the single letter parameters and variables represent, take a look at the free chapter from his book (also downloadable from his site...Click on the "Tweening chapter of my book" link!)

Anyway, take a look at his site, if you like the look of any of his tweens, all you do is download the AS2 versions of his tweens, port them to AS3 (by enclosing the AS2 code with "Package { }"...It's really that easy!) and then use them in your app. That way you'll knock a few Kb from your final .swf's size.

To round up, if you want to use loads of different tweens, check out a library like tween lite.
If you only want to use one or two different tweens, you could take a look at Robert Penners easing algorithms and use one or two of those and save a few Kb in your final .swf.

I don't think that using bitmaps makes any difference though..But other than that I concur with Iamthwee!
Cheers for now,
Jas.

thanks for nice information you explain it very well

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.