Accessibility
Dan Carr

Dan Carr

Dan Carr Design

Table of Contents

  1. Introduction
  2. Overview of the application and top-level files
  3. Exploring the source files
  4. Preloading and file management
  5. Preparing FLV video files
  6. Building controls using
    ActionScript 3
  7. Adding your own videos to the gallery
Created:
30 April 2007
Modified:
1 June 2009
User Level:
Advanced
Products:
Flash

Deconstructing the ActionScript 3 Flash video gallery application

The ActionScript 3 Flash video gallery has been a popular application since it was first developed as a marketing piece for Macromedia Flash Professional 8. As an ongoing exploration of the video gallery application, we've refined the template into a set of sample files that you can explore and use as a jumping-off point in your own work.

This article covers the update for Adobe Flash CS4 Professional. The sample files contain the Flash CS4 FLVPlayback component with expanded accessibility features and a simplified project structure.

Updates to the video gallery include:

  • Refined ActionScript 3 code structure
  • Simplified FLA file and document library structure
  • Updated FLVPlayback component with Accessibility
  • Feature initialization through URL variables
  • Ability to launch a video detail view during initialization
  • Ability to play streaming of progressive videos
  • Ability to play MPEG-4 and FLV file formats (Flash Player 9.0.115 and later)
  • Complete skinning control over branding and design (easier access)
  • Highlight state for selected thumbnail video
  • Debug mode and problem solving notes

Changes to the video gallery include:

  • This version of the video gallery removes support for embedded thumbnail videos to simplify the file structure and improve performance.

There is one major change to the video gallery: This version of the video gallery removes support for embedded thumbnail videos to simplify the file structure and improve performance.

A sample of the ActionScript 3 Flash video gallery is available online for review. The video gallery is composed of three primary features: the video thumbnails on the left, the video filter controls below the thumbnails, and the video detail view on the right. Clicking the filter buttons activates video choices using two user-defined filter options. Clicking a video thumbnail launches a detailed view of a video, which displays the full video clip and further details as specified in the accompanying XML source file.

This article provides an overview of the files and structure necessary to create an application of this type. We'll explore the source files for the video gallery as a case study.

Note: The look and feel of the ActionScript 3 Flash video gallery is similar to the previous version, but the development experience and range of features has been improved. Please see the previous version of this article, Deconstructing the ActionScript 2 Flash video gallery application, for more information about using the ActionScript 2 source files.

Requirements

To make the most of this tutorial, you'll need the following software and files:

Flash CS4 Professional

Sample files:

Prerequisite knowledge

  • Before you begin, read Examining the ActionScript 3 Flash video gallery source files to get a better understanding of how the application works.
  • General experience in SWF application development is advised, but this article is geared towards anyone interested in an overview of application development techniques in Flash CS4 Professional.
Page 1 of 7
Next Page

About the author

Dan Carr is owner, lead developer, and trainer for Dan Carr Design in San Francisco. With years of experience developing for Macromedia and Adobe, Dan has created a range of features available in Flash, including e-learning templates, UI components, and Developer Resource Kit extensions. Dan teaches Flash design and ActionScript classes in Northern California and develops e-learning and web applications for the public, as well as for Adobe product teams.