In this show, we see how to apply what we learned about arbitrary type interpolation in a previous episode to the specific use case of resizing an AIR window. The ability to animate properties of arbitrary type is one of the key new features in the Flex 4 effects system, and it comes in handy for this use case where animating the x, y, width, and height properties of the native window aren't good enough. Instead, we need to interpolation a Rectangle object so that we can atomically set the bounds of the native window with each animation update.
Here's the video:
Instead of embedding the application like I normally do, I'm just going to provide this link to it. It's a link to an AIR application which you would need to install and run locally, because that's the way that AIR works. You may not care enough to do this, since it's just a live demonstration of what you see in the video. But it's here for completeness.
In this show, we see an introduction to the new system of type interpolation in Flex 4 effects. The ability to animate properties of arbitrary type is one of the key new features in the Flex 4 effects system. Previously, in Flex 3, the effects system dealt only with numbers. It was great at animating any properties of components at all ... as long as those properties were numeric. In particular, it knew how to calculate a numeric value during animations, given start and end values. Calculating these values is important, of course, because animations are specified with start and end values only (or, in the case of the new keyframes in Flex 4 effects, a series of intermediate values), and any other value that the property takes on during the animation must be calculated as a product of these start/end values plus the elapsed fraction of the animation.
Flex's ability to deal with only numbers was fine for most of the cases that UI developers would care about because, frankly, most of the properties on components are numbers: x position, y position, width, height, alpha, scaleX, scaleY - all of these are simple Numbers that can easily be tossed into a simple parameteric function to calculate an in-between number for Flex 3 animations.
But what if you want to animate a property that is not a number, like a Rectangle, or a Point, or some object specific to your code that we know nothing about? Or what if it is a number, but you can't calculate a simple interpolation of it numerically (like RGB colors, which we talked about in an earlier episode)? In that case, we need a way to calculate the in-between values for objects of that type. The new IInterpolator interface in Flex 4 exists for that purpose: you can create implementations of that interface and supply them to Flex 4 effects to tell us how to interpolate in-between values for these types and the effects can take it from there, calling your interpolators whenever they need to calculate animated values for properties of those types..
This video shows how we can write a custom interpolator for an arbitrary data structure (in this case, a Rectangle) and supply it to a Flex 4 Animate effect to have it animate our object.
I think there's a fundamental flaw in the Drunk on Software strategy. If you're actually drunk at the time, it is all too probable that you'll end up with interviews that don't seem quite as interesting, provocative, and hilarious as they did at the time. Nonetheless, Jon and James continue to produce these shows, unhampered by my petty theories and centuries of research on the effects of alcohol on coherent conversation and job security.
We all got together at MAX a couple of weeks ago and had a chat about the conference. Fortunately, I think we were all sober enough to speak in complete sentences. Maybe this should go into a new series that I'm proposing: "Drinking Responsibly on Software". Our branding experts are still working on the title.
This show is basically a recap of an earlier blog article I wrote, Penner for your Thoughts (named for the author of the Flex 3 easing functions, Robert Penner), except this time it's in video form (for the reading-impaired). The topic is about using the old easing functions in Flex 3 through the new IEaser interface that the Flex 4 effects require. See the article for more details about the whys and hows of this rather neat hack.
In this show, we see an introduction to the new approach to easing in Flex 4 effects, using the new IEaser interface. "Easing" is a term in Flash and Flex that means changing the way that time is interpolated in animations, to give more interesting and natural movement. In Flex 3, different easing behavior was applied by assigning easing function references to to the "easingFunction" property in effects. This was a powerful and easy-to-use mechanism, but we've changed the approach in Flex 4 to make easing more flexible and also simpler to customize. This video shows how we can write and alter a simple easing implementation to get arbitrary, custom easing behavior.
Here's the video:
Here is the demo application. Note that the real action here is in building the application and playing with the CustomEaser implementation. The demo below is just one iteration of that example, where we are accelerating in with a cubic ease by multiplying the elapsed fraction times itself three times:
Effects in Flex 4, the talk I gave earlier this week at Adobe MAX, is now available from Adobe TV. This is pretty awesome; I've never known talk recording to be published so soon after the actual event (in this case, actually published while the event was still going on).
The talk covers the overall architecture of the new effects in Flex 4, covering all of the new effects classes and also (my favorite part) the underlying details of how it all works, using the Animate class, the underlying Animation class, and all of the low-level helper classes. Lots of nitty-gritty details for those that care (and those that don't). If you saw my FlashCamp talk that I posted last June, you'll recognize some of the information and demos, but this talk goes into a lot more detail on the architecture and underlying details since I had more time to do so. For the code-hungry folks in the audience, I showed many demos throughout the talk to illustrate how the concepts and classes actually work in real code.
Here's the video. I show a lot of demos during the talk with plenty of code wading, so you might want to pop the player into fullscreen mode (look for the icon in the lower-right of the player).
Many of the demos are already posted in other CodeDependent posts, others are ones that I developed for MAX and have not yet published. But I will push these demos out eventually as well - look for future posts that cover these other demos in more detail.
Be sure to check out the other MAX talks, too. There was some great stuff at MAX this year, and it's pretty cool that we've posted the talks for all of the folks that couldn't make the conference, or had conflicts with other sessions, or simply couldn't stumble early enough for morning sessions after late night sessions in the bar the night before.
