Archive for the ‘as3’ Category

DataLib – New release of the loader class

Wednesday, November 25th, 2009

DataLib is a loader class that manages all load requests of your application and stores all loaded data for future requests. I´ve been using it previous version for about an year and half and it’s been working just fine, but I’ve decided to release a new version with more features and better usage.

The concept is simple. Every instance of DataLib have a load queue, and every instance is placed on a static queue that manages all requests. By default, 3 itens can be loaded at the same time, but you can change the number of slots as your wish. This way, one single giant file doesn’t hold your application until it is loaded, you can use other slots to load all other files that your application needs.

Another advantage is that you can load files from a dynamic url, i.e. a php that returns a xml or an image depending on what parameters you passes to it.

You can also get any loaded data from any place of your application even if you don’t have acess to the instance that requested that file. This is because every file is stored at the static class. Another thing is that if you call a file that has already been loaded, it takes the data from the DataLib library, saving some (or much) loading time. If you care about memory usage, you can delete data from the library whenever you want.
(more…)

FILE 2009 São Paulo

Friday, July 24th, 2009

I’m honored to announce that my graduation project was selected to FILE 2009 São Paulo. It were 6 months researching Alexander Calder’s work and 6 month building an interactive web art experience. At the time I was begining on PaperVision and WOWEngine, but at the end all the hard work worth it. After one year, I need make a few changes and corretct a lot of bugs for this festival. If I have some time, maybe remake everything.

Turn on your mic and blow some 3D mobiles!!!Ligue seu microfone e assopre alguns mobiles!!!

http://www.espacoemovimento.com.br

Dynamic Sound – Part 2

Wednesday, May 6th, 2009

Last post I started with the basic of dynamic sound in flash. Now we will do something more pratical with what we saw. We will create a piano that play notes by clicking or pressing keys.

I will not spend time creating the piano, so you can download it here.

This movie requires Flash Player 9

OK, starting here, we need to create a sound instance, a soundChannel instance, add the listeners and play the sound.

private var sound:Sound;
private var channel:SoundChannel;
 
public function Main():void{
	init();
 
	sound = new Sound();
	sound.addEventListener(SampleDataEvent.SAMPLE_DATA, onSampleData);
 
	channel = sound.play();
}
private function onSampleData(e:SampleDataEvent):void{
}

(more…)

Dynamic Sound – Part 1

Monday, April 27th, 2009

I spent the last couple weeks working on a project involving sound. Unfortunatly I can’t show it yet, but my goal was to play a bunch of musical notes at the same time in a especific interval. The first thing I tried to do was load a lot of samples and play then when I needed, but I got a slow performance with that. So my only solution was to dig out Google and Andre’s Michelle lab to know how to work with dynamic sound.

Well, I’m still learning, but I think that a lot of people would like to work with this and have no idea where to start, so I hope this post be usefull to you.

First thing we need to have in mind is that a sound is a wave, and this wave can have diferent shapes depending on the sound we are hearing.

sound_wave
(more…)

CustomCursor advanced

Wednesday, April 15th, 2009

OK, let’s begin talking about Design Patterns.

The best thing of OOP, is the capability to create something in way to reuse it in another situation by defining some patterns to follow. Basicly this is Design Patterns. There are several kinds of Patterns and one of them is the Singleton Pattern. It consists in create only one instance of a class and control it by global functions and properties. Unless you are using a multi-touch device, a good example of usage is a CustomCursor class. There is no need to create more than one instance of a custom cursor, because you can point to only one thing at time. However you can change your cursor behavior from anywhere in your application.

The Basics

Let’s create our Singleton class

package {
	import flash.display.Sprite;
 
	public class CustomCursor extends Sprite {
 
		private static var _instance:CustomCursor;
		public function CustomCursor(singleton:SingletonEnforcer):void{
		}
		public static function getInstance():CustomCursor{
			if(CustomCursor._instance == null){
				CustomCursor._instance = new CustomCursor(new SingletonEnforcer());
			}
 
			return CustomCursor._instance;
		}
	}
}
class SingletonEnforcer {
	public function SingletonEnforcer():void{
	}
}

