AS3 bitmap blur/feedback effect 1111 Responses

Last post: 3 months, 3 weeks ago | Thread started: Jul 29, 08, 9:53 a.m.

RespondNew TopicDisable Images

• modern

  Anyone seen anything like this:
  http://labs.bigspaceship.com/sou…
  For AS3?
  Mostly interested in slowly blurring the background like the default effect shown on that link.

  Cheers!

  Jul 29, 08, 9:53 a.m. – Permalink

• maximillion_

  all you need

  http://blog.greensock.com/tweenf…

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 9:55 a.m. – Permalink

• modern

  tweenfilterlite doesn't look the same.
  This is the equivalent written in processing

  void setup() {
  // ignore this bit
  size(200, 200);
  background(102);
  stroke(255);
  strokeWeight(3);
  }

  void draw() {
  // this bit!
  filter(BLUR, 1);
  // draw some shit
  if(mousePressed) {
  line(mouseX, mouseY, pmouseX, pmouseY);
  }
  }

  So instead of clearing the frame and redrawing, you blur the frame then place the next frame on top, so there is a blurred feedback left behind.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:03 a.m. – Permalink

• maximillion_

  you wanted AS3 not processing?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:04 a.m. – Permalink

• modern

  Yeah AS3, I'm just saying thats how its done in Processing.
  Tweenfilterlite looks like a system for tweening the flash filters, the Visualizer and the Processing code are doing something different.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:06 a.m. – Permalink

• kult

  Max, my guess is there's 2 layers going on here. The first layer is a large bitmap object, and the second layer is the most recent "frame" of the beachball.

  Every frame, redraw the entire scene to the bitmap object and apply your blending/blur effects, then draw your beachball layer to a new position. I somewhat doubt they're completely retaining a long array of beachballs and applying a blur filter to each one consecutively each frame. But hey, ya never know.

  • Yep thats whats going on– modern1/6

    so they are basically taking a screen capture and placing the bitmap behing the beachball object? i would think that would cause it to slow wayyyy down if it was constantly applying bitmap images to the background.– lvl_132/6

    .. to slow wayyyy down if it was constantly applying bitmap images to the background.– lvl_133/6

    but i guess if it was only 1 bitmap constantly updating then that would not cause slowdown. meh, this is too advanced for me.– lvl_134/6

    Yeah, just one bitmap dude, not a bitmap for each object :)– kult5/6

    gotcha' :)– lvl_136/6

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:07 a.m. – Permalink

• maximillion_

  with tween filter lite you can use the blurFilter to achieve the same effect on a single object:

  TweenFilterLite.to(yourObj, 1, {blurFilter:{blurX:5, blurY:5, quality:2}});

  this blurs yourObj over 1 second from its current state to having 5px blur along x and y

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:08 a.m. – Permalink

• maximillion_

  you might be right kult, i wouldnt suggest using frames in As3 but you can. TweenFilterLite is very efficient and you can tween thousands of objects at any one time often without a great overhead.

  Once you have set the blur to the object you dont need to go back to it as kult suggests - you can use an easing equation to achieve this over time.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:12 a.m. – Permalink

• modern

  I'm sure TweenFilterLite could recreate the effect with the beachball, but I'm doing quite a lot of tweening inside the movieclip already so this is a much more processor efficient way to achieve the effect.
  The AS2 version of Visualizer works fine, I just need to find something to do it in AS3 so the developers don't kick off about AS2 and refuse to touch it.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:14 a.m. – Permalink

• mikotondria3

  Mr Brimelow is your man:
  http://www.gotoandlearn.com/play…

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:15 a.m. – Permalink

• kult

  You can use the easing equation to individually affect each object and "forget about it" so they take care of themselves, and then use onComplete to kill off the object once it's blurred out.. however.. there is always debate about this sort of performance vs. manipulating bitmap data. Both have their ups and downs.

  • exactly - a comparison test would get the best answer– maximillion_

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:15 a.m. – Permalink

• maximillion_

  I saw some nice computeSpectrum examples using the bitmap class as you described kult - very impressive

  • something like this http://www.gskinner.…– maximillion_

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJul 29, 08, 10:20 a.m. – Permalink