Creating a banner ad manager

Creating a banner ad manager

Many web sites include banners that display advertisements. Often these are static JPEG or GIF images but sometimes, the banner rotates through a series of images, with a transition between each. In this tutorial, I’m going to show you how to use Flash to create a dynamic banner ad manager. You’ll be able to load external images and display them one at a time, with a fade in transition effect.

The Flash movie that we build will load external JPEG, GIF, PNG or even SWF files into the banner. You’ll be able to manage the settings from an XML file that contains the list of images as well as the timings for the fade effect. You can determine the length of the fade in or out as well as the length of time that each image displays.

I’ll cover the following areas in the tutorial:

• Loading an external XML document
• Creating a class file in AS2.0
• Working with the Transition Manager class
• Working with Set Interval

I’ve used ActionScript 2.0 with a single class file in this tutorial so you’ll need at least Flash MX 2004 to complete the example. I’ve assumed that you’re familiar with writing ActionScript and that you understand concepts like variables and loops. I’ve also assumed that you’ve got a basic understanding of the XML object. If not, you might want to refresh your knowledge with some of the earlier tutorials.

You can download the source files for the tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. The download includes the starter files you'll need as well as the completed files.

Read More

Creating a Flash Video Player

Creating a Flash Video Player

The tutorial will cover the following topics:

• Creating a video object and using it to load a FLV file
• Controlling playback with buttons
• Displaying the elapsed time
• Loading a list of videos from an XML document
• Loading a video dynamically from a drop down list

You’ll learn how to create a video object and how to connect it so that you can stream content from an external file. You’ll also learn how to load content from an XML document that populates a ComboBox component.

You can download the resources for this tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file.

Read More

Consuming the Adobe developer news with Flash Lite 2.0

Consuming the Adobe developer news with Flash Lite 2.0

In a previous article, I showed you how to work with Flash Lite 2.0 – the latest version of Flash Lite for mobile devices such as cell phones. In this article, I’m going to show you how to consume an XML news feed using Flash Lite 2.0. I’ll create an application that consumes the Adobe developer news and displays one item at a time in a mobile phone. You’ll see how to configure the soft keys for the phone to move to the next and previous items.

In this tutorial, I’ll target the Nokia 6680 mobile phone. I’ll use the Flash Lite 2.0 emulator in Flash 8 to test the content. You will only be able to complete the tutorial if you have Flash 8 with the Flash Lite 2.0 update. You can install this by downloading it from http://www.adobe.com/support/flash/downloads.html and double-clicking to install.

You can download the resources for this tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. Read More

Flash Optimizing, Bettering Your FLA & SWF

Flash performance means everything. With Adobe's name on Flash, there's bound to be floods more inexperienced Flash users publishing animations that aren't bandwidth and CPU friendly. As industry professionals, we have a responsibility to not let Flash backfire on us. You may have experienced this already with a client, refusing a feature because of bad personal encounters. Features are one part of the battle, performance is always part of the battle.

Time for that phrase we all enjoy - production standards. We all need to be responsible with our authoring work. There are some work flow techniques that can be second nature to you when working in Flash. Some may seem simple or common, but do you use them 100% of the time?! I'd hope so. Things like simple asset considerations must be met before importing assets, true, and there are considerations for production when using the assets. Here's where work flow techniques cash in; imagine opening an FLA 6-months later to not know where or what everything is, very unprofessional.

By adopting techniques covered here, you can be assured your published movies and FLA's all well made and maintainable. This article covers techniques I've trained, learned, borrowed, and invented in over 7 years of using Flash.

• Library & Symbol Commandments - authoring and maintenance standards.
• Timeline Production Must-do's for Stage & Moveclips.
• Optimizing Timeline animations and ensuring performance.
• Movie Frame rate and Filter/Effect recommendations.

A few Flash 8 specific features are covered, but this entire article is for any version higher than Flash 3.

Read More

Getting Started with Flash Lite 2.0

Getting Started with Flash Lite 2.0

In a previous article, Getting Started with Flash Lite, I showed you how to work with Flash Lite 1.1. You learned that Flash Lite works with many types of mobile devices including PDAs, mobile phones and DVD players. You also learned that you have to use ActionScript 4 in Flash Lite 1.1 and that this can be quite limiting.

In this tutorial, I’ll use Flash 8 and Flash Lite 2.0 to create the same application from the earlier tutorial on Flash Lite 1.1. We’ll create a simple standalone application that shows today’s date as well as the number of days until Christmas. Of course, you could change the application slightly if you want to calculate the number of days until your birthday or some other important event! Read More

Creating a slide show with Flex 2.0 Beta 2

In the previous article, I introduced you to the Flex 2.0 Beta and showed you how to create a very simple calculator application using Flex Builder. As you’ll recall, Flex allows you to build Rich Internet Applications without using Flash software. Flex uses an XML vocabulary called MXML to describe interfaces that you can then wire up with ActionScript. Flex 2.0 Beta 2 works with ActionScript 3.0.

In this article, I’m going to show you how to create a photo slide show application with Flex. The slide show will display photos, one-by-one, using a fade-in effect. The photo filenames come from an external XML document. While building this application, you’ll have a chance to learn about the ActionScript 3.0 language. It will also cover the new approach to working with XML - E4X.

