Penner AS2 ProFMX: Vector3d ExampleDemo of the AS2 classes for ProFMX chapter 5.

Graphic3d

Click image to view demo


Below you will find the updated code for the example at the end of Chapter 5 to show you how to use the two classes from the Chapter 5 Penner AS2 post.

Add the following code on the first frame of a blank MovieClip centered on the stage.
Make sure to have another MovieClip exported for ActionScript with the linkage name of “dot” in the library to be used as the actual 3d graphic.

import com.robertpenner.display.Graphic3d;

function getWallPoints (width:Number, height:Number, xDivisions:Number, yDivisions:Number):Array {
	var x:Number;
	var y:Number;
	var z:Number;
	var pts:Array = new Array();
	var depth:Number = 0;

	for (var i:Number = 0; i <= xDivisions; i++) {
		for (var j:Number = 0; j <= yDivisions; j++) {
			x = width * (i / xDivisions - .5);
			y = height * (j / yDivisions - .5);
			z = 0;
			pts.push(new Graphic3d(x, y, z, this, "dot", depth++));
		}
	}
	return pts;
}

function arrayRotateXY (particleArr:Array, angleX:Number, angleY:Number):Void {
	var i:Number = particleArr.length;
	while (i--) {
		particleArr[i].position.rotateXY(angleX, angleY);
		particleArr[i].render();
	}
}

var wall:Array = getWallPoints (100, 100, 4, 6);

this.onEnterFrame = function() {
	this.arrayRotateXY (wall, _ymouse/20, _xmouse/20);
}
Posted in Flash | 1 Comment
Penner AS2 ProFMX: Chapter 5: Vectors in Three DimensionsAS2 classes for ProFMX Chapter 5.

Chapter 5 of Robert Penner’s Programming Flash MX extends upon what was learned in Chapter 4 by adding a third dimension to vectors.

This chapter contains two classes: Vector3d, which will be included in the com.robertpenner.geom namespace, and Graphic3d, which will be included in the com.robertpenner.display namespace.

Documentation:
com.robertpenner.geom.Vector3d
com.robertpenner.display.Graphic3d

Source:
Penner AS2 ProFMX: Chapter 5 Classes

Dependencies:
Penner AS2 ProFMX: Chapter 4 Classes
Penner AS2 ProFMX: Chapter 3 Classes

Posted in Flash | 1 Comment
FlashPaper Component 0.7.1Updated my FlashPaper component to fix a small bug.
UPDATE (April 22, 2007):
FlashPaper 0.8 has been released.

I have fixed a small bug that caused the FlashPaper component to not process a new documentPath if set dynamically before the component had completely loaded.

Description:
The FlashPaper component simplifies the process of working with the FlashPaper API and adds functionality either not documented or not provided in the API.

Installation:
- Unzip FlashPaper_0.7.1.zip
- DoubleClick on FlashPaper.mxp to install with the Extension Manager.

Documentation:
FlashPaper Component Documentation

Download FlashPaper

Posted in Flash | 15 Comments
Penner AS2 ProFMX: Chapter 4: Vectors in Two DimensionsAS2 classes for ProFMX Chapter 4.

Chapter 4 of Robert Penner’s Programming Flash MX begins to show you “how to break out of the world of one-dimensional variables and harness the power of two-dimensional data structures” with vectors.

This chapter contains one class: Vector, which will be included in the com.robertpenner.geom namespace.

Documentation:
com.robertpenner.geom.Vector

Source:
Penner AS2 ProFMX: Chapter 4 Classes

Dependencies:
Penner AS2 ProFMX: Chapter 3 Classes

Posted in Flash | Leave a comment
Penner AS2 ProFMX: Chapter 3: Trigonometry and Coordinate SystemsAS2 classes for ProFMX Chapter 3.

We’re officially starting with Chapter 3 instead of Chapters 1 or 2.
Chapter 1 is more of an overview of Robert Penner’s history and learning process.
Chapter 2 begins to teach Object Oriented Programming and some of Penner’s techniques to use OOP with AS1.
Since I am converting the AS1 classes to AS2, we can leave off that chapter. If you want an overview of OOP, there are plenty of resources out there including multiple Flash AS2 books on the subject.

Chapter 3 lays out the framework for working with Trigonometry and Coordinate Systems in Flash. Both are essential throughout the rest of the book.

