view source

Which Superhero are you?

December 31st, 2006 . by polyGeek

I couldn’t have planned this any better if I had tried - insert evil laugh here. :-) I wonder which question I answered that knocked me off the 100% score.
Your results:
You are The Flash

The Flash
95%
Hulk
80%
Iron Man
70%
Green Lantern
70%
Spider-Man
65%
Superman
65%
Supergirl
60%
Robin
55%
Wonder Woman
45%
Batman
35%
Catwoman
30%
Fast, athletic and flirtatious.


Click here to take the Superhero Personality Test


Tips and Hints for variable scope in Actionscript

December 31st, 2006 . by polyGeek

This tutorial is meant for Flash developers who are just starting to get a handle on scope. What follows is the simplified version. Also, this isn’t about how code on one MovieClip talks to code on another MovieClip and so forth. We’re just talking about code on one frame here.
With that said here are a few analogies that might help you understand scope.

First off lets start with a simple definition:

scope = the range over which a variable is defined.

Think of your code as a landscape. When you create a variable it has an existence in a specific place, like say down in a valley. Lets call this variable downNvalley and give it a value of, say, 3. Now if you climb up on a mountain - create a function - and you are overlooking the valley you can still see your variable. You can even yell out to it and say, “hey, Mr. downNvalley, can you add 1 to your value?”, or something like that.

That code would look like this:

output:
from climbMountain: 3

Now suppose while you’re up on the mountain - inside the function - you create a variable. We’ll call it upOnMountain and give it a value of “just smell the cool, clean, air“. As long as you are on the mountain you can still see your new variable. But if you go back down into the valley you won’t be able to see it. If you ask anyone around you, “hey, do you know Mr. upOnMountain?” They’ll say, “Nope, never heard of him.”

Here’s the code:

output:
from climbMountain upOnMountain = just smell the cool, clean, air
from the valley upOnMountain = undefined

Actually, Mr. upOnMountain vanishes once you walk off the mountain. That’s because variables created inside a function - local variables - only exist for the duration of the function. When the function is over the variables are erased from existence.

The nice thing about the mountain and valley analogy is that it translates nicely if you indent your code - the way you’re supposed to. If you think of indenting as going up on the mountain then you can easily see where your variables scope exists.

I have another analogy to toss on you, and you’ll really like this one. You know the saying, “What happens in Vegas, stays in Vegas.” Well, it’s the same with functions. Suppose you and the people you know are like variables. While you are in Vegas you can certainly call home and talk to your significant other. You can do that because the scope of your relationships at home (_root) extend to Vegas.However, if you make a friend in Vegas then the scope of that friendship exists only in Vegas. Once you leave Vegas you cannot call them and doing so would result in an error.

(Note to wife: I swear this is a totally hypothetical analogy.)

Tools to help you find your way
The first and easiest tool is good old trace(). (Note: a shortcut to making a trace statement is ESC + tr.) With Flash it’s easy to bury code god-knows-where on timelines. Sometimes you loose your way and when you do the easiest thing to do is trace(this).

Okay, so what is this?

this is a reference to the current object.

Okay, what does that mean?

If you didn’t know, everything in Flash is an object. Every MovieClip, TextField, Number, everything. So this is a reference to the object where the trace() statement is made. (Note: I almost always use something like, trace(”something: ” + this), so that if I have multiple trace() statements I’ll be able to tell their outputs apart.)

Tracing this really comes in handy when you’re dynamically creating MovieClips and loading things at runtime and you loose track of where things are going.

If you’re MovieClips are placed on the stage at authoring time then by all means use the insert target path tool in the Actions Panel. The MovieExplorer Panel can also be a big help in helping you find assets.

If you want to see an output of all the graphical objects - MovieClips, TextFields, Buttons, etc - then publish the movie and hit Ctrl - L. That will output everything to the Output Panel. It’s a little messy to read if there are a lot of assets but you can always use Find to search for the instance name you are looking for. From there you can see what the path for that object is from the _root.

