ProgrammingCas Lemmens - Workshop 1

About me

Cas Lemmens

Got my knowledge on Programming by

Studying Computer Science at the university of Ghent

Studying and working with frameworks

Playing around in Flash

Why this workshop?

Lots of demand

We can build great things!

I feel lonely

Good point on your CV

The goal

Learn programming ffs!

Learning Object Oriented Programming

Learning Model - View - Controller

Managing a programming project

Exploring the Flash & Flex libraries

PlanningIntroduction to Flash/AS3

Programming process

Procedural programming

Variables

Mathematical functions

Boolean Logic

Loops

Conditionals

Arrays

Methods

Object based programming

Classes

Packages

Access control

Constructor

Properties

Object Oriented programming

Idea

Inheritance

Datatypes & Type checking

Interfaces

Static classses

Methods & scopes

Namespaces & packages

Events

Model - View - Controller

Doing a programming project

Flash & Flex libraries

PlanningIntroduction to Flash/AS3

Programming process

Procedural programming

Variables

Mathematical functions

Boolean Logic

Loops

Conditionals

Arrays

Methods

Object based programming

Classes

Packages

Access control

Constructor

Properties

Object Oriented programming

Idea

Inheritance

Datatypes & Type checking

Interfaces

Static classses

Methods & scopes

Namespaces & packages

Events

Model - View - Controller

Doing a programming project

Flash & Flex libraries

Introduction to Flash/AS3

Programming process

Procedural programming

Variables

Mathematical functions

Boolean Logic

Loops

Conditionals

Before we start...

Code-lover ≠ Code-expert

Ask questions!

Tell me when I have to slow down!

Try to focus on the global method

Experiment!!

Introduction to Flash & Actionscript 3

Why Actionscript 3?

Lots of demand

Great learning language

Used in Flash, Flex and After Effects

Other languagesWeb-based

PHP

ASP

Ruby

JSP

...

Application based

Java

C, C++, Obective C, C#

Python

Perl

Script languages

Javascript

Applescript

Lingo

Other languagesWeb-based

PHP

ASP

Ruby

JSP

...

Application based

Java

C, C++, Obective C, C#

Python

Perl

Script languages

Javascript

Applescript

Lingo

OOPproof

MVCproof

OOPproof

MVCproof

How to program in Flash?

How to program in Flash?

How to program in Flash?

Text Buttons

Library

How to program in Flash?

Text Buttons

Library

How to program in Flash?

Text Buttons

Library

How to program in Flash?

Text Buttons

Library

How to program in Flash?

Text Buttons

Library

Timelinebased

How to program in Flash?

How to program in Flash?

Text Buttons

Library

How to program in Flash?

Text Buttons

Library

Source

How to program in Flash?

Text Buttons

Library

Source

How to program in Flash?

Text Buttons

Library

Source

How to program in Flash?

Text Buttons

Library

Source

Objectbased

Programming process

Writing

Writing

Think!

Writing

Compile

Think!

!Error

Writing

Compile

Think!

!Error

Writing✓

Success

Compile

Think!

!Error

Writing✓

Success

Compile Testing

Think!

!Error

Writing✓

Success

Compile Testing

!Error

Think!

!Error

Writing✓

Success

Compile Testing

!Error

✓Success

Done!

Think!

!Error

Writing✓

Success

Compile Testing

!Error

✓Success

Done!

Debugging

Think!

Writing

Writing

Writing

Writing

Compile

Writing

Compile

Writing

Compile

Writing

Compile Debug

Writing

Compile Debug

Writing

Compile Debug

Writing

Compile

Testing

Debug

Writing

Compile

Testing

Debug

Writing

Compile

Testing

Debug

Writing

Compile

Testing

Debug

Debug

Writing

Compile

Testing

Debug

Debug

Exercise 1Hello world!

Some tips before we start:comment!

For a single line comment:// this is my comment

For multiple line comments:/* I can write my commentacross multiple lines */

Procedural programmingVariables

var welcome:String = “Hello World!”;var

var welcome:String = “Hello World!”;var

keyword for defining a new variable

var welcome:String = “Hello World!”;welcome

var welcome:String = “Hello World!”;

name of the variable

welcome

no capital as first letter!

no number as first letter!

symbols for special reason