I’ve broken down the AS1 code in Chapter 3 into 3 seperate AS2 classes: Degree, MathUtil, and Polar, all of which will be included in the com.robertpenner.utils namespace.
(I won’t be walking you through too much of the usage of these classes, because they are covered in depth in the actual book. My documentation will include at least one usage of each method, but beyond that you really should buy the book.)

Documentation:
com.robertpenner.utils.Degree
com.robertpenner.utils.MathUtil
com.robertpenner.utils.Polar

Source:
Penner AS2 ProFMX: Chapter 3 Classes

Posted in Flash | 1 Comment
AS2 Resource for Robert Penner’s Programming Flash MXI've decided to make my way through the book and update all of his code to AS2.

Even though Robert Penner’s Programming Flash MX hit the store shelfs almost 4 years ago, I still find it one of the most advanced books on the subject to date. Obviously the biggest drawback is that all of the sourcecode is written in AS1, but Penner was using OOP techniques with Flash way before it was fashionable. His techniques in AS1 set the standard for much of the way the community is coding in AS2 to this date.

I’ve decided to make my way through the book and update all of his code to AS2. Obviously some of it already has been done for us… ie the Penner easing equations and the Tween class that’s included with Flash now. Some people have also converted the Vector classes to AS2, but I wanted to make a single location that people could go to and download all of the classes and documentation (as long as Robert Penner doesn’t mind). These classes will also be keeping the com.robertpenner namespace to obviously give credit where credit is due.

Keep your eye out, because I’ll be starting shortly. So dust the book off the shelf or better yet go buy the book and follow along.

Posted in Flash | 2 Comments
FlashPaper Component TutorialHere's a tutorial walking you through the usage of the complete API for my FlashPaper component.

I originally started working on my FlashPaper component right when FlashPaper 2 was released. It seemed like a great technology that was easy to load into your Flash project but a little awkward to customize and interact with. Before you could call any FlashPaper methods on the doc, you had to setup an interval to watch for the FlashPaper interface to exist and once it became available, kill the interval, create a variable reference to the interface within the doc, and then start calling the methods on that interface. This quickly became repetitive to include in each project that I wanted to add FlashPaper to. So I set about to create a wrapper for the FlashPaper api, and eventually this wrapper became my FlashPaper component.

When I first created this component, I wanted to obviously make it the best I could, and at the time I thought that extending the Version 2 component architecture would be the best. I quickly realized that this bloated the final swf (adding around 29k) and wasn’t even necessary for this component. Although I realized this, it took me about a year before I found the time to get back to it and completely rewrite it from the ground up to be based on MovieClip instead. This final component now adds only about 8k vs the original 29k and adds 2 new classes and more features that the original did not have. So all in all, not too bad of a rewrite.

With this tutorial I thought I would walk you through the different options that are available with my new component.

For any steps you don’t fully understand read my documentation.

Part 1:

  1. First download the component from my site and install it by doubleclicking on the mxp file in the zip.
  2. If you don’t already have a FlashPaper swf somewhere on your computer, create one using the FlashPaper 2 program or right click and save this link.
  3. Open up a new movie in Flash and drag an instance of the FlashPaper component onto the stage from the “Components” window. (Also notice the pretty new icon I added to the component ;) ).
  4. Click on the component on stage and give it an instance name of “document_fp”.
  5. Click on the “Parameters” tab for the component and customize the FlashPaper component parameters to your liking … making sure to change the “Document Path” to the FlashPaper swf from step number 2. Make sure that you don’t add the actual link from step 2 into the path parameter because that FlashPaper 2 swf does not have AllowDomains added into it and it will lock up when you try to publish. Instead use a local FlashPaper swf on your computer.
  6. “Current Zoom” can be set to “width”, “page”, or a number from 10 to 999 (which is a percentage value).
  7. If you look closely in the “UI Elements” parameter window that opens there are 12 UI elements that you can set the visibility to but in the original FlashPaper api you can only access 10. I have added “Brand” and “Close”. The former allows you to hide the Macromedia brand logo at the top left of the FlashPaper document and the latter allows you to add a close button to the document.
  8. Test your movie and keep trying the different settings to see how it affects the FlashPaper document. Just this alone without the component would have been a little annoying to code up in Flash.

