Getting Started with MultiTouch ActionScript 3.0 Programming in FlashDevelop

Hello everyone , as I have said I have a lot of interest in programming for MultiTouch applications . Thats why i got started off with ActionScript 3.0 programming and also with python (PyMT framework). Both are really sweet . But as i know java and javascript I am a little biased towards ActionScript now . I have started programming in both. If you are also new to this and want to get a kick start then nuigroup.com/forums would be the best place for you(check all the sticky posts).

In this post I will be writing about the ActionScript 3.0 programming . If you have a flash IDE(CS3 or CS4) and want to get started off then check this. There check all the sticky posts , they surely will be very helpful. Also you may be interested in the wiki entry where it is well explained step-by-step.

Well as professionals suggest to start with Flash Develop and everyone will not be able to use flash CS4 or CS4(looking at its cost) I have got started with FlashDevelop .This post by Christian Moore got me started with Flash-Develop’s environment .But I was not able to start with the touchlib’s programming . After some issues and changes It all works fine for me now. So i decided to post a tutorial on this, so that other newbies like me do not get into same trouble .

So to get the touchlib’s AS3 library for multi-touch go to this page and download the /AS3 folder to your computer as per the steps mentioned there. Let us called the folder MTProject. So now my MTProject folder will have the folders named “ext“,”int” and “src” and a file called flashapp.flp . Then start a new AS3 project in flashDevelop and give the location as the MTProject folder. Now check that your project contains all the folders(i.e ext,int,src and some extra made by FLashDevelop).So now right-click on the src folder.Add a new class and give it a name “MyTouchApp”.Now go to project->properties->Add Classpaths and then add the “int” and “ext” folders. This is the step 7 in this post. Now you can paste the codesnippets in the post and change the package statement i.e make the statement package app.demo.MyTouchApp as only package. Now right click on the file and select “Always Compile” . Now if out of curiosity if you run the project , you will find it working fine but not reacting to the touch events (i.e circles will not appear in the very first code). This is where i got stuck.Then i found out that we have not done the step 14,15 and 16.So to solve the problem you have to create a new Sprite which is same as the rectangle drawn in flash. The code snippet for adding a rectangle is

var rect:Sprite    = new Sprite();
rect.graphics.beginFill(0x000000,1);
rect.graphics.drawRect(0,0,1024,768);
this.addChild(rect);

Now if you run the program it should run fine. Now if you also want to follow the step 4 of the original post you can use the code

[SWF(width="1024", height="768", frameRate="31", backgroundColor="#FFFFFF")]

Now you should have no problem with the FlashDevelop . So i will conclude by posting the full code of the MyTouchApp.as .

package { //adds a circle where you touch (no resize)

import flash.display.*;
import flash.events.*;
import flash.net.*;
import flash.geom.*;

[SWF(width="1024", height="768", frameRate="31", backgroundColor="#FFFFFF")]

public class MyTouchApp extends Sprite {

public function MyTouchApp() {

//--------connect to TUIO-----------------
TUIO.init(this,'localhost',3000,'',true);
trace("MyTouchApp Initialized");
//----------------------------------------

var bg:Sprite    = new Sprite();
bg.graphics.beginFill(0x000000,1);
bg.graphics.drawRect(0,0,1024,768);
this.addChild(bg);

addEventListener(TouchEvent.MOUSE_DOWN, touchDown); //run touchdown, when touched
}

public function touchDown(e:TouchEvent):void{

var curPt:Point = parent.globalToLocal(new Point(e.stageX, e.stageY)); //convert touch points to x,y

var circle:Sprite = new Sprite(); //create a new sprite

circle.graphics.lineStyle(10, 0xff0000); //set line width to 10px and red
circle.graphics.drawCircle(0,0,40); // draw a 40px circle
circle.x = curPt.x; //put it where touch is (x cord)
circle.y = curPt.y; //put it where touch is (y cord)

addChild(circle); //add the circle where touch happened

}
}
}

Please suggest to improve and if any problems in following the post ,feel free to ask . Thanks Everybody.Even i am a newbie and I need suggestion .

Next PHP Project : PHP Online Quiz – A very simple online Quiz module

Sourcecode : here

This project is also a part of my COP (Computer Oriented Project). This project aims to have a simple web interface which will authenticate the user then a number of multipe choice questions appears on the page with the “Next” and “Finish” option. Once the person has given the test his account will be locked and he will not be able to appear test again. And on the very first page (/index.php) you can have a new account registeration . And also this can have an admin view , on which an admin (with attrib=2) can be able to view the status of this. In the admin page he can see the status (if the student has finished the exam or not) and the score (if finished) along with the user-name of the student. Again I am telling that this is one of my first codes so this may not be helpful in learning , but look through it to know how it works .(P.S : The design is very simple and not attractive). As this is very simple sql structure you can make a database named “objective” and import this code into that using phpmyadmin.If you need information about the installation of the servers please refer to my first post .

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";

--
-- Database: `objective`
--

-- --------------------------------------------------------

--
-- Table structure for table `accounts`
--

CREATE TABLE IF NOT EXISTS `accounts` (
  `username` varchar(64) NOT NULL,
  `password` varchar(64) NOT NULL,
  `attrib` int(11) NOT NULL,
  `answered` varchar(1) NOT NULL,
  `correct` int(11) NOT NULL,
  `locked` varchar(1) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

-- --------------------------------------------------------

--
-- Table structure for table `questions`
--

CREATE TABLE IF NOT EXISTS `questions` (
  `auto_ID` int(10) unsigned NOT NULL auto_increment,
  `ques` varchar(64) NOT NULL,
  `opt_1` varchar(64) NOT NULL,
  `opt_2` varchar(64) NOT NULL,
  `opt_3` varchar(64) NOT NULL,
  `opt_4` varchar(64) NOT NULL,
  `opt_ans` int(11) NOT NULL,
  PRIMARY KEY  (`auto_ID`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;

Also me and my friends are planning to do this from scratch using PHP .We are thinking of having a server with admin module and we will be having specific time for each exam. Also i am planning to design it well so that it does not look boring ( ) .This will be using AJAX .So again a new area to learn . We will try to make it interactive . Also we are planning to do have a page for the admin , in which he can upload the question (may be in .csv or .sql format not yet decided). Once it is ready i will be posting about that .

Comments awaited