IT tutorials
 
Graphics
 

Adobe Flash Catalyst CS5 : Flash Catalyst data lists

11/8/2011 5:08:33 PM
- How To Install Windows Server 2012 On VirtualBox
- How To Bypass Torrent Connection Blocking By Your ISP
- How To Install Actual Facebook App On Kindle Fire
A data list is a special type of component used to retrieve and display a series of related items. You can design a data list using Flash Catalyst. Typically, you’ll include enough sample records to demonstrate the layout and behavior of the list. Once you finalize the look and feel, a Flex developer can use Adobe Flash Builder to connect your Data List component to a web service that retrieves and displays any number of records when the application runs.

A list is not always a list

The name data list is a little misleading. Each unique record in a Flash Catalyst data list can include artwork, text, or a combination of both. It doesn’t need to be a list at all. Traditionally, a data list might look something like a spreadsheet or data table.

Using Flash Catalyst, you can build a Data List component that displays a tiled wall of images.

A list can be a scrolling filmstrip or series of thumbnails, from which you select and view other content or navigate to new locations in the application. By adding a scroll bar, you can extend the list to include any number of items.

Of course, there’s nothing stopping you from making your data list look like an ordinary list if that’s what you want. In fact, there’s even a built-in wireframe Data List component.

By default, the records in a data list can have different Normal, Over, and Selected states. You can use the Over state to reveal more information about a record when a user rolls over an item.

What is design-time data?

When developing an application that’s used to present large amounts of data, it’s not always possible to see the end result until the application is running and connected to a back-end data source. That is unless you’re using a Flash Catalyst Data List component and design-time data. Design-time data allows you to use dummy content, such as sample database records or bitmap images, without having to actually connect to a back-end system. This gives you, the designer, complete control over the final look and feel of the user experience. This also makes it possible for a developer using Adobe Flash Builder to replace the design-time data with real data from a database or web service while maintaining the interactions and pixel-perfect design from Flash Catalyst.

Preview a data list

Before you dive in and start making a new data list, let’s take a moment to preview how a list appears when it’s put together. Seeing a Data List component in action will help you to understand each of its parts and how they relate to one another in a working application.

1.
Start Flash Catalyst. Browse to the Lesson10 folder on your hard drive and open the Restaurants_finished.fxp file.

2.
Run the project in a browser.

When the application starts, it plays a short video and then stops on a horizontal list of restaurants. This is a horizontal data list. If you roll over an item in the list, you see its Over state. Scroll arrows let you move forward and backward through the list.

3.
Click the right scroll arrow to see more restaurants in the data list.

4.
Click any restaurant.

Clicking an item in the data list takes you to a different page in the application. Each restaurant includes a Reviews button.

5.
Click Reviews.

The restaurant reviews are included in a vertical data list. Each item in the list includes an image, the name of the reviewer, a short review, and a star rating.

6.
Roll over and click a few of the reviews in the list.

The reviews have different Normal, Over, and Selected states. In the next exercise, you are going to re-create this data list.

7.
Close the browser and return to Flash Catalyst.

8.
Close the project without saving changes.
 
Others
 
- Adobe Illustrator CS5 : Printing from Illustrator (part 3) - Specifying Color Separations
- Adobe Illustrator CS5 : Printing from Illustrator (part 2) - Exploring the Marks and Bleed Print Panel & Exploring the Output Print Panel
- Adobe Illustrator CS5 : Printing from Illustrator (part 1) - Exploring the General Print Panel
- Dreamweaver CS5 : Understanding Templates & Creating Your Own Templates
- Dreamweaver CS5.5 : Using the Open Browser Window Behavior
- Adobe Photoshop CS5 : Fixing Shots with a Dull Gray Sky
- Adobe Photoshop CS5 : When Your Subject Is in the Shadows
- Adobe After Effects CS5 : Color Correction for Image Optimization (part 2) - Individual Channels for Color Matching
- Adobe After Effects CS5 : Color Correction for Image Optimization (part 1) - Levels
- Adobe Fireworks CS5 : Working with Bitmap Images - Managing images on the canvas
 
 
Top 10
 
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
programming4us programming4us
 
Popular tags
 
Video Tutorail Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 Adobe Indesign Adobe Flash Professional Dreamweaver Adobe Illustrator Adobe After Effects Adobe Photoshop Adobe Fireworks Adobe Flash Catalyst Corel Painter X CorelDRAW X5 CorelDraw 10 QuarkXPress 8 windows Phone 7 windows Phone 8 BlackBerry Android Ipad Iphone iOS
Celebrity Style, Fashion Trends, Beauty and Makeup Tips.