Part 2:

  1. Click on the “UI Elements” parameter and make sure to set “Close” to true.
  2. Add a movieclip or button to the stage and give it an instance name of “button01_mc”.
  3. Add an actions layer to your Flash movie.
  4. On the actions frame, add the following code:

    			button01_mc.onRelease = function() {
    				document_fp.showUIElement("Close", false);
    				document_fp.traceUIElements();
    			}
    			
  5. Test the movie and once the FlashPaper doc has loaded click on your button… you should see the close button disappear. You can do that with any of the elements in the “UI Elements” parameter popup.

Part 3:

With the following steps, replace the content within the “onRelease” function with the content from each step and test each one individually to see the possibilities of the component.

  1. Download or create another FlashPaper swf and save it next to the first FlashPaper swf you created. Name it “FlashPaperContent02.swf”.

    			document_fp.documentPath = "FlashPaperContent02.swf";
    			document_fp.load();
    			
  2.  
    			document_fp.load("FlashPaperContent02.swf");
    			
  3.  
    			trace(document_fp.borderThickness);
    			document_fp.borderThickness = 20;
    			
  4.  
    			trace(document_fp.borderColor);
    			document_fp.borderColor = 0xFF0000;
    			
  5.  
    			trace(document_fp.getViewerType());
    			
  6.  
    			trace(document_fp.getViewerVersion());
    			
  7.  
    			trace(document_fp.getCurrentPage());
    			document_fp.setCurrentPage(5);
    			
  8.  
    			trace(document_fp.getNumberOfPages());
    			
  9.  
    			trace(document_fp.getLoadedPages());
    			
  10.  
    			document_fp.printTheDocument();
    			
  11.  
    			document_fp.currentZoom = "page";
    			trace(document_fp.currentZoom);
    			
  12.  
    			document_fp.setSize(300, 250);
    			
  13.  
    			document_fp.goToLinkTarget("http://www.yourpalmark.com");
    			
  14.  
    			document_fp.enableScrolling(false);
    			
  15.  
    			trace(document_fp.getCurrentTool());
    			document_fp.setCurrentTool("select");
    			
  16.  
    			var sel:FlashPaper.SelectionRange = new FlashPaper.SelectionRange();
    			sel.headPageIdx = 1;
    			sel.headCharIdx = 20;
    			sel.tailPageIdx = 5;
    			sel.tailCharIdx = 999999;
    			document_fp.setTextSelectionRange(sel, true);
    			trace(document_fp.getTextSelectionRange());
    			
  17.  
    			trace(document_fp.getSelectedText());
    			
  18. This will only work if your FlashPaper document has a sidebar.

    			trace(document_fp.getSidebarWidth());
    			document_fp.setSidebarWidth(10);
    			
  19.  
    			trace(document_fp.getFindText());
    			document_fp.setFindText("the");
    			
  20.  
    			document_fp.findNext();
    			
  21.  
    			trace(document_fp.getVisibleArea());
    			document_fp.setVisibleArea(document_fp.getVisibleArea());
    			

Part 4:

