Table of Contents

Introduction
Who Should Read This?
How Does It Work?
Download(s)
System and Software Requirements
Adobe Photoshop Reserved Words

Tutorials
Overview
  1. Starting a Flex Project
  2. Hello World Panel
  3. Placing the CSXS Library

  4. Shortcut Buttons Panel
    1. JavaScript
    2. Design the Panel
    3. ActionScript
    4. Photoshop Persistent
    5. CSXS Logger AIR Debugger (Optional)

  5. Setting Up Script Listener

  6. Color Picker Panel
    1. JavaScript
    2. Design the Panel
    3. Find Character ID Code to Register Events
    4. ActionScript
    5. Create Custom Icons

  7. Flickr Search Panel
    1. Design the Panel
    2. Create a Flickr Service
    3. Design a Custom Module
    4. Modify Panel's Properties
    5. Connect on Preferences

  8. Per Layer Metadata Panel
    1. View Metadata
    2. JavaScript
    3. Find Character ID Code to Register Events
    4. Designing the Panel
    5. ActionScript
    6. Using Photomerge
Other Samples
Best Practices
Frequently Asked Questions
Acronyms and Definitions
Links
Adobe® Photoshop® Panel Developer's Guide

Color Picker Panel: Design the Panel

The second part of the Color Picker Panel is designing the Adobe Photoshop Panel using Adobe Flex Builder. The developer will drag and drop two color picker control components and two label control components to the design area within Adobe Flex Builder to design the Adobe Photoshop Panel. The result is an Adobe Photoshop Panel containing a background color picker and a foreground color picker.

Instructions:

  1. Complete the Starting a Flex Project.
  2. Go to File > New > Flex Project.
    1. Under Project name:, type in ColorPicker.
      Note: The Adobe Flex Builder Project filename and corresponding SWF filename must have the same name as the JavaScript filename.
    2. Deselect Use default location and under Folder:, save to the Desktop in a new folder called ColorPicker.
    3. Under Application type, select Web application (runs in Flash Player).
    4. Press Finish.
  3. Go to Design Mode by selecting Design under the ColorPicker.mxml tab or go to Window > Switch Source/Design Mode.
  4. Go to the Components window or go to Window > Components.
    1. Under the Controls folder in the Components window, drag and drop the following control components into the design area:
      • Two ColorPicker control components
      • Two Label control components corresponding to each ColorPicker control component
    2. Double-Click on one of the Label control component placed in the design area and type in Foreground Color and press Enter.
    3. Double-Click on the other Label control component placed in the design area and type in Background Color and press Enter.
  5. Go to File > Save.
  6. Close Adobe Flex Builder.
  7. Complete Placing and Using the CSXS Library.
Continue to Find Character ID Code to Register Events