Lastly, I find it very useful when I’m dynamically creating MovieClips and TextFields to document what I’m creating. I use indenting to indicate parent/child relationships and don’t forget to add the depth which the asset was created at. If you’re dealing with really large projects it’s handy to do the same thing on a white board for quick viewing.


Fading and masking with device fonts

December 29th, 2006 . by polyGeek

Excerpt from the Flash LiveDocs, emphasis added:

Transparency values are not supported for text fields that use device fonts. You must use embedded fonts to use the _alpha transparency property with a text field.

Which, you will find out shortly isn’t entirely true.

Here’s how embedding vs device fonts works: when you embed a font the characters that you choose to embed are added to the SWF at publish time as shapes. In essence they are no different than complex shapes you might create with the pen tool. Device fonts by contrast are completely different because the font shapes are not included with the SWF. (Note: dynamic TextFields must use either embedded fonts or device fonts. There is no third option so essentially, if you don’t embed you are using device fonts.)

When a user runs your SWF on their machine and the Flash player gets to a TextField that uses a device font then the player asks the host computer, “What is your default sans-serif font.” - or whatever it was you specified. This is pretty much the same thing that happens with an HTML webpage. Since the Flash player doesn’t have the font shapes it can’t do things like change the _alpha or use the text as a mask.

“So why not just embed the font all the time?” you might ask.

The main reason I’ve had to use device fonts here at XBox.com and Zune.net is that we have to make our Flash apps accessible to an international audience. The text is populated from an XML file so that our sister sites in other countries can add their own text, in their language, to the XML file and it will populate the TextFields accordingly. If we had used an embedded font then they wouldn’t be able to change the text to Japanese, or Russian or whatever. Of course if you use Japanese text in the XML file then the user will have to have a default Japanese font on their computer.

So how do you get around this?

Flash 8 introduced Filters and the cacheAsBitmap property. With that you can tell Flash to treat the text as a bitmap. In essence that gives the Flash player the shapes it needs to alter the _alpha or use the text as a mask. The downside to this is that the text becomes aliased - looks jagged. Since you have to use a filter to get this to work then go ahead and use the blurFilter and apply a very slight blur to the font. That’s a poor man’s way of treating the text as anti-aliased. It won’t look nearly as good as it would if it had been rendered with the Saffron text renderer built into Flash 8 but it’s good enough.

I got the idea to try this while driving home one day. (Sometimes being stuck in traffic has it’s advantages.) I expected it would work but I also expected that the TextField would now be rendered as a bitmap and wouldn’t be editable. I was trying to think up tricks that I could use to be able to change the text property but fortunately I didn’t have to. It still just works. (I wonder if Tinic Uro had any idea this would work when he baked in the Filter classes to Flash 8?)

Here’s an example of a SWF using a device font as a mask while the _alpha of the text is oscillating between 25-100%. You can click on the different languages to see how device fonts are essential for internationalization. The text is stored in an array. If you don’t have a particular font then you’re going to see some ugliness.

Here is the essential code to make this work. The instance name for the TextField is txt and the maskee is wave. Download the example.

// create a blur filter for the TextField
import flash.filters.BlurFilter;
var filter:BlurFilter = new BlurFilter(1.2, 1.2, 3);
var filterArray:Array = new Array();
filterArray.push(filter);
txt.filters = filterArray;

// cache both the mask and maskee as bitmaps
txt.cacheAsBitmap = true;
wave.cacheAsBitmap = true;
wave.setMask(txt);

Now for the bad news, you still can’t rotate the text. The good news is that this works for input TextFields as well. You can still type along in the TextField and the text will mask and fade. Give it a try in the example above.

I would caution developers to not use this unless the really need to. The Saffron text renderer is really top notch and makes Flash text look great.

Note: I’ve done some Googling and can find only one other person has run across this trick. Good work Scott as far as I can tell you deserve credit for finding it first.

