Tag Archives: Flex

Six Months on AIR: A Look at Skimmer

If you weren’t able to attend Minh and Chris’s Flashbelt presentation, we have the next best thing — the slide deck! Take a look to learn why they chose AIR to develop Skimmer, working with SQLite, and tips and tricks for developing applications using these technologies. When you’re done, make sure to check out Andrew’s Flashbelt recaps.

Filed under Technology

Flashbelt Day 1: Quite the Canvas

I’ve just finished up day one of the Flashbelt conference here in Minneapolis. Flashbelt is one of the premier conferences in the country oriented around Adobe’s Flash player. The conference is aimed at animators, designers, developers, project managers, ad agencies and so on; pretty much anyone who is involved with creating content for the ubiquitous Flash player.

Flashbelt attracts a lot of well known speakers, many of the “heavy hitters” in the Flash scene – guys like Seb Lee-Delisle, Dr. Woohoo, Minneapolis’ own Danny Patterson, and so on. These names probably don’t mean much to the uninitiated, but if you’re into the geekiness like us, these people can almost be rock stars. I’m one of the Flash developers at the Nerdery, so myself and a few others from the Nerdery are at the conference checking things out.

The day started with a keynote by Richard Galvin and Paul Burnett from Adobe. These guys have intimate knowledge about Flash; they mange the Flash product lines. They talked about where the Flash platform is at currently and where it’s going.

Perhaps the most interesting point was how Adobe really wants to move the current Flash player to more devices than just computers, like TVs and mobile phones (Flash for iPhone anyone? We Flash devs can dream). Getting Flash onto these devices is the logical next step, and would be a boon for getting interactive content to more people.

The rest of my day was spent in sessions dealing with the more nerdy development side of the Flash world. I’ve gotta make sure to give mad props to our own Chris Black and Minh Vu, who gave a presentation about their experiences developing Skimmer, Fallon’s “lifestreaming” application. Chris and Minh did a great job presenting, and demonstrated that they really know their stuff.

The day ended with a session by Joel Gethin Lewis, who I’m not even sure does Flash development. Instead, Joel works for a firm in the UK that puts together real-world “interactive experiences,” things like using laser pointers to “paint” projected artwork onto buildings or making interactive stage lighting for the band Massive Attack.

It may seem odd to have a session that isn’t directly connected to the Flash platform, but apparently this is what they always do at Flashbelt. It shows that Flashbelt is about more than just coding or content production. It’s about being inspired and seeing what’s possible.

And I think if I had to sum up this first day of Flashbelt, it would be just that: be inspired. There was plenty of technical mumbo-jumbo to go around at Flashbelt, but the fact is that Flash transcends its technical backing (which has come a long way, I might add). For many years now, Flash has been arguably the most ubiquitous platform for serving up interactive experiences.

Think of this: Flash is the technology enabling YouTube and all other video sharing websites, which is changing the way we consume long entrenched forms of mass-media. Or imagine you’re an artist with an interest in the interactive-type things. You can make something for Flash, and suddenly your art can potentially be seen by millions of people who have the container waiting to show your art. The install base for Flash player is in billions of machines – that’s quite a canvas!

So it’s a good thing for all developers to remember as we come up with solutions for our clients: be inspired, think big, think of unique things, think of what people are going to want to use. Flash is one of the technologies we can use to bring the content and experiences that people are looking for.

Oh, and the worst part of Flashbelt so far? Having to endure the hokey smooth jazz that is always playing over the restroom speakers.

Nerdery Rockstars On Tour

flashbelt09Attention AIR developers: Are you interested in learning about caching images in binary format, SQLite database migration, re-using existing view components, memory fragmentation and general tips / tricks about developing your application using Adobe AIR? If you answered YES than you should attend Minh Vu and Chris Black’s session at Flashbelt on June 8th at 1:30PM. We’re going to have a killer presentation for everyone interested in developing Adobe AIR desktop applications.

Can’t attend Flashbelt?
I would highly recommend attending Flashbelt. Networking opportunities, great presentations and lots of fun! OK, if you absolutely can go than keep an eye out for our presentation which I will be posting to this blog on Monday. And check out all of our Flashbelt coverage as the event happens.

Who should attend?
Developers that are currently developing AIR applications or are interested in doing AIR development in the future. Project managers would also benefit from knowing the decisions that go into creating large scale applications. How about designers? This presentation is geared towards the development side of AIR but designers are welcome.

About the presenters:
Chris Black is a Senior Developer at Sierra Bravo who focuses on ActionScript development with Adobe Flex and AIR, and is interested in integrating social networking APIs into Rich Internet Applications. He covers these topics as well as sharing solutions to the problems he encounters when working with Flex and AIR on his blog, blackcj.com. Chris has a degree in Computer Science from the University of Wisconsin – Eau Claire, and when he’s away from the computer he enjoys rock climbing, backpacking, and tennis.

Minh Vu is a Developer at Sierra Bravo who works on interactive development with ActionScript and JavaScript. He has a strong interest in applying Model Driven Development to Flash or AIR applications. Minh studied at the University of Minnesota Duluth where he got his degree is in Information System & Technology. In his spare time he enjoys disc golfing, snowboarding, ultimate frisbee, and learning how to program for the iPhone.

Tech Tips: How to fix fuzzy pixels in Flex

What are fuzzy pixels? Semi-transparent lines that appear on the edges of your Sprites that make them appear fuzzy or blurry. This is the result of positioning a custom drawn Sprite (using the graphics property) on non-whole number pixels (for example myObject.x = 1.5).

