FlashCats Flash Catalyst Tips N' Tricks

2Mar/11Off

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

This skinnable component requires Flash Catalyst Panini or higher.

The WeatherComponent has the following skin parts

  • Zip: A RichText skin part taking a zip code for the forecast
  • Day[0-6], WeatherComponentSingleDays, each representing the forecast for a 24 hour period

The WeatherComponentSingleDay component has the following skin parts. If they exist in a skin, they are dynamically populated at runtime.

  • Forecast Period: The day of the week the forecast is for.
  • Forecast Conditions: A summary of the forecast (eg "Slight Chance Rain").
  • Temp High F/C: Forecast high temperature in Fahrenheit / Celsius.
  • Temp Low F/C: Forecast low temperature in Fahrenheit / Celsius.

The WeatherComponentSingleDay has several states, each corresponding to a general weather condition. There are many different weather classifications; this component condenses them into a reasonable number of visual states.

Update: There is a bug for some NOAA forecasts, where the component doesn't update its text fields. I'll get a fix in when I can.

Posted by bear

Comments (1) Trackbacks (0)
  1. very interesting
    Could send more information or a simple example in Flash (FLA) to see how to use


Trackbacks are disabled.