By the way, this is by my count the third seemingly impossible thing I’ve done with Flash. I think I’ll treat myself to breakfast at Milliways now. :-)


Finding a MovieClip’s indexNumber

December 27th, 2006 . by polyGeek

Suppose you use a loop and the createEmptyMovieClip method to create some MovieClips like so:

If you ran this code and hit Ctrl+L you would see that you have created 5 empty MovieClips.

Level #0: Frame=1
Movie Clip: Frame=0 Target=”_level0.clip_0″
Movie Clip: Frame=0 Target=”_level0.clip_1″
Movie Clip: Frame=0 Target=”_level0.clip_2″
Movie Clip: Frame=0 Target=”_level0.clip_3″
Movie Clip: Frame=0 Target=”_level0.clip_4″

Presumably you would then attach some assets or load something into these clips.

In such instances it’s pretty common that you will write code to deal with user interactions with these clips. If so you’ll need to know which clip is being interacted with. It’s probably best to dynamically create variables on the clip that will help you identify it but you know what? You already have. You have the MovieClips name clip_#. So what you really need to know is what is the index number at the end of the MovieClips’ name.

That’s easy enough to find using the split(”_”) method as such:

this._name.split(”_”)[1];

That works well enough assuming you used an underscore during the creation of the MovieClips. What if you used a hyphen or even no separator at all?

I’ve had to deal with this often enough that I created a utility class to deal with it. Here’s the general code removed from the class that you can use or you can download the Find class which has this method plus a lot of others for helping you find MovieClips by size, _alpha, position, etc.



Note that this function returns a Number not a String. So if you have a clip named clip_01 then what you will get back by calling mcIndex(clip_01) is the Number 1.


Let me help you Find that MovieClip

December 27th, 2006 . by polyGeek

The Find class (download here) is a utility built to help you find a specific MovieClip based on it’s properties.

To use it you send a reference to the MovieClip that contains a group of MovieClips and depending on the method you use it will return a reference to what it found. For instance, if you have a MovieClip named container that contains lots of MovieClips and you want to know which one of those MovieClips is the furthest to the right - largest _x value - then call Find.farRight(container). Since the method returns a reference to what it found you would want to use it as such:

var farRight:MovieClip = polyGeekcom.utils.Find.farRight(container);

There is also a method called mcIndex which will look to see if the instance name of the MovieClip you send it ends with a number. If so then the method returns that number. For instance, if you have a MovieClip named clip_15 you could write:

var indexNum:Number = polyGeekcom.utils.Find.mcIndex(clip_15);

Of course you would probably be using this in an instance when the MovieClip in question was created dynamically and you didn’t know what its index number was. This method works no matter what the MovieClips’ name is as long as it ends with a number. It could be clip_15, clip-15 or even clip15 and it will still return the number 15.

Here is a quick list of the remaining methods.

top: find and return the clip with the smallest _y value

bottom: find and return the clip with the largest _y value

absBottom: find and return the clip that extends the furthest to the bottom, takes into account the height of the clip and assumes that the clips registration point is 0,0.

farLeft: find and return the clip with the smallest _x value

farRight: find and return the clip with the largest _x value

absFarRight: find and return the clip that extends the furthest to the right, takes into account the width of the clip and assumes that the clips registration point is 0,0.

largest: find and return the largest movieclip by area

smallest: find and return the smallest movieclip

dimmest: find and return the movieclip with the lowest _alpha setting

brightest: find and return the movieclip with the highest _alpha setting

Note: If there are two or more MCs that meet the criteria being searched for then these methods will return just one of them. However, that returned MC
will have the propertie ‘tie’ dynamically appeneded to it with a value of true. So, if you need to check for ties then simply ask:

if( myFoundMovieClip.tie ) {
// there are multiple MCs that met your criteria so do something about it
}


Teds Top Ten Myths about Flex

December 19th, 2006 . by polyGeek

