Click on any phrase to play the video from that point.
[Adobe TV Presents]
[Paul Trani in...]
[♪rock music♪]
[Adobe Flash Professional CS5 Training with Trani]
The great thing about developing for other
devices such as smart phones, is you can tap into
their specific capabilities.
One of them happens to be the accelerometer.
And what I mean by that is you're able to actually
tap into the motion
of the phone.
Whether it's level, whether you're tilting it around, you can tap
into that information and then build a game
or some experience around that information.
It's actually quite easy to do in Flash.
I'm going to go ahead and show you how it's done,
tapping into the accelerometer.
In this case, what I'm going to do is I'm going to go ahead and take this.
It's my little white blood cell.
I want him to just kind of move around the screen
based on accelerometer input.
So just be mindful of his name.
He's called Player.
But what I need to do first is I need to check to see
if the device has accelerometer capabilities.
So right here in this text box, this is the dynamic
text field, and it's called My Text Field.
I'm just going to copy this instance name,
because right in here in this text field,
this is where I want to put a conformation
message saying that this device supports
accelerometer
and so on and so forth
and whether it does or doesn't.
So I'm selecting the actions layer.
I'm going to go to window down to actions.
Here's my actions panel.
And I can start with performing that check.
So,
accelerometer, does it have one?
Well, let's go ahead and type in if,
accelerometer
is supported.
Then go ahead and do this, whatever I have in here.
In this case, my text field put inside of that text field,
something like tilt
your device to move.
All right.
Next up, else.
If it's not supported, then do something else.
So, again, myTextField.text,
No accelorometer support.
And right in here you can add additional functionality.
Whether you want to give them
maybe keyboard controls or whatever the case may be,
it might be maybe a limited experience, but you can still
sort of make this game work based
on the person's device and it's capabilities.
But in general, that's all I'm doing.
I'm going to type in that code, and I'm going to go to control,
test movie, and I'm going to test it in device central.
So there it is running, and it says "tilt your device to move."
so it is actually showing that this Nexus One,
since I have that profile selected,
has Accelerometer support.
So it works out great.
If I did pick a different device that didn't have something,
it would print it out there, as well, saying it doesn't have support.
So let's go back into Flash.
And, again, this is my simple 'if-else' statement.
I want to do so much more because
if they do have support for the accelerometer, I want to add some additional functionality.
So I'm going to create a new variable
call it Accel,
and it's going to use the accelerometer.
This is nice. It actually gives me this code hinting.
I can go ahead and hit enter.
And notice what this does here.
This is a Flash CS5 feature.
As soon as I select accelerometer,
it actually gives me this import statement.
So I don't have to worry about typing this in.
It gives it to me automatically, and I can continue on
my merry little way of finishing up this
sort of instantiated this object called New.
Called Accel, and that's what it is,
something like that.
Here is my new variable.
I just instantiated this object.
It's an accelerometer object.
I can go ahead and say, "Hey, you know what?"
With Accel, I'm going to add an event listener.
So I type in the A, I get the code hinting,
I hit enter, and then I have
some other events I can go ahead and access.
So I can sort of activate it, deactivate it if it's available.
But in this case, I just want to access the update feature.
So any time this smart phone moves,
it's going to fire off this update event listener.
And this update
event is actually going to fire off
a function called Update.
Just something I just defined,
and I've got to make sure I write that function down here.
So, function,
then accelerometer events.
Go ahead and do something at this point.
So any time the person kills their phone,
it's going to fire off this function, and then
based on that information, I'm going to have something happen.
So I'm going to keep this pretty simple.
I'm going to say player.
I'm going to go ahead and change its X postition
equals to the
acceleration X.
So notice I have the ability to access the X,
Y, and Z properties for this accelerometer.
But right now I'm going to deal with X.
And, if fact, I'm going to even multiply this, because it actually returns
a pretty small number.
But just so we can see sort of more of a visual
feedback, I'm multiplying that by 100.
Now let's go and take advantage of Y, and these are the
only two properties I'm going to do real fast.
This is going to move to left and right and up and down, multiply that by
100, like that.
All right. Again, everything is looking pretty good.
I'm just tapping into these two properties here.
And I can go ahead and test this in device central.
And it is throwing me one error.
I'm kind of glad it did because I'm just missing
one simple thing.
It's right in here.
I'm actually missing the update function.
Again, I type this a little fast.
I just need the name of the function there.
That's the only thing I'm missing.
I'll run this again real quick.
We can see that it positions it in the upper left-hand corner.
So I want to go ahead and access the accelerometer.
And in order to do that, I can switch to the accelerometer panel.
So let's just kind of expand that out.
Here's a 3D representation of the phone.
From here I can go ahead and tilt it.
So you can see him sort of move around
in the upper left-hand corner.
You're probably not terribly impressed because at this point
he's not moving a whole lot, but you can obviously
see that the data is there.
So now the next step would be to use this data more
effectively by multiplying and
adding some other additional variables.
But you can definitely see that the content is moving around.
It just, as expected, looks great.
All right, so in that case, I'm just going to switch
to this final file, just so you can get a vision
for how you can use this data.
And what I'm doing here, again,
this is the same code, but in this
because I've defined two variables called Target X and Target Y.
These are going to contain two numbers.
And what I'm doing here is I'm changing
this variable.
It's going to go ahead and get me the
property for X and Y.
It's going to be multiplied by 500, just so it's a large enough number,
and it stores it within these two variables.
These variables are then used down in here.
So I've written and additional function.
It is called Loop,
and it fires off at the frame rate of the movie.
Okay, so at the frame rate of the movie, go ahead
and change the player's X position.
Keep adding to it
this target X number that always changes,
and then just add a little bit of easing to it.
It's actually going to slow down when it reaches its destination point.
And then we also do some additional
math for the Y property, as well.
So a little bit different since we're working off
the Y property.
Again, this is a quick overview of what you can do with that data.
Lastly is this information.
It looks like it's a lot,
but in short, all this is doing is it's going to allow for
our little character to
exit the top and then
come in on the bottom.
So it's going to sort of loop forever.
I'll show you what I mean.
Again, just a quick code review.
I'll do a test.
There he is.
And again, like I said, he's going to leave the top and come in on the bottom,
but you can definitely see him flying on through.
These are the results that I'm after.
There's my character.
I'm kind of tilting him around.
You can see him move, obviously.
And again, I can always hit reset.
If I hit this reset button down here, of course, it will stop him from moving.
But again, now I'm actually using that data more effectively,
and you can see that I can really start to build the game
based on this information or pretty much any content that I want.
But, again, just a quick overview of the accelerometer,
how to use those various properties, and then really build
a special experience all for your
specific device you're targeting.
[Executive Producer, Bob Donlon; Producer, Karl Miller]
[Director, Kush Amerasinghe; OP/Post Production, Erik Espera; Editor Elen Gales]
[Adobe TV Productions, tv.adobe.com]