Specifically, if you work through this article, you’ll learn how to:

• Create an interface in Flex Builder
• Load an external XML document into an XML object
• Navigate the XML object to extract information
• Add styling to a Flex application
• Add a fade-in effect

You will only be able to complete this tutorial if you have downloaded and installed the Flex framework and SDK from http://labs.macromedia.com/flexproductline/. That means you’ll need to be using Windows with Flash Player 8.5 installed. I’m not going to go through the setup of Flex—you can find that in the previous article.

Let’s make a start!

Read More

Getting started with Flex 2.0 Beta 2

If you’ve worked with Flash, you have probably heard of Flex. So what is it and why do you need to know more? Flex allows you to create Rich Internet Applications without Flash. In Flex, you create applications using a standard set of XML tags from a language called MXML. The tags describe the interface and you can write ActionScript to wire up the components and make the application work.

Read More

Building a Simple Hangman Game with Flash part 2

Welcome to the second part of our two part tutorial about how to build a simple hangman game. In the first part of the tutorial, we discussed the logic behind the application and covered each of the interface elements that we’d need for the game.

You don’t need to have completed part 1 of the tutorial, but it will help you to understand exactly what we’re building here.

As with part 1, you’ll need to have a basic knowledge of ActionScript to complete the tutorial. You’ll need to know where to enter ActionScript and have a basic understanding of concepts like variables and functions. The code in this tutorial is ActionScript 2.0 but it is not class-based. You’ll need at least Flash MX 2004 to complete the tutorial.

You can download the source files for the tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. The download includes the starter file as well as the completed hangman game.

Read More

Hands-on Primer on skinning Flash components

Introduction

Flash components are cool! That, of course, is an understatement.  The ability to create highly customized, visually attractive application interfaces is the most obvious advantage of Flash components over their HTML counterparts. One could never achieve the same level of customization with CSS and HTML as with skins in Flash.

Back in Flash MX days skinning components was a fun and easy thing to do: you would simply modify some items in the movie’s Library and publish your movie – your components would be updated in a blink of an eye.

But ever since the version 2.0 of the Components architecture was implemented many designers have been feeling shy about the whole skinning idea. As the skins’ elements are embedded into the precompiled SWC movie clips and are no longer listed in the movie’s Library, they are not available directly for editing.

Well, the truth is the new architecture allows you to skin your components in a smarter, more organized way.
Sure you can change colors of certain elements through Action Script, apply “halo themes” and Cascading Style Sheets, but version 2.o architecture also allows you to modify your components’ appearance directly as you would do with any regular shape of symbol.

This article is called “Hands-on Primer on skinning Flash components”. It means that I am not going to bore you with a lot of theory. You will find a little bit of theory at the end of article (just a tiny bit), but by the time we are done you will intuitively know most of it.

Read More

Building a Simple Hangman Game with Flash – part 1

Developers use Flash for lots of different types of applications. You’ve probably seen full Flash web sites, photo galleries and e-learning applications. Flash is particularly well-suited for building games and I’m sure you’ve seen many examples on the Web.

In this two part tutorial series, I’m going to show you how to build a simple hangman game. If you haven’t played hangman before, it’s a game where users have to guess a word, given the number of letters. In our games, users will be able to guess 8 different letters to try and solve the word. For each incorrect guess, another part of the hangman is built. The user loses when the hangman is completed.

You can download the source files for the tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. The download includes the starter file as well as the completed file. Read More

New drawing features in Flash 8 - part 2

Welcome to the second article about the new drawing features of Flash 8. If you read the first article, you’d have seen some of the new drawing features within Flash including the Rectangle and Oval tool settings dialog boxes, working with Drawing Objects and creating enhanced strokes and joins. However, you don’t need to have read that tutorial first. In this article, we’ll cover the expanded Gradients and the new 9-slice scaling feature in Flash 8.

You’ll need a copy of Flash 8 to see the new features explored in this article and the areas that I’ll cover apply to both versions of Flash Basic 8 and Flash Professional 8.  You can download a trial version of the software from the Macromedia Web site.

You can also download the source files for the tutorial from the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. The download includes the starter files you'll need as well as the completed files.

We’ll start by looking at the new options for working with gradients.

Read More

New drawing features in Flash 8 - part 1

Flash 8 includes some great new drawing features that may change your approach to drawing and will certainly make using Flash much easier. In addition to the Object Drawing model, there is a new method for adding rectangles and ovals to your movies as well as some additional options for drawing lines. I’ll cover both of these topics in this article.

Other new drawing features include enhanced gradients and the ability to specify scaling for objects. I’ll cover both of those features in part 2 of this topic.

You’ll need a copy of Flash 8 to see the new features explored in this article and these areas apply to both versions of Flash Basic 8 and Flash Professional 8. You can download a trial version of Flash 8 from the Macromedia Web site.

You’ll find the source files for the tutorial in the blue Properties box that contains the article PDF. There's a heading titled Code Download and you can click the Details link next to it to get the zip file. The download includes the starter files you'll need for the exercises in this article as well as the completed files, in case you want to see my solutions.

We’ll start by looking at a new way to draw rectangles and ovals.

Read More