Written by In a recent project of mine, users were allowed to choose from a list of phrases. The selected phrase then appeared in a text box. The problem was that if the text was too short it would sit there at the top of the box rather than being centered. Before I get into the code (which is pretty short), here’s a working example:
Download the source here
Monthly archives for March, 2007
How to Center Dynamic Text in a Specified Area
Clickable Button Inside a Draggable Movie Clip
I’ve noticed postings in a few different places asking “How do I get a button to work inside a draggable movie clip?” The answer, of course, is that you can’t. Once you attach an event handler that listens for the mouse, the movie clip will receive mouse activity rather than any button contained within. But there is a way to achieve the desired effect, and it’s easily done.
The trick is that you don’t place the code on the movie clip itself. Instead, create a button the same size as the movie clip and place it inside the clip on a layer below your buttons. If you don’t want to see the button, make it invisible by populating only the hit frame. Attach your movie clip’s drag code to the button and then place any other buttons you want inside the movie clip on a layer above your drag button.
This way, the user will be able to drag your movie clip when they hold the mouse button down anywhere on the mc except for over the other buttons. Check out the sample below or download it here to see how easy it is.
This is all the code that it takes:
container_mc.drag_btn.onPress = function() {
startDrag(this._parent);
};
container_mc.drag_btn.onRelease = function() {
stopDrag();
};
container_mc.btn.onRelease = function() {
counter++;
this._parent._parent.text_txt.text="\rclick #"+counter;
};
-rG
Bottom Align Variable Length Text Fields in Flash
Getting Flash to display dynamic text the way you want it displayed can sometimes be a chore. Recently I had the need to bottom-align a dynamic text field that could vary between 1 and 3 lines high.
Here’s an example: Download source
The solution is pretty simple. The following code handles everything:
bottomCoord = text_txt._y + text_txt._height;
text_txt.autoSize = "center";
btn.onRelease=function() {
text_txt.text = input_txt.text;
text_txt._y = bottomCoord - text_txt._height;
}
First I record the bottom _y coordinate of the dynamic text field. Then I set the text field’s autosize property to ‘center’ allowing the field to dynamically expand and contract vertically. And finally, I adjust the text field’s _y position based on the new height.
-rG
SWFObject 1.5 Offers Helpful Improvements
Version 1.5 (briefly known as 2.0) of Geoff Stearns’ SWFObject flash embedding script was released at the end of February. The new version offers a couple of useful changes.
Express Installation now requires no ActionScript in your source FLA. The checking is now done by an external SWF which can be centralized or placed with your swf. Source code is provided for tweaking and customization.
Geoff also added support for style tags on the outputted object/embed code allowing it to be used with apps like SWFir without having to include the SWFObject code multiple times.
No updates on SWFfix (the next generation flash embedding technique) since the test suite matrix was released in early February. I feel like Neo every time I look at that thing!
-rG
Multiple getURL Calls May Cause Link to Fail in IE
A coworker of mine recently stumbled across a weird occurrence where a getURL link worked in Firefox but not IE. I have to admit, I thought he was crazy at first but I saw the odd behavior replicated on several different machines, including my own. The statement was not complicated. It was a straight URL to _self, something like this: getURL(“http://www.google.com”,”_self”); . The only thing out of the ordinary was that it was followed up with another getURL which was a javascript call which sent link tracking information.
Turns out that Internet Explorer calls getURL() asynchronously. This means if you try to call multiple getURLs in rapid succession, it’s possible that only one of them will be executed.
There are a few possible solutions:
- Sometimes it’s possible to get around the problem by re-ordering the getURLs (though I have no explanation for that one).
- Use Sean Rooney’s custom GetURLQueue class technique.
- String the calls together into one js getURL call, like this:
getURL("javascript:location.href='http://www.google.com';javascript:doSomethingElse();");
I found that the third option addressed the issue nicely and was the easiest to implement for our purposes.
-rG
SWFir: Image Effects in a Flash
SWFir is a combination of Flash and Javascript used to add effects like borders, rounded corners and shadows to your images. The Javascript is 22k, the required swf is 3k and the results are amazing. It took me about a half hour to download it, skim the instructions, and get an example up and running containing four images each with a different effect. If you’re looking for an easy way to add some style to your site images, this is it.
-rG
Using Spry to Auto-select a Form Value
So far I’ve covered how to use multi-related selects in Spry and how to dynamically update the select list upon a database update. That’s good enough for a simple ‘add record’ form but when it comes to an editing an existing record I want to be able to have the saved column’s value automatically selected in its select box.
Adobe’s samples didn’t seem to cover this scenario so it became a matter of trial and error, and a lot of wading through documentation. In the end, however, it turned out to be a matter of changing only a few lines of code.
READ MORE »