separate words by capitalse.g. welcomeText and not welcometext

var welcome:String = “Hello World!”;String

var welcome:String = “Hello World!”;

type of the variable

String

defines characteristics

defines abilities

String: textual data (string or character)Boolean: logical states (true or false)Number: floating point numbers (fractional)int: integer numbersuint: positive integer numbersArray: an ordered listError: a program errorDate: specific point in timeMath: common mathematical operationsRegExp: tool for searching and replacingFunction: reusable set of instructionsObject: default basic features

Native types of variables

Native types of variablesString: textual data (string or character)Boolean: logical states (true or false)Number: floating point numbers (fractional)int: integer numbersuint: positive integer numbersArray: an ordered listError: a program errorDate: specific point in timeMath: common mathematical operationsRegExp: tool for searching and replacingFunction: reusable set of instructionsObject: default basic features

var welcome:String = “Hello World!”;“Hello World!”

var welcome:String = “Hello World!”;

value of the variable

“Hello World!”

var welcome:String = “Hello World!”;

This defines the variable welcome with the value

“Hello World!”

var welcome:String = “Hello World!”;

$welcome = “Hello World!”;

string welcome = “Hello World!”;

PHP

C#

var welcome:String = “Hello World!”;

var welcome:String = “Hello World!”;

var welcome:Boolean = true;

var welcome:String = “Hello World!”;

var welcome:Boolean = true;

var welcome:Number = 2.34;

var welcome:String = “Hello World!”;

var welcome:Boolean = true;

var welcome:Number = 2.34;

var welcome:int = -5;

var welcome:String = “Hello World!”;

var welcome:Boolean = true;

var welcome:Number = 2.34;

var welcome:int = -5;

var welcome:uint = 3;

Exercise 2Variables

Procedural programmingMathematical functions

Doing the math!

Doing the math!

var player1:Number = 6;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 + player2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 + player2;

result is 8

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 - player2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 - player2;

result is 4

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 * player2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 * player2;

result is 12

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 / player2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 / player2;

result is 3

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 % player2;

Doing the math!

var player1:Number = 6;var player2:Number = 2;

var result:Number = player1 % player2;

result is 0

Doing the math!

var player1:Number = 5;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 5;var player2:Number = 2;

var result:Number =

Doing the math!

var player1:Number = 5;var player2:Number = 2;

var result:Number = player1 % player2;

Doing the math!

var player1:Number = 5;var player2:Number = 2;

var result:Number = player1 % player2;

result is 1

Exercise 3Math class!

Procedural programmingBoolean logic

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 > player2;

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 > player2;

result is true

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 > player2;

result is trueBigger than

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 < player2;

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 < player2;

result is false

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 < player2;

result is falseSmaller than

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 <= player2;

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 <= player2;

result is false

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 <= player2;

result is false

Smaller or equal than

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 >= player2;

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 >= player2;

result is true

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 >= player2;

result is true

Bigger or equal than

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean =

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 == player2;

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 == player2;

result is false

Boolean logic

var player1:Number = 5;var player2:Number = 2;

var result:Boolean = player1 == player2;

result is falseEqual to

player1 == 5

player1 = 5

player1 == 5

player1 = 5

Condition: returns true or false.Values remain unchanged!

player1 == 5

player1 = 5

Condition: returns true or false.Values remain unchanged!

Variable player1 gets the value 5.Values change!

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean =

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 || player2;

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 || player2;

result is true

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 || player2;

result is trueOR

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean =

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 && player2;

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 && player2;

result is false

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = player1 && player2;

result is falseAND

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean =

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = !player1;

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = !player1;

result is false

Boolean logic

var player1:Boolean = true;var player2:Boolean = false;

var result:Boolean = !player1;

result is falseNOT

Exercise 4Boolean logic

false && false =

false && false = false

false && false = falsetrue || false || true =

false && false = falsetrue || false || true = true

false && false = falsetrue || false || true = true!true || false || false =

false && false = falsetrue || false || true = true!true || false || false = false

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true =

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false =

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false = false

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false = false

!(false && false) || false =

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false = false

!(false && false) || false = false

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false = false

!(false && false) || false = false!(true || ((!false && true) || true)) =

false && false = falsetrue || false || true = true!true || false || false = false