Events.

	var flashpaperListener:Object = new Object; 

	flashpaperListener.onLoadStart = function(evtObj) {
		trace("onLoadStart: " + evtObj.target);
	}
	flashpaperListener.onLoadProgress = function(evtObj) {
		trace("onLoadProgress: " + evtObj.target);
	}
	flashpaperListener.onLoadComplete = function(evtObj) {
		trace("onLoadComplete: " + evtObj.target);
	}
	flashpaperListener.onLoadInit = function(evtObj) {
		trace("onLoadInit: " + evtObj.target);
		document_fp.borderThickness = 20;
		document_fp.move(0,50);
	}
	flashpaperListener.onLoadError = function(evtObj) {
		trace("onLoadError: " + evtObj.target);
	}
	flashpaperListener.onUnload = function(evtObj) {
		trace("onUnload: " + evtObj.target);
	}
	flashpaperListener.onDisplay = function(evtObj) {
		trace("onDisplay: " + evtObj.target);
	}
	flashpaperListener.onPageChanged = function(evtObj) {
		trace("onPageChanged: " + evtObj.target);
	}
	flashpaperListener.onZoomChanged = function(evtObj) {
		trace("onZoomChanged: " + evtObj.target);
	}
	flashpaperListener.onSelection = function(evtObj) {
		trace("onSelection: " + evtObj.target);
	}
	flashpaperListener.onToolChanged = function(evtObj) {
		trace("onToolChanged: " + evtObj.target);
	}
	flashpaperListener.onEnableScrolling = function(evtObj) {
		trace("onEnableScrolling: " + evtObj.target);
	}
	flashpaperListener.onVisibleAreaChanged = function(evtObj) {
		trace("onVisibleAreaChanged: " + evtObj.target);
	}

	document_fp.addEventListener("onLoadStart",flashpaperListener);
	document_fp.addEventListener("onLoadProgress",flashpaperListener);
	document_fp.addEventListener("onLoadComplete",flashpaperListener);
	document_fp.addEventListener("onLoadInit",flashpaperListener);
	document_fp.addEventListener("onDisplay",flashpaperListener);
	document_fp.addEventListener("onLoadError",flashpaperListener);
	document_fp.addEventListener("onUnload",flashpaperListener);
	document_fp.addEventListener("onPageChanged",flashpaperListener);
	document_fp.addEventListener("onZoomChanged",flashpaperListener);
	document_fp.addEventListener("onSelection",flashpaperListener);
	document_fp.addEventListener("onToolChanged",flashpaperListener);
	document_fp.addEventListener("onEnableScrolling",flashpaperListener);
	document_fp.addEventListener("onVisibleAreaChanged",flashpaperListener);
	

And there you go. Play around and feel free to comment with your questions. Enjoy :)

Posted in Flash | 57 Comments
FlashPaper Component 0.7Complete rewrite of my FlashPaper component to extend MovieClip rather than UIComponent.
UPDATE (April 22, 2007):
FlashPaper 0.8 has been released.

I’m not exactly sure how many people are using my FlashPaper component but it has been in dire need of an update.
I originally built the component when I was still learning how to best write components, and at the time I thought the best way was to use the version 2 architecture. Unfortunately I soon realized that that meant a lot of unneeded overhead.

So version 0.7 is a complete rewrite from the ground up! No more version 2 architecture. It extends a custom Component class (that allows it to work with Flash Player 6) which in turn extends MovieClip directly. You should notice a significant filesize drop in the final swfs.

Changes:
1) Complete rewrite … extends MovieClip instead of using the V2 architecture.
2) Added the official Macromedia fix to a bug that can plague FlashPaper.
3) Updated the events and added a few more … NOTE: many event names have changed.
4) The interface IFlashPaper and the class SelectionRange have been implemented. This allows the return values from several of the methods to be accurate.
5) Fixed several small yet annoying bugs.
6) Completely updated the documentation.

Description:
The FlashPaper component simplifies the process of working with the FlashPaper API and adds functionality either not documented or not provided in the API.

Installation:
- Unzip FlashPaper_0.7.zip
- DoubleClick on FlashPaper.mxp to install with the Extension Manager.

Documentation:
FlashPaper Component Documentation

Download FlashPaper

Posted in Flash | 26 Comments
Flex from a Flash Developer’s PerspectiveIf you're not quite sure how Flex fits into your Flash world, you should definitely check these links out.

The following links were posted on FlashCoders by Adobe’s David Mendels in the recent Flex vs. Flash thread. Just in case you haven’t been following along with the thread and are confused about how Flex fits into the big Flash picture, these are great reads.

The first article has been around since Flex 1 but it’s the exact article I was looking for to explain what Flex is and how it can be used from the viewpoint of someone only familiar with Flash:

http://www.adobe.com/devnet/flex/articles/flash_perspective.html

More recent articles about Flex 2 and Flash (AS3):

http://www.adobe.com/newsletters/edge/may2006/section2.html

http://www.adobe.com/devnet/flash/articles/flex2_flash.html

Flex Builder 2 for Flash Programmers Breeze Presentation:

http://mmusergroup.breezecentral.com/p95561356/

Posted in Flash | Leave a comment
New HostJust finished transferring over my site to a new host.

Alright I’ve officially transferred over my site to a new host … NetworkRedux … and so far so good. Let me know if you run into any dead links or notice the site loading slower, etc. I’m still within the 30 day trial, but like I said I’m liking them so far, very affordable prices, good response time, and great features … I’m now updated to PHP5!

Posted in General | Leave a comment
  • Pages

  • Categories

  • Archives