Ted Patrick, the Flex evangelist, put together a great summery of the top ten myths about Flex. It’s his job to get the word out about Flex and I think he’s doing a great job.


Smart Money is on Flash

December 16th, 2006 . by polyGeek

In case you missed it the December issue of Smart Money has some glowing news for Adobe. Eric J. Savitz asserts that if you’re interested in investing in the Web 2.0 sphere then look no further than Adobe.

So here’s why I like Adobe: First, we’re in the middle of a digital-content explosion, and Adobe plays a key role in making it happen. Second, the company has two major product updates pending that should drive significant growth in both revenue and profit.

Cash Advance Quick payday loans


Seeking in Flash Video

December 8th, 2006 . by polyGeek

Have you ever noticed that when you use the playhead control to scrub through a video that when you release it the video plays smoothly from the frame you see however the playhead will jump, sometimes a lot, just a little bit forward.

I first noticed this when working on my videoGenerator code and it was driving me nuts. Finally, I went to youTube.com and a few other Flash video sites and tested their video. You know what? I got the same result.

That lead me to believe that maybe it wasn’t my code but something to do with Flash video. Turns out I was right.

First, a quicky on how Flash video, and many other video formats, are encoded. If you could look at the individual frames of a video stream you would notice that most of them are incomplete pictures. For sure the very first frame will be complete but the next few frames after that will only be the parts of the picture that have changed from the first. After a hand full of frames you get another complete picture and then the process starts over again. These complete frames are called key frames. The more key frames you have the larger your filesize will be. However, if you don’t have enough the video quality begins to suffer. Especially when the video content is changing a great deal during every frame, like an action scene. (You can read all about how to best choose your key frame values here.) I’m going to get on with how this affects scrubbing the video.

Very simply, when you are scrubbing over Flash video - moving the playhead around - the Flash player can only show you the key frames. It can’t show you the incomplete frames in between. Here’s a good example of how that looks. The video below is simply a white bar that moves across the video window. You can use the scrubber to move back and forth through the video and see the jumpiness. I included multiple versions with different key frame values so that you could see the effect.

Note: these videos were all encoded at 15 frames per second. A key frame interval of 15 ends up being 1 keyframe/second and a key frame interval of 5 ends up being 3 keyframes/second.

Also, to see the effect that I’m talking about here you have to move the playhead very slowly. If you move it quickly the jumpiness is a result of the Playing trying to catch up with you and has nothing to do with key frame placement.

The file sizes for these videos are as follows:

interval of 1 = 1,350 KB

interval of 5 = 351 KB

interval of 10 = 224 KB

interval of 15 = 181 KB

interval of 90 = 109 KB

interval of auto = 124 KB

You can see that having a very small interval blows up the file size but at a certain point having a very large interval does little to save file size.


Babysteps in learning Flash

December 7th, 2006 . by polyGeek

Learning Actionscript is like putting together a puzzle, as are many things. You start with the obvious stuff first - the edges.

So you have a few basics down and then you need to do a project that requires you to use code that you’re unfamiliar with. So you learn just enough to get the job done. It may not be organized code and it may make a seasoned developer cry if they see it but it works - that’s what matters, right? This is like finding a few pieces of a puzzle that fit together but you don’t know where they belong in the overall picture.

So you keep adding on these little groups and sometimes you discover that they fit with a part that you know well. Like fitting a group of assembled pieces to the edge of the puzzle. More and more the picture is coming together.

Of course, those little groups of understanding fade away if you don’t use them often enough.

The real problem with learning Actionscript is that you can’t really see the big picture until you know it pretty well. When you’re starting out you might read about objects, arrays, whatever and you don’t know if that’s a huge part of the puzzle or if it’s a little part of the puzzle that’s easy to understand.

There is also room for confusion between what is Actionscript and what is really the Flash Players DOM (Document Object Model). You see, there really isn’t all that much to Actionscript. You have your variable types, if/then, for/loops, a few other odds-and-ends and your done. Maybe a few chapters of a book at best.