!false && true && true = true

(true || false) && false = false

!(false && false) || false = false!(true || ((!false && true) || true)) =

false

5 < 9

5 < 9 true

5 < 9 true

5 > 5

5 < 9 true

5 > 5 false

5 < 9 true

5 > 5 false

5 >= 5

5 < 9 true

5 > 5 false

5 >= 5 true

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5 false

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5 false

(3 < 2) && (7 >= 7)

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5 false

(3 < 2) && (7 >= 7) false

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5 false

(3 < 2) && (7 >= 7) false

!(5 <= 3) || ((5 > 3) && (3 > 2))

5 < 9 true

5 > 5 false

5 >= 5 true

5 != 5 false

(3 < 2) && (7 >= 7) false

!(5 <= 3) || ((5 > 3) && (3 > 2))true

Procedural programmingLoops

How can I display this?1 x 6 = 6 2 x 6 = 123 x 6 = 184 x 6 = 245 x 6 = 306 x 6 = 367 x 6 = 428 x 6 = 489 x 6 = 52

10 x 6 = 60

Common loops

While-loop

For-loop

Switch-loop

Do while-loop

while loop

while(condition){

// Do something}

The loop will keep on going until the condition is false.

How can I display this?1 x 6 = 6 2 x 6 = 123 x 6 = 184 x 6 = 245 x 6 = 306 x 6 = 367 x 6 = 428 x 6 = 489 x 6 = 52

10 x 6 = 60

while loop

while(condition){

// Do something}

while loop

var counter:Number = 1;

while(condition){

// Do something}

while loop

var counter:Number = 1;

while(counter < 11){

// Do something}

while loop

var counter:Number = 1;

while(counter <= 10){

// Do something}

while loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

// Do something}

while loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));

}

Exercise 5While loop

while loop

!Infinite loop

while loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));

}

while loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

for loop

for(initialize, condition, update){

// Do something}

The loop will start with the initialization, and do the update after every loop. The loop will

keep on going until the condition is falls.

for(initialize, condition, update)

{// Do something

}

for loop

for(initialize, condition, update)

{// Do something

}

for loop

1

for(initialize, condition, update)

{// Do something

}

for loop

1

2

for(initialize, condition, update)

{// Do something

}

for loop

1

2

3

for(initialize, condition, update)

{// Do something

}

for loop

1

2

3

4

for loop

for(initialize, condition, update)

{// Do something

}

1

2

4

3

What did we initialize before the loop?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

What did we initialize before the loop?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

for loop

for(initialize, condition, update)

{// Do something

}

1

2

4

3

for loop

for(var counter:Number = 1, condition, update)

{// Do something

}

1

2

4

3

What was the condition?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

What was the condition?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

2

for loop

for(var counter:Number = 1, condition, update)

{// Do something

}

1

2

4

3

for loop

for(var counter:Number = 1, counter <= 10, update)

{// Do something

}

1

2

4

3

What did we do, and what did we update?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

2

What did we do, and what did we update?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

2

3

What did we do, and what did we update?

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

1

2

3

4

for loop

for(var counter:Number = 1, counter <= 10, update)

{// Do something

}

1

2

4

3

for loop

for(var counter:Number = 1, counter <= 10, update)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

1

2

4

3

for loop

for(var counter:Number = 1, counter <= 10, counter = counter + 1)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

1

24

3

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

while-loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

while-loop

for(var counter:Number = 1, counter <= 10, counter = counter + 1)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

for-loop

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

while-loop

for(var counter:Number = 1, counter <= 10, counter = counter + 1)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

for-loop

Initialization

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

while-loop

for(var counter:Number = 1, counter <= 10, counter = counter + 1)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

for-loop

Initialization Condition

var counter:Number = 1;var table:Number = 6;while(counter <= 10){

trace(counter + “ x “ + table + “ = “ + (counter * table));counter = counter + 1;

}

while-loop

for(var counter:Number = 1, counter <= 10, counter = counter + 1)

{trace(counter + “ x “ + table + “ = “ + (counter * table));

}

for-loop

Initialization Condition Update

Exercise 6For loop

No homework, but please...

Overlook it...

Experiment with it...

Ask questions!

Remember: this is only the start!

So please, get this!

Q&A

Thanks!