Archive for the 'FLAs' Category

AS3: Papervision3D FreeCamera Movement

May 16, 2008 in AS3, FLAs, Papervision3D | Show Some Love | | 4 Comments »

View Example
Get Papervision3D [Tutorial]
Get TweenMax
Download Source

One of the things that I was curious about when using Papervision3D was how the camera moves around and tracks other objects. Originally I set up a Camera3D object and moved it around to look at other objects but that wasn’t playing well with the way I was tweening the camera around to look at certain objects. I switched over to the FreeCamera3D and this was the result. Read more »

Tags: , ,

AS3: DistortionTweener Done Easier In Papervision3D

May 9, 2008 in AS3, FLAs, Papervision3D | Show Some Love | | 2 Comments »

View Example
Get Papervision3D [Tutorial]
Get TweenMax
Download Source

Well, the first thing I have done in Papervision3D is a replica of what I essentially did with the DistortionTweener (or actually the reason I made the DistortionTweener). It is much easier to do and takes a lot less to do (the original DistortionTweener, with research, took me about a week to do while this took me about an hour). Keep in mind the code is probably not super optimized as this is THE first thing I’ve done with PV3D. Read more »

Tags: , ,

AS3: Image Slider

March 18, 2008 in AS3, FLAs | Show Some Love | | 43 Comments »

View Example 1
View Example 2
Download Source

UPDATE 9:52 PM CST: I just fixed a small issue so if you downloaded the source please re-download it. Thanks.

The image slider is a small project I made for a friend of mine. It works in a similar fashion to the iTunes cover flow except that it does not do a trapezoidal distortion on the images. Read more »

Tags: , , , ,

AS3: Double AxisScroller

November 7, 2007 in AS3, FLAs | Show Some Love | | 3 Comments »

View Preview
Download Example Files
Download AxisScroller

I've been asked a couple of times to show a demonstration of the AxisScroller being used on both the X and Y axis. Here is an example of it in AS3. For some reason I haven't been able to replicate this behavior with the AS2 version but I'll continue to look into it further and see if I can come up with a solution. If anyone else wants to take a shot at it, by all means please do so.

PLAIN TEXT
Actionscript:
  1. import flash.events.MouseEvent;
  2. import fl.transitions.Tween;
  3. import fl.transitions.easing.*;
  4. import com.reintroducing.ui.AxisScroller;
  5.  
  6. stop();
  7.  
  8. var optionalObjV:Object = new Object(
  9. {
  10.     scrollType: "easing",
  11.     isTrackClickable: true,
  12.     useArrows: true,
  13.     upArrow: content_mc.up_btn,
  14.     downArrow: content_mc.down_btn,
  15.     continuousScroll: false,
  16.     easeFunc: Regular.easeOut,
  17.     duration: .25,
  18.     arrowMove: 50,
  19.     scaleScroller: true,
  20.     autoHideControls: true
  21. });
  22.  
  23. var optionalObjH:Object = new Object(
  24. {
  25.     scrollType: "easing",
  26.     isTrackClickable: true,
  27.     useArrows: true,
  28.     upArrow: content_mc.left_btn,
  29.     downArrow: content_mc.right_btn,
  30.     continuousScroll: false,
  31.     easeFunc: Regular.easeOut,
  32.     duration: .25,
  33.     arrowMove: 50,
  34.     scaleScroller: true,
  35.     autoHideControls: true
  36. });
  37.  
  38. var scrollerV:AxisScroller = new AxisScroller(stage, content_mc, content_mc.scrollerV_mc, content_mc.movie_mc, content_mc.trackV_mc, content_mc.mask_mc, "y", optionalObjV);
  39. var scrollerH:AxisScroller = new AxisScroller(stage, content_mc, content_mc.scrollerH_mc, content_mc.movie_mc, content_mc.trackH_mc, content_mc.mask_mc, "x", optionalObjH);
  40.  
  41. reset_btn.addEventListener(MouseEvent.MOUSE_DOWN, resetScroller);
  42.  
  43. function resetScroller($evt:MouseEvent):void
  44. {
  45.     scrollerV.reset();
  46.     scrollerH.reset();
  47. }

Tags: , ,

AS3: Event Responsive Menu Extended

November 6, 2007 in AS3, FLAs | Show Some Love | | No Comments »

View Example
Download Example Files
Download Environment
Download TweenLite

Last time we looked at the Event Responsive Menu we made a menu system that responded to events based on what button was clicked. This was a working version but rather ugly/useless in the sense that we didn't add any actual functionality to it so now we are going to go ahead and load the button data from an XML file and then use TweenLite to "spruce" them up a bit with fades of color.

Let's take a look at the XML file we are going to use to store the button data:

PLAIN TEXT
XML:
  1. <menu>
  2.     <item name="Home" url="http://www.google.com" />
  3.     <item name="Portfolio" url="http://www.google.com" />
  4.     <item name="Services" url="http://www.google.com" />
  5.     <item name="About" url="http://www.google.com" />
  6.     <item name="Contact" url="http://www.google.com" />
  7. </menu>

Then here is the Main.as file:

PLAIN TEXT
Actionscript:
  1. /**
  2. * @author Matt Przybylski [http://www.reintroducing.com]
  3. * @version 1.0
  4. */
  5.  
  6. package com.reintroducing.menusystem
  7. {
  8.     import flash.display.Sprite;
  9.     import flash.events.Event;
  10.     import flash.net.URLLoader;
  11.     import flash.net.URLRequest;
  12.    
  13.     import com.reintroducing.debug.Environment;
  14.     import com.reintroducing.menusystem.events.MenuButtonEvent;
  15.     import com.reintroducing.menusystem.ui.MenuButton;
  16.    
  17.     public class Main extends Sprite
  18.     {
  19. //- PRIVATE & PROTECTED VARIABLES -------------------------------------------------------------------------
  20.  
  21.         private var _holder:Sprite;
  22.         private var _numButtons:int;
  23.         private var _menuData:XML;
  24.         private var _env:Environment;
  25.        
  26. //- PUBLIC & INTERNAL VARIABLES ---------------------------------------------------------------------------
  27.        
  28.         public static const DEFAULT_NAME:String = "com.reintroducing.menusystem.Main";
  29.        
  30. //- CONSTRUCTOR -------------------------------------------------------------------------------------------
  31.    
  32.         public function Main()
  33.         {
  34.             this._numButtons             = 5;
  35.             this._holder                = new Sprite();
  36.             this._holder.x = this._holder.y = 10;
  37.             this._env                  = Environment.getInstance();
  38.            
  39.             this._env.setPaths("../", "");
  40.            
  41.             this.addChild(this._holder);
  42.            
  43.             this.loadXML();
  44.         }
  45.        
  46. //- PRIVATE & PROTECTED METHODS ---------------------------------------------------------------------------
  47.        
  48.         private function loadXML():void
  49.         {
  50.             var xmlURL:String = this._env.basePath + "xml/menuData.xml";
  51.             var xmlLoader:URLLoader = new URLLoader();
  52.            
  53.             xmlLoader.addEventListener(Event.COMPLETE, createMenu);
  54.             xmlLoader.load(new URLRequest(xmlURL));
  55.         }
  56.        
  57.         /**
  58.          * Lays out the buttons on the stage and initializes them.
  59.          */
  60.         private function createMenu($evt:Event):void
  61.         {
  62.             var xPosition:int = 160;
  63.             var buttonURL:String;
  64.             var buttonName:String;
  65.            
  66.             this._menuData = new XML($evt.target.data);
  67.            
  68.             for (var i:int = 0; i <this._numButtons; i++)
  69.             {
  70.                 buttonURL = this._menuData.item[i].@url;
  71.                 buttonName = this._menuData.item[i].@name;
  72.                
  73.                 var mb:MenuButton = new MenuButton();
  74.                 mb.x = (i * xPosition);
  75.                 mb.create(("mb" + i), buttonName, i, buttonURL);
  76.                 mb.addEventListener(MenuButtonEvent.CLICKED, onMenuButtonClicked);
  77.                
  78.                 this._holder.addChild(mb);
  79.             }
  80.         }
  81.        
  82. //- PUBLIC & INTERNAL METHODS -----------------------------------------------------------------------------
  83.    
  84.        
  85.    
  86. //- EVENT HANDLERS ----------------------------------------------------------------------------------------
  87.    
  88.         /**
  89.          * Reacts when a button is clicked to set all the buttons to their proper state.
  90.          */
  91.         private function onMenuButtonClicked($evt:MenuButtonEvent):void
  92.         {
  93.             for (var i:int = 0; i <this._numButtons; i++)
  94.             {
  95.                 var mb:MenuButton = MenuButton(this._holder.getChildByName("mb" + i));
  96.                
  97.                 if ($evt.params.id == i)
  98.                 {
  99.                     mb.setDisabled();
  100.                 }
  101.                 else
  102.                 {
  103.                     mb.setEnabled();
  104.                 }
  105.             }
  106.         }
  107.    
  108. //- GETTERS & SETTERS -------------------------------------------------------------------------------------
  109.    
  110.        
  111.    
  112. //- HELPERS -----------------------------------------------------------------------------------------------
  113.    
  114.         public override function toString():String
  115.         {
  116.             return "com.reintroducing.menusystem.Main";
  117.         }
  118.    
  119. //- END CLASS ---------------------------------------------------------------------------------------------
  120.     }
  121. }

Here is the updated MenuButton.as file:

PLAIN TEXT
Actionscript:
  1. /**
  2. * @author Matt Przybylski [http://www.reintroducing.com]
  3. * @version 1.0
  4. */
  5.  
  6. package com.reintroducing.menusystem.ui
  7. {
  8.     import flash.display.MovieClip;
  9.     import flash.events.MouseEvent;
  10.     import flash.net.URLRequest;
  11.     import flash.net.navigateToURL;
  12.     import flash.text.TextField;
  13.    
  14.     import com.reintroducing.menusystem.events.MenuButtonEvent;
  15.    
  16.     import gs.TweenLite;
  17.    
  18.     public class MenuButton extends MovieClip
  19.     {
  20. //- PRIVATE & PROTECTED VARIABLES -------------------------------------------------------------------------
  21.  
  22.         private var _id:int;
  23.         private var _url:String;
  24.        
  25. //- PUBLIC & INTERNAL VARIABLES ---------------------------------------------------------------------------
  26.        
  27.         public static const DEFAULT_NAME:String = "com.reintroducing.menusystem.ui.MenuButton";
  28.        
  29.         // instances
  30.         public var bg_mc:MovieClip;
  31.         public var title_txt:TextField;
  32.        
  33. //- CONSTRUCTOR -------------------------------------------------------------------------------------------
  34.    
  35.         public function MenuButton()
  36.         {
  37.             super();
  38.            
  39.             this.init();
  40.         }
  41.  
  42. //- PRIVATE & PROTECTED METHODS ---------------------------------------------------------------------------
  43.        
  44.         private function init():void
  45.         {
  46.             this.buttonMode = true;
  47.             this.mouseChildren = false;
  48.             this.setEnabled();
  49.         }
  50.        
  51.         /**
  52.          * Resets the button to its original state.
  53.          */
  54.         private function reset():void
  55.         {
  56.             TweenLite.to(this.bg_mc, .25, {mcColor: 0x999999});
  57.         }
  58.        
  59.         /**
  60.          * Executed when you mouse over the button.
  61.          */
  62.         private function doMouseOver($evt:MouseEvent):void
  63.         {
  64.             TweenLite.to(this.bg_mc, .25, {mcColor: 0x333333});
  65.         }
  66.        
  67.         /**
  68.          * Executed when you mouse out of the button.
  69.          */
  70.         private function doMouseOut($evt:MouseEvent):void
  71.         {
  72.             this.reset();
  73.         }
  74.        
  75.         /**
  76.          * Executed on release of the button.
  77.          */
  78.         private function doClick($evt:MouseEvent):void
  79.         {
  80.             navigateToURL(new URLRequest(this._url));
  81.            
  82.             this.dispatchEvent(new MenuButtonEvent(MenuButtonEvent.CLICKED, {id: this._id}));
  83.         }
  84.        
  85. //- PUBLIC & INTERNAL METHODS -----------------------------------------------------------------------------
  86.    
  87.         /**
  88.          * Assigns the button a name and ID for later retrieval through events.
  89.          */
  90.         public function create($name:String, $title:String, $id:int, $url:String):void
  91.         {
  92.             this.name       = $name;
  93.             this._id          = $id;
  94.             this.title_txt.text = $title;
  95.             this._url       = $url;
  96.         }
  97.        
  98.         /**
  99.          * Allows the button to be clickable and functional.
  100.          */
  101.         public function setEnabled():void
  102.         {
  103.             this.enabled = true;
  104.             this.reset();
  105.            
  106.             this.addEventListener(MouseEvent.MOUSE_OVER, doMouseOver);
  107.             this.addEventListener(MouseEvent.MOUSE_OUT, doMouseOut);
  108.             this.addEventListener(MouseEvent.CLICK, doClick);
  109.         }
  110.        
  111.         /**
  112.          * Disables the button and kills its events.
  113.          */
  114.         public function setDisabled():void
  115.         {
  116.             this.enabled = false;
  117.            
  118.             this.removeEventListener(MouseEvent.MOUSE_OVER, doMouseOver);
  119.             this.removeEventListener(MouseEvent.MOUSE_OUT, doMouseOut);
  120.             this.removeEventListener(MouseEvent.CLICK, doClick);
  121.         }
  122.    
  123. //- EVENT HANDLERS ----------------------------------------------------------------------------------------
  124.    
  125.        
  126.    
  127. //- GETTERS & SETTERS -------------------------------------------------------------------------------------
  128.    
  129.         public function get id():int
  130.         {
  131.             return this._id;
  132.         }
  133.        
  134.         public function set id($val:int):void
  135.         {
  136.             this._id = $val;
  137.         }
  138.    
  139. //- HELPERS -----------------------------------------------------------------------------------------------
  140.    
  141.         public override function toString():String
  142.         {
  143.             return "com.reintroducing.menusystem.ui.MenuButton";
  144.         }
  145.    
  146. //- END CLASS ---------------------------------------------------------------------------------------------
  147.     }
  148. }

The MenuButtonEvent file has stayed the same so I won't post it for the sake of brevity. If you'd like to see anything else added to this example, let me know as I've probably taken it as far as it will go for the time being.

Tags: , , , ,

AS3: Event Responsive Menu

October 29, 2007 in AS3, FLAs | Show Some Love | | 3 Comments »

View Example
Download Example Files

Normally when I build menus for my projects I usually end up having to keep track of which button is selected and disable it while clicking on another button will disable that one and re-enable the one previously selected. I could build that very quickly in AS2 but have yet to try it out in AS3 so I put together this little example that would demonstrate how I'd do it in the new age. It is made up of three classes:

Main.as

PLAIN TEXT
Actionscript:
  1. /**
  2. * @author Matt Przybylski [http://www.reintroducing.com]
  3. * @version 1.0
  4. */
  5.  
  6. package com.