The Flash DOM on the other hand is huge and growing with every new release. The DOM includes things like, ._alpha, ._x, ._y, getNextHighestDepth(), XMLSocket(), the list goes on-and-on.

So Actionscript is what the language can do, like loop through an array, and the DOM is what the Player can do, like change the _alpha of a MovieClip.

My suggestion is to concentrate on understanding Actionscript first and then filling in the blanks of the Flash Player DOM as you go.

With that said here’s a general list of the things you need to learn and understand in what order.

  1. Creating variables : There aren’t that many variable types in AS. Initially you should feel comfortable with Number, String, and maybe Boolean.
  2. Functions and scope : First get used to creating and using functions. As soon as you feel good about creating functions you should learn how to pass parameters - variables - to a function and then later how to return a value from a function.
  3. Arrays : Learn them. Love them.
  4. Conditionals : Lets go loop-de-loop
    • for loops : for-loops go hand-in-hand with arrays. You’ll see.
    • if-then : if this then do that. The cornerstone to any language.
    • if-then/else : just to cover all your bases.
    • if-then/else if : the other condition
    • switch/do-while/while/ : you won’t use these all that much but when you need them they really come in handy.
    • Tertiary “?” operator : you could go your whole life without ever using this thing but when you learn it you’ll love it. Essentially it’s a very concise version of an if-then/else conditional.
  5. Objects : Once you have everything in Actionscript nailed down solid you’ll still be learning all the in-and-outs of objects. And don’t confuse objects with Object Oriented Programming. First you learn how to manipulate existing objects. Later, you’ll create your own - that’s the OPP part.
  6. Types : A String is not the same type as a Number, duhhh.
  7. For-in loops : Previously you learned how to loop through a sequence of numbers, like count from 1-to-10. For-in loops run through an Objects properties. Very handy and very powerful.
  8. Listeners and events : “Listen . . . do you smell something?” :-) Events are happening all the time. You just need to listen to them and do something about it.
  9. Object Oriented Programming : You know about using objects now get ready to create them.
  10. Design Patterns : An extension of OOP. If you get this far you are now an Actionscript guru.

XanaduWest.com

December 6th, 2006 . by polyGeek

XanaduWest.comXanaduWest.com is my personal photography site. I did all of the design and coding, and of course all the photography.

XanaduWest has quite a few features that are very rare for a Flash RMA.

Firstly, it is bookmarkable. As you browse through the photos the Actionscript is communicating with the browser via Javascript to make updates to the location bar - window.location.hash. If you are looking at a particular photo and bookmark the page or copy the URL and email it to someone then they will come to the very same photo. As the page loads it looks for any arguments added onto the URL. If they are there then the data there is used to load the corresponding photo. Otherwise it randomly picks a category/subcategory to display.

There is an email feature here that uses the same URL code so that you can email a group of photos to someone. When they click on one of those photos it will bring them straight to the one they are looking at.

The navigation and all photo data are contained in an XML file. So if I want to add a photo to a gallery or create a whole new gallery then I don’t need to make any changes at all to the Flash file. All I need to do is add a few lines to the XML, upload it and the photos to the server and I’m done.

To make things even easier on myself I used the DrawingAPI in Flash to make all the frames around the photos. That saves a lot of work later on Photoshop. So that frame with the beveled edges is all just lines drawn programmatically in Flash.

Lastly, I have used LocalObjects to store data about the current state of the RMA. If you change the volume level of the music it will be remembered when you return. It also checks to see which photos have been stored to be emailed. If you leave and return those same selected photos will be there ready for you to email to yourself or a friend. This functionality can easily be extended to become a shopping cart if I ever decide to sell prints again.

And please, stay long enough to see the sunset. People say that it’s beautiful.


« Previous Entries    




© Copyright 2008 polyGeek.com / Dan Florio, All Rights Reserved Except Where Explicitly Stated
Web Developement Blogs - Blog Catalog Blog Directory
M2 Websites