topical media & game development

topical media & game development

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

#graphic-flex-image-effects-08-Flex-MedusaStare.ax

#graphic-flex-image-effects-08-Flex-MedusaStare.ax [swf] [flash] flex


  package {
  
          import aeon.animators.Tweener;
  
          import aether.effects.convolution.EmbossEffect;
          import aether.utils.Adjustments;
          import aether.utils.ImageUtil;
  
          import flash.display.Bitmap;
          import flash.display.BitmapData;
          import flash.display.BitmapDataChannel;
          import flash.display.BlendMode;
          import flash.filters.BlurFilter;
          import flash.filters.DisplacementMapFilter;
          import flash.geom.Point;
  
          [SWF(width=800, height=640, backgroundColor=0x000000)]

Demonstrates how a stone texture may be generated from an image by using an image of a head, generating a texture from it, then tweening from the original image to the stone image.


  
          public class @ax-graphic-flex-image-effects-08-Flex-MedusaStare extends graphic_flex_image_effects_08_Flex_AbstractImageLoader {

Constructor. Sends page of image to load to super constructor.


  
                  public function @ax-graphic-flex-image-effects-08-Flex-MedusaStare() {
                          super("graphic-flex-image-effects-08-assets-fear.png");
                  }

Called when image completes loading in super class. Adds image, then calls makeStone() to generate the stone texture and start it animating.


  
                  override protected function runPostImageLoad():void {
                          addChild(_loadedBitmap);
                          makeStone();
                  }

Generates a stone texture from the loaded image, then tweens it into view.


  
                  private function makeStone():void {
                          // make initial blank image the size of stage which will be used for displacement
                          var map:BitmapData = new BitmapData(stage.stageWidth, stage.stageHeight, true, 0x00000000);
                          // clone blank image so it is same size, to be used to draw stone texture
                          var stone:BitmapData = map.clone();
                          // draw loaded image into map, then make it grayscale
                          map.draw(_loadedBitmap);
                          Adjustments.desaturate(map);
                          // add some low contrast grayscale noise
                          stone.noise(int(new Date()), 100, 150, BitmapDataChannel.RED, true);
                          // blur noise and and displace it using grayscale version of loaded image
                          ImageUtil.applyFilter(stone, new BlurFilter(2, 2));
                          ImageUtil.applyFilter(
                                  stone,
                                  new DisplacementMapFilter(
                                          map,
                                          new Point(),
                                          BitmapDataChannel.RED,
                                          BitmapDataChannel.RED,
                                          150,
                                          150
                                  )
                          );
                          // reduce contrast of grayscale image then overlay it to produce lights and darks
                          // in displaced stone image
                          Adjustments.adjustContrast(map, -0.2);
                          stone.draw(map, null, null, BlendMode.OVERLAY);
                          // apply emboss effect using ConvolutionFilter to create more 3D, tactile surface
                          new EmbossEffect(1).apply(stone);
                          // increase brightness of grayscale image, then overlay it on displaced texture
                          Adjustments.setLevels(map, 0, 75, 150);
                          stone.draw(map, null, null, BlendMode.MULTIPLY);
                          // use alpha channel from original image
                          ImageUtil.copyChannel(map, stone, BitmapDataChannel.ALPHA);
  
                          // add stone image on top of loaded image with 0 alpha, then tween it to full alpha
                          var bitmap:Bitmap = new Bitmap(stone);
                          bitmap.alpha = 0;
                          addChild(bitmap);
                          new Tweener(bitmap, {alpha:0}, {alpha:.9}, 5000).start();
                  }
                  
          }
  
  }

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.