Your probably wondering why anyone would set a Sprite to an decimal number of pixels? Well, most of the time this occurs when the positioning is based off of a mathematical equation. For example: myObject.x = this.width / 2. This would produce 50.5 if the width of the container is 101. One of the biggest problems with this is that the fuzzy pixel problem has a waterfall effect. Everything contained within that sprite placed at a decimal number position will have semi-transparent edges. Another reason would be designers that set positioning of items to half pixels in Photoshop and attempting to reproduce the design pixel perfect in Flex.
Read more

Filed under Technology

Tech Tips: Display TwitPic Images in Flex & AIR

Problem:
The TwitPic API does not currently support outgoing requests and the image source from amazon aws contains an AWS AccessKeyId, expiration time stamp, and signature. This would normally require a regular expression to rip the source JPG path out of the HTML. Ripping the source out of the HTML is a bit of a pain and is not a long term solution. It is possible to use the following shortened url to gain access to the full image path using the TwitPic image id.
Read more

Filed under Technology

Tech Tuesday: Skinning Flex Components – Part 1: CSS

This will be a three part series on skinning Flex components. For part one I have chosen to dissolve the myth that Flex 3 can’t truly cascade styles. This three part series will start simple and get more complex with each post. You can use this code to mimic descendant selectors, dimensioning and multiple class names within Flex.

Problem:
Flex can’t do true cascading styles like HTML (for example a black play button)

Solution:
YES, flex can do cascading styles. It just requires a different approach. A programmatic approach. Don’t worry, I assure you that even a non-programmer can pick this one up.

Lets dive a little deeper. Cascading styles refers to the ability to start with a button, style it into a black button then go a step further and make it a play button. First, create a button and use some CSS to style various properties of that button.
Read more

Filed under Technology

Friday Links: Who likes to party? The Dark Side likes to party

Filed under Links

Tech Tuesday: Using anchor tags in ActionScript TextFields

This example is for anyone who needs to use anchor tags in ActionScript TextFields. If you’re using AIR then the best route is to use an HTMLLoader to load in the raw HTML. If an HTMLLoader is not an option you can use this example to create a wrapper class that mimics the anchor tag functionality. Before we get started it is important to note that TextFields have a number of properties, formats, and styles available which all have an effect on the way text is rendered. This example takes advantage of a specific set of properties in order to accurately determine the line number and char location of certain strings. Variables may require some adjustments / tweaks (or may not work at all) if the TextField properties are changed.
Read more

Filed under Technology

Tech Tuesday: FlexFeed — Twitter RSS Feeds in Flex

[a note from Jodi: This is the inaugural Tech Tuesday post, which is going to be a regular feature where our nerds wow you with their technical prowess. First up, we have Chris Black, who does amazing things with Flex and ActionScript]

Using Flex and PHP it is possible to integrate Twitter RSS feeds into a Flex web page. Twitters cross domain policy (which is used by Flash) does not allow external resources to access feeds. Using PHP as a medium to the data, Flex can access the feed and display all contents. This technique can be used to access any xml data that Flex may not have access to.

Let’s start by creating an HTTPService:

 <mx:HTTPService 
        id="rssParse" 
        url="http://twitter.com/statuses/user_timeline/16584421.rss" 
        result="processResult(event)"
        resultFormat="e4x" />

Next we will create the function to process the results:
[as]
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;

[Bindable]
private var _rssResults:ArrayCollection;

// Define and use atom namespace.
private namespace atom = “http://www.w3.org/2005/Atom”;
use namespace atom;

private function processResult(event:ResultEvent):void
{
var xmlList:XMLList = event.result.channel.item as XMLList;
for each(var item:XML in xmlList){
var myDate:String = item.pubDate;
myDate = myDate.slice(0,22);
_rssResults.addItem({title: item.title, date: myDate});
}
}

private function init():void
{
_rssResults = new ArrayCollection();
rssParse.send();
}
[/as]

Now lets add the mxml to display the content:

<mx:VBox width="400" height="600" horizontalAlign="center">    
    <mx:Label styleName="subTitleText" text="Twitter Feed:" fontWeight="bold" fontSize="16"/>
    <mx:VBox height="500" width="400" verticalScrollPolicy="auto" horizontalScrollPolicy="off" horizontalAlign="center">
        <mx:Repeater id="twitter" dataProvider="{_rssResults}">
            <mx:Text textAlign="center" width="300" text="{twitter.currentItem.date}"/>
            <mx:Text textAlign="center" width="300" text="{twitter.currentItem.title}"/>
        </mx:Repeater>            
    </mx:VBox>    
</mx:VBox>  

After testing the application locally everything works great! But wait… what about the PHP code? Well first export a release build of the application and upload it to a web server for testing.

Here is the error that you should receive:
[RPC Fault faultString="Security error accessing url" faultCode="Channel.Security.Error" faultDetail="Destination: DefaultHTTP"]

To get around this let’s create a php file that collects the twitter data:

$twitter_feed = 'http://twitter.com/statuses/user_timeline/16584421.rss';
$rawfeed = @file_get_contents($twitter_feed);
print $rawfeed;

Now we need to update our HTTPService request to pull from the new php file:

<mx:HTTPService
   id="rssParse"
   url="php/twitter.php"
   result="processResult(event)"
   resultFormat="e4x" />

Now everything works great!

Check out this link to view a functional example.
And the source files.

Please leave a comment if you have any questions, comments, or suggestions. Thanks!

This was originally posted on blackcj.com, Chris Black’s personal blog. Chris is a Senior Developer at Sierra Bravo.

Filed under Technology

Get plugged in to Action Script 3

Thanks to our Action Script 3 experts, we’ve got a great list of AS3 resources you can use to familiarize yourself with this programming language.

Books:

Web sites:

Adobe Developer Connection must watch:

MN User Groups:

Filed under Technology