Day 5: Weather Component
Howdy doody, here's a weather component. It displays the forecast for up to the next 7 days. In this case, the skinnable component is using the zip code "94103" -- that's San Francisco, so there's a good chance for rain.
Click the image to view the running example.
The project is available here. There's an overall weather component that takes a zip code, and provides information for up to seven single day forecast components. It is currently pulled from the NOAA weather forecast service. Happy forecasting!
Details after the jump
Day 1: Fullscreen Button
If any of you tried to make fullscreen applications in Flash Catalyst 1.0, you know that there was some tinkering necessary in Builder. While it's a great way to get your feet wet with Flex, sometimes you'd like something easier. So, I present to you, the Fullscreen Button Component as the first skinnable component of Christmas! Just skin the button, specify the button to make your application go fullscreen, and the skinnable component will handle the rest.
So let's get cooking!
Great post on Creating Flex 4 Themes Using Flash Catalyst by Elad Elrom
Check it out here, you guys: http://insideria.com/2010/08/creating-themes-in-flex-4.html
Elad performs a great step by step tutorial on using Catalyst to create Flex 4 Themes.
This is a must read in my opinion, enjoy!
Creating An Image Gallery Using a Data List
Ever wanted to create an image gallery with more than 20 images? Ever wanted to play some more with Data Lists in Catalyst? Well, here's your chance. We're going to create an image gallery using Data Lists and the Design Time Data Panel, so that you can create an image gallery with as many images as you want. The end result of this tutorial will look something like the below image.
More after the jump.
Setting the initial position on a scroll panel
If you've been playing around with scroll panels, you've probably noticed that the scrolling content window always starts off displaying the upper left corner of the actual scrolling content. Great for anything text-based, but not so great for anything image-based. For example, if you're scrolling an image, you will probably want to start out with the content window displaying the center of your content.
Example 1 (Centered Content)
Example 2 (Default, Top-left Content)
More after the jump!
Creating an Expandable Wireframe Container
Flash Catalyst comes with some useful wireframe components, but eventually you'll want a component that it doesn't offer. When this happens, you can easily create the component you want, add some interactivity and animation, and reuse the component throughout your projects. Let's dive into the process!
Adding key input to your swf
In Catalyst, it's easy to mock up interactions using mouse events with buttons and other components. But what if you want to add keyboard interactions, for events like pressing the "j" or enter keys? For example, try clicking the button in the below swf. Notice that you can also press the spacebar or the right arrow key to get the same effect.
The easiest way to do this is to mock up your interactions using buttons in Catalyst, and then tweak your project in Builder to add the key events. We'll go over how to do this after the jump.
How do I get components to reset after changing states?
When you transition between pages or states in Catalyst, objects remain just as you left them. If you moved a scrollbar or slider in Page 1, then transition to another page, the scrollbar or slider will be in the same position as you left it. Often, you would like these components to reset, so that when you come back to them, they appear as if you had arrived at Page 1 for the first time.
We'll talk a bit about why Catalyst behaves the way it does, and how to achieve the desired effect after the jump.
Playing sound on application load
Although I'm not a huge fan of websites where audio begins to play immediately on application load, I wanted to try and accomplish the effect in Catalyst.
Just be sure to keep a mute or stop button front and center for your users. 
We're going to use the Adobe Media Encoder to convert the audio file to a video file.
Why? Well Catalyst offers extremely limited support with audio files in 1.0. We can play them, but otherwise cannot control them (pause, stop). The video support offers much better options for controlling content.
First, choose the audio file you'd like to being immediately playing on application launch.