(more…)

Tron game – first test

Monday, April 6th, 2009

A few days ago I’ve posted a PaperPlane experiment to test a flying ship control, but during the test it reminds me of Tron movie by the way it looks and I came with the ideia of turn that into a game. That’s why I put the trail on that plane.

Well, this is the first test of what might become a multiplayer game based on Tron. Maybe I’ll change the way it looks a little bit, but the hard work will be on AI, collision detection and communication between players. I hope not give up this project, but for now enjoy driving your bike.

tron

Stage.quality vs performance

Friday, April 3rd, 2009

One of the worst problem that any developer have to face is the performance of his applications. There are many factor contributing to a bad performance, one of them is graphic rendering.

Depending of what you’re doing, there’s a single line of code that solves this problem.

stage.quality = StageQuality.LOW

When you set the stage quality as low, you tell flash to render all vectors without anti-alias. This increases the application performance a lot. However this can makes your application looks like a crap depending of how you built it. There is a few things you can do to balance performance and visual quality.

The first thing you can do is set your text alias as ADVANCED or if it’s a static text Anti-alias for readability.

This movie requires Flash Player 9

Another tip is use bitmaps instead of vectors. Of course you must choose wisely whose graphics need to have a good quality and the size of them. Also, you can change you image quality at the properties panel to get a smaller file. Although you need to be carefull with this, because your bitmaps wont smooth if you rotate or scale them.

I didn’t research why exactly bitmaps don’t mess up when the stage quality is set to low, but I think it is because flash don’t need to calculate what color every pixel when they are displayed, all colors are already defined by the bitmap data.

With this thought, I created a high quality container class, called HQContainer, that renders all children at the quality you want (low, medium, high, best).

I have a 1000 boxes rotating. 990 of them are blue and have .05 of opacity. 10 of them are red and have a MouseEvent listener added.


(more…)

Matrix3D 101

Thursday, April 2nd, 2009

3D engines are very present in web applications these days. With ActionScript3 become possible develop faster 3d lib and, with that, the technology has spread widely thru the web. Today we have a lot of elaborated 3d engines like Papervision3D, Away3D, Sandy3D, Five3D, Alternativa and many others.

Their usage is quite simple, once that all calculations behind any lib is automatic e independent of the knowledge of the developer. But I think that is extremely important understand what happen in any application, lib or class, for the knowledge or to improve something that has already been created.

Despite the way that is built, any 3d engine have some elements in common, one of them is what we call Transformation Matrix. Yes, matrices. That thing that we learn on school and we don’t have any ideia of what it is until the day that we became developers. But before understand what is a transformation matrix, we must understand what it does. And for this we’ll think in a 3d engine in a basic way.

For example, let’s take a cube as a group of 8 connected points:

cubo
(more…)

Dynamic Custom Event

Tuesday, March 31st, 2009

Custom Events has become very useful when you’re building more complex applications.
You create them for especific cases and usualy they came with especific parameters.

Let’s say you create a custom event for a video player class and you use it to check the loading progress and video playback events, like play, pause, playback progress and playback complete. So when you create this event you must pass these parameters somehow, directly as an opitional parameter, inside an object, array or whatever you want.

Although, when you’re loading the video you need stream bytesLoaded and stream bytesTotal, but you don’t need the current time of playback. Other case is when you dispatch an event saying that the stream is paused or the playback is complete, you don’t need any other parameters. The problem (not a problem but a pain in the ass)  is that, for every param, you need to create a var in your class to store the value passed, otherwise you can’t pass any of them thru the event.

To avoid this you can set your custom event as a dynamic class. For those who don’t know, dynamic classes allow you to add properties at runtime, like movie clips. So you can pass any param thru an object as a opitional param of your event an store them in your class, like this:

package app.events {
	import flash.events.Event;
 
	dynamic public class CustomEvent extends Event {
		public function CustomEvent(type:String, bubbles:Boolean = false, cancelable:Boolean = false, param:Object = null):void{
			super(type, bubbles, cancelable);
 
			if(param){
				for(var i:String in param){
					this[i] = param[i];
				}
			}
		}
	}
}

So when you need to pass any value you should add it to an object:

dispatchEvent(new CustomEvent(CustomEvent.LOAD_PROGRESS, false, false, {bytesLoaded:135817, bytesTotal:521387}));
dispatchEvent(new CustomEvent(CustomEvent.VIDEO_PROGRESS, false, false, {currentTime:8.65}));
dispatchEvent(new CustomEvent(CustomEvent.PAUSE));

And you recieve then like this:

function onLoadProgress(event:CustomEvent):void{
	trace(Math.floor(event.bytesLoaded*100/event.bytesTotal)+"% loaded");
}
function onVideoProgress(event:CustomEvent):void{
	trace("Current time:", event.currentTime);
}
function onPause(event:CustomEvent):void{
	trace("Video paused");
}

Papervision3D – Max3DS Parser bug

Friday, March 27th, 2009

Since papervision added the Max3DS parser I’ve been working with it instead of DAE. Although there’s a bug that I noticed when I imported an asymmetric model to my scene. It appear to be mirrored at the X axis. I was in a rush so I took the easy way, and flipped my model before export the 3ds file.

After that I tried to chage the 3ds parser to import the file correctly but it was taking me much more time than I had, so I wrote this method to fix the mesh after parsing.

Here is my scene in 3D Max

objects

Note that the box is behind the teapot and the cylinder is in front of it.

Here is a picture of the PPV scene when I import them usign Max3DS parser.

objects_fliped

And here it is after running my script

objects_normalized

I didn’t test it for complex models, but this will work just fine in 90% of the cases.

Here is the script:

normalize(object3ds);
 
function normalize(max3ds:Max3DS):void{
	max3ds.rotationX = 0;
	max3ds.rotationY = 0;
	max3ds.rotationZ = 0;
 
	for each(var mesh:DisplayObject3D in max3ds.children){
		mesh.scaleZ *= -1;
		mesh.rotationX *= -1;
		mesh.rotationY *= -1;
		mesh.rotationZ *= -1;
 
		var m:Matrix3D =  new Matrix3D();
		m.calculateMultiply(m, Matrix3D.rotationX(mesh.rotationX*Math.PI/180));
		m.calculateMultiply(m, Matrix3D.rotationY(mesh.rotationY*Math.PI/180));
		m.calculateMultiply(m, Matrix3D.rotationZ(mesh.rotationZ*Math.PI/180));
 
		m.calculateMultiply(m, Matrix3D.scaleMatrix(mesh.scaleX, mesh.scaleY, mesh.scaleZ));
 
		for(var i:Number = 0; i<mesh.geometry.vertices.length; i++){
			var vertex:* = mesh.geometry.vertices[i];
 
			var vx :Number = vertex.x;
			var vy :Number = vertex.y;
			var vz :Number = vertex.z;
 
			var tx :Number = vx * m.n11 + vy * m.n12 + vz * m.n13 + m.n14;
			var ty :Number = vx * m.n21 + vy * m.n22 + vz * m.n23 + m.n24;
			var tz :Number = vx * m.n31 + vy * m.n32 + vz * m.n33 + m.n34;
 
			vertex.x = tx;
			vertex.y = ty;
			vertex.z = tz;
		}
 
 
		mesh.rotationX = 0;
		mesh.rotationY = 0;
		mesh.rotationZ = 0;
		mesh.scaleZ *= -1;
 
		mesh.geometry.flipFaces();
	}
}

Demo
Source