Archives for category: Flash / AIR

Yesterday I tried to create an Adobe AIR project with a background image.   I have resized the image (bg.width = 1024; bg.height = 768) and it looks jagged and with the blank area on the left. May I know why this happen?

Regards,
Siew Wei


If there is a blank area on the left, I’m pretty sure you missed out this code:-

stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;

Resize the image BEFORE you use it in ActionScript. Jaggedness is expected to happen when you resize it in ActionScript. Usually, when we resize an image, we would apply a blur filter afterwards.  But ActionScript doesn’t do that itself – as there are some situations where it might not be what you want.  So if you want to anti-alias any jaggedness – you’d apply the filter yourself.

I know that you’re writing an app for both tablet devices and smaller mobile screens. The plan is to work from a resolution of 1024×768 for the iPad/Android Tablet. Resize down to 960×640 for the iPod/iPhone, or whatever the resolution of the Android phone is. There will be jaggedness, but perhaps it won’t be noticeable on a smaller screen. But if you see jaggedness, apply a BlurFilter(). (maybe try stage.quality=StageQuality.BEST; … but I don’t think this will make a difference).

I’m writing a game where a spinning top moves around a circular area consisting of tiles.  (Each type of tile will have different properties).  I want to arrange the tiles in concentric circles.  How do I make this?  (By the way, I’m looking for a way to write it to the iPhone as well as Android).

Puteri


If I were writing this project, I might consider writing it in Pure ActionScript / AIR for mobile, rather than writing it in two or more Native SDKs.  Furthermore, ActionScript 2D graphics is both feature packed, and easy to use.

Even if you wanted to stick to Native SDKs (for possible reasons of speed and memory efficiency) – you could still generate the tiles using ActionScript, and convert them to image files.

But given that your game consists of primarily one moving object – I think ActionScript/AIR is the way to go.

So, How do you draw a circle?  The standard equation for a circle is:-

x = r Cos(theta),   y = r Sin(theta)

I’m going to use bezier curves to construct the circular segments.  And you mentioned that each tile is made of a different material… this is where features of ActionScript graphics come into their own.  I’m going to use a bitmap fill.

package  {

import flash.display.Sprite;
import flash.display.Graphics;
import flash.display.StageAlign;
import flash.display.StageScaleMode;

import asfiles.SpinningTopBackground;

public class SpinningTop extends Sprite {

protected static const TO_RADIAN:Number=Math.PI/180;
protected static const RADIUS:Number=16.0;

public function SpinningTop() {
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;

graphics.beginFill(0xffffff);
graphics.drawRect(0,0,384,512);
new SpinningTopBackground(this,384/2,512/2-64);
}

}
}
package asfiles {

	import flash.display.Sprite;
	import flash.display.Graphics;
	import flash.filters.BevelFilter;

	public class SpinningTopBackground extends Sprite {

		[Embed(source="materials/bricks.png")]
		protected static const BRICKS:Class;

		[Embed(source="materials/grass.png")]
		protected static const GRASS:Class;

		[Embed(source="materials/metal.png")]
		protected static const METAL:Class;

	protected static const MATERIALS:Array = [BRICKS, METAL, GRASS];
	protected static const OUTLINE:uint = 0x333333;
	protected static const TO_RADIAN:Number=Math.PI/180;
	protected static const RADIUS:Number=40.0;

	public function SpinningTopBackground(screen:Sprite,xx:Number,yy:Number) {
		screen.addChild(this);
		x=xx;y=yy;
		for(var i:int=0;i<3;i++) segment(this,0,i,3);
		for(var j:int=0;j<6;j++) segment(this,1,j,6);
		for(var k:int=0;k<9;k++) segment(this,2,k,9);
		for(var l:int=0;l<14;l++) segment(this,3,l,11);

		filters=[new BevelFilter(1.0)];
	}

	protected function segment(graf:Sprite,i:int,j:int,segs:Number,Material:Class = null):void {
		const st:Number = 12;
		var segangle:Number=360/segs; //Math.pow(3,i+1);
		var coshalf:Number=1/Math.cos(TO_RADIAN*segangle/2);
		var o:Number;
		if (i==0) o=0.0; else o=-TO_RADIAN*20;
		graf.graphics.lineStyle(1,OUTLINE);
		if (!Material) graf.graphics.beginBitmapFill((new MATERIALS[Math.floor(MATERIALS.length*Math.random())]).bitmapData);
		else graf.graphics.beginBitmapFill(new Material().bitmapData);
		graf.graphics.moveTo((st+(i+1)*RADIUS)*Math.sin(o+TO_RADIAN*j*segangle),(st+(i+1)*RADIUS)*Math.cos(o+TO_RADIAN*j*segangle));
		graf.graphics.lineTo((st+i*RADIUS)*Math.sin(o+TO_RADIAN*j*segangle),(st+i*RADIUS)*Math.cos(o+TO_RADIAN*j*segangle));
		graf.graphics.curveTo(coshalf*(st+i*RADIUS)*Math.sin(o+TO_RADIAN*(j+.5)*segangle),coshalf*(st+i*RADIUS)*Math.cos(o+TO_RADIAN*(j+.5)*segangle),(st+i*RADIUS)*Math.sin(o+TO_RADIAN*(j+1)*segangle),(st+i*RADIUS)*Math.cos(o+TO_RADIAN*(j+1)*segangle));
		graf.graphics.lineTo((st+(i+1)*RADIUS)*Math.sin(o+TO_RADIAN*(j+1)*segangle),(st+(i+1)*RADIUS)*Math.cos(o+TO_RADIAN*(j+1)*segangle));
		if (i==0) {
			coshalf=1/Math.cos(TO_RADIAN*segangle/4);
			graf.graphics.curveTo(coshalf*(st+RADIUS)*Math.sin(TO_RADIAN*(j+.75)*segangle),coshalf*(st+RADIUS)*Math.cos(TO_RADIAN*(j+.75)*segangle),(st+RADIUS)*Math.sin(TO_RADIAN*(j+.5)*segangle),(st+RADIUS)*Math.cos(TO_RADIAN*(j+.5)*segangle));
			graf.graphics.curveTo(coshalf*(st+RADIUS)*Math.sin(TO_RADIAN*(j+.25)*segangle),coshalf*(st+RADIUS)*Math.cos(TO_RADIAN*(j+.25)*segangle),(st+RADIUS)*Math.sin(TO_RADIAN*j*segangle),(st+RADIUS)*Math.cos(TO_RADIAN*j*segangle));
		} else graf.graphics.curveTo(coshalf*(st+(i+1)*RADIUS)*Math.sin(o+TO_RADIAN*(j+.5)*segangle),coshalf*(st+(i+1)*RADIUS)*Math.cos(o+TO_RADIAN*(j+.5)*segangle),(st+(i+1)*RADIUS)*Math.sin(o+TO_RADIAN*j*segangle),(st+(i+1)*RADIUS)*Math.cos(o+TO_RADIAN*j*segangle));
	}
}
}

It’s not April 1st? – is it?  Miraculously, and out of the blue, Apple seem to have reversed their decision banning Flash applications from the iPhone.  I’ve heard reports of some Flash CS5 apps being accepted now.

http://news.cnet.com/8301-30685_3-20015954-264.html