Flash Blog by Jon Danao

мебели софияGoogleMaps API makes it really easy to place typical overlay objects onto the map like lines, markers, polygons and images (as ground overlays). In this article, we’ll plot Polylines, Markers and Polygons. GroundOverlay maybe included in the next topic as I still can’t figure out what image to use.

As I’ve said, plotting these types of objects are very easy to do. For Markers, you only need 1 point of longitude/latitude values. For Polylines, you need at least 2 points. For Polygons, you need at least 3. Since Polylines and Polygons need more than 1 point (lat,lng) they require values placed in arrays. After that, just invoke the addOverlay() method then you’re done!

Since the release of Google Maps API for Flash, I wanted to start incorporating this free service in my apps as I’ve seen a lot of good examples being built around. One thing to take note is this ActionScript API will only work in Flex and not in your usual Flash app.

Google API Key

Before you can even start coding, you need sign up for an API key so you can use their free service. Get the key here. You can get as many keys as you want using only 1 Google account. That being said, let’s get 2 keys instead - 1 for your site (http://www.mysite.com) and 1 for your local development server (http://localhost). This makes testing much faster rather than you constantly uploading files to your production server.

Google Maps API

Download the Google Maps API for Flash (Flex) here.

Next, unzip this archive file and you’ll see docs and lib folders. Inside the lib folder, there exists the map_flex_1_3.swc Flash component. Drag and drop this to the “libs” folder in your Flex project. Now you’re ready to code.

Continue reading »

Using Custom Events and DTOs are a way to move data around the application. With Flex’s event-driven architecture, a component can trigger an event and have it carry some data. This data will be encapsulated in a Data Transfer Object which most of these programmers consider as “dumb object” simply because it only serves as a data holder and does nothing more… no functionalities, no extra processing.

I would like to make this explanation and the accompanying codes AS SIMPLE AS POSSIBLE. I won’t be concerned with the aesthetics of the sample application, I’d like you to see it in barebones. So don’t complain if the app is ugly. For this discussion, let’s try to make a basic contact/email form. It should have fields for the recipient, sender, subject and body. This will not send the actual email but for purposes of demonstration, we’ll just populate the gathered data into another component.
Continue reading »

After viewing Lee Brimelow’s tutorial in building Custom Flash Panels, I thought I’d take a crack at the Flash JavaScript API because I usually have a pretty standard way of setting up my default movies. This is my first attempt so definitely there’s a lot of room for improvement.

There are currently 2 buttons in the panel - one to setup the movie and the other to insert a distribution licence agreement, which I normally do not put in my code but I thought it’ll be useful for other developers. I should start including this in my codes.
Continue reading »

I used to teach drag-n-drop funtionality using startDrag() and stopDrag() MovieClip methods. This is the easiest and fastest way but it tends to be choppy when the framerate is low. To solve this problem, you should employ MOUSE_MOVE event as shown in this tutorial by Flash and Math.

Their tutorial is great and I’ll use their concept in this article. But I don’t want the draggable object to snap to its center when dragging. I’ll put in a lockcenter option and a swapDepths() alternative.

Notes:

• We capture the broadcasted MOUSE_MOVE event from the stage and not from the draggable object. This ensures it will keep on dragging even if the mouse cursor moves outside the object. I guess Flash and Math already explained this.
• 1 is subtracted from numChildren because children are placed in an Array thus child index is length-1.
• updateAfterEvent() just makes things a lot smoother.

Here’s the code:

var object:Sprite;
var offsetX:Number;
var offsetY:Number;
var snapToCenter:Boolean = false;

for(var i:uint = 0; i < 20; i++)
{
	var newColor:uint = Math.random() * 0xFFFFFF;
	var newX:Number = Math.random() * stage.stageWidth;
	var newY:Number = Math.random() * stage.stageHeight;
	var newRadius:Number = Math.random() * 50 + 20;

	var sprite:Sprite = new Sprite();
	sprite.graphics.beginFill(newColor);
	sprite.graphics.drawCircle(0, 0, newRadius);
	sprite.graphics.endFill();
	sprite.x = newX;
	sprite.y = newY;
	sprite.buttonMode = true;
	sprite.addEventListener(MouseEvent.MOUSE_DOWN, drag);
	sprite.addEventListener(MouseEvent.MOUSE_UP, drop);

	addChild(sprite);
}

function drag(e:MouseEvent):void
{
	stage.addEventListener(MouseEvent.MOUSE_MOVE, move);
	object = e.target as Sprite;
	swap(e.target);
}

function drop(e:MouseEvent):void
{
	stage.removeEventListener(MouseEvent.MOUSE_MOVE, move);
}

function swap(o:*):void
{
	var highestDepth:uint = numChildren - 1;
	setChildIndex(o, highestDepth);

	if(snapToCenter)
	{
		offsetX = 0;
		offsetY = 0;

		o.x = mouseX;
		o.y = mouseY;
	}
	else
	{
		offsetX = o.x - mouseX;
		offsetY = o.y - mouseY;
	}
}

function move(e:MouseEvent):void
{
	object.x = mouseX + offsetX;
	object.y = mouseY + offsetY;
	e.updateAfterEvent();
}