How to run Flash Catalyst CS5.5 projects on Android devices
While playing around with Flash Catalyst 5.5 and Flash Builder 4.5 I realized it's pretty easy to get your Flash Catalyst projects onto android devices.
This tutorial will walk you through importing your Flash Catalyst CS5.5 project into Flash Builder 4.5, show you how to convert it to a Flex Mobile project, and finally run your project on an Android device.
As a heads up, I use this strictly as a prototyping/proof of concept method (no release version/to market apps). Flash Catalyst CS5.5 does not create projects optimized for flex mobile.
Requirements:
- Flash Catalyst 5.5
- Flash Builder 4.5
- Motorola Xoom (or other Android device running at least FP 10.2)
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!
Using Custom Skinnable Components in Panini
I'd like to do a quick introduction to custom skinnable components in Panini. Panini, in case you haven't heard, is the code name for the next version of Flash Catalyst, and you can download a trial version on Adobe Labs. Custom skinnable components are a new feature in Panini, one that can make life for both designers and developers significantly easier. For this example, we're going to build the following swf.
While this was possible in Catalyst 1.0, it could be a lot of work to add an additional "Slide" and the corresponding button interactions. With custom skinnable components, it's incredibly simple because a developer can create a component with the "Go forward" and "Go backward" logic built right in.
Is Panini sounding tasty? Take a bite!
Creating a Movie Gallery with Catalyst
We wrote an article for webdesigndev a little while back on creating a movie clip gallery with thumbnails. It's certainly our longest tutorial yet, and written as a way to get your feet wet with Catalyst. You can check it out over here.
Publishing to the Web!
Just a quick post on how to get everything uploaded to the web. Before you get started, you will need some form of web hosting, to serve your content to people requesting it. If you're looking for hosting, you can check out some of the large companies like BlueHost, HostGator, or WebFaction to at least get an idea of plans and pricing.
When you've finished a project in Flash Catalyst, you can publish it via the File > Publish option. This creates two versions of your project.
More after the jump.
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!
More than you’ll ever want to know about Grids + Guides in Catalyst.
You want grids and guides in Catalyst?
Well, we've got them.
This post is a simple rundown with some grids/guides tips and tricks... I mean, I need a break after that optimization post... right? 
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.