Posted By

Activetuts on 11/19/10

Tagged

Versions (?)

Last Edited at 11/19/10 07:18pm

Statistics

Viewed 543 times

Favorited by 0 user(s)

Related snippets

Remove an Object, iPhone App Style

/ Published in: ActionScript 3

How to create a delete effect inspired by the iPhone iOS interface. By Carlos Yanez.

Highlighted TextExpand

private var timer:Timer = new Timer(1000); //The time to hold the mouse button down the icon in order to show the delete button
private var tiltTimer:Timer = new Timer(80); //The time of the rotation change, makes the shake effect
private var rotationValue:int = 2; //The rotation desired for the shake
private var tween:Tween; //A tween instance to animate the alert dialog

public function Main():void
{

/*Hide elements*/
	hideObjects(appIcon.deleteButton, deleteAlert, darkScreen);

/*Add necesary listeners*/
	deleteAlert.cancelBtn.addEventListener(MouseEvent.MOUSE_UP, cancel);
	deleteAlert.deleteBtn.addEventListener(MouseEvent.MOUSE_UP, deleteApp);
	appIcon.deleteButton.addEventListener(MouseEvent.MOUSE_UP, displayAlert);
	appIcon.addEventListener(MouseEvent.MOUSE_UP, stopTimer);
	appIcon.addEventListener(MouseEvent.MOUSE_DOWN, pressAndHold);
}

/*Hide objects function*/
private function hideObjects(...objects):void
{
	for(var i:int = 0; i < objects.length; i++)
	{
		objects[i].visible = false;
	}
}

/*Starts the timer when the mouse is down*/
private function pressAndHold(e:MouseEvent):void
{
	timer.start();
	timer.addEventListener(TimerEvent.TIMER, showDeleteButton);
}

/*If mouse up, timer stops*/
private function stopTimer(e:MouseEvent):void
{
	timer.stop();
}

/*if the hold timer completes, the delete button is shown and the icon shakes*/
private function showDeleteButton(e:TimerEvent):void
{
	timer.stop();
	appIcon.deleteButton.visible = true;
	tiltTimer.addEventListener(TimerEvent.TIMER, tilt);
	tiltTimer.start();
}

/*The shake function, changes the rotation every time the tiltTimer completes*/
private function tilt(e:TimerEvent):void
{
	appIcon.rotation = rotationValue;
	rotationValue *=  -1;
}

/*if the delete button is pressed the alert is shown*/
private function displayAlert(e:MouseEvent):void
{
	deleteAlert.visible = true;
	darkScreen.visible = true;
	tween = new Tween(deleteAlert,"scaleX",Back.easeOut,0.3,1,0.5,true);
	tween = new Tween(deleteAlert,"scaleY",Back.easeOut,0.3,1,0.5,true);
}

/*removes the icon if the delete button in the alert is clicked*/
private function deleteApp(e:MouseEvent):void
{
	hideObjects(appIcon, deleteAlert, darkScreen);
}

/* removes the alert, stops the tilt and doesn't remove the icon, called by the cancel button*/
private function cancel(e:MouseEvent):void
{
	hideObjects(appIcon.deleteButton, deleteAlert, darkScreen);
	tiltTimer.stop();
	appIcon.rotation = 0;
}

URL: http://active.tutsplus.com/tutorials/actionscript/quick-tip-remove-an-object-iphone-app-style/

Report this snippet Tweet