Developing Web Applications with the Web ADF - Web controls  

ColorPicker control

The ColorPicker control provides a runtime dialog which can be used to select a color.  Available colors include all the named colors in the .NET System.Drawing.Color structure.  Often a ColorPicker control is packaged in a composite control, such as a task.

Assembly: ESRI.ArcGIS.ADF.UI.WebControls.dll
Class: ESRI.ArcGIS.ADF.UI.WebControls.ColorPicker

Using the ColorPicker control
  1. Add a ColorPicker control

    The ColorPicker control does not require any other Web ADF controls in the page.  Simply add the ColorPicker control to the page.  Note that the design-time representation of the control does not provide an interactive list of colors.

    colorpicker design time
  2. Set ColorPicker control properties

    In the ColorPicker property page, set the following:
    1. Set the ChosenColor property to define a default display color at runtime.  This property can also be used to get the current color at runtime.
    2. Set the ShowColorNames property to False.  This will display a grid of colors at runtime.  If True, a drop down list of each color and its name will be provided.
    3. To capture the selected color on the client using JavaScript, set the OnColorPickedClient property to a JavaScript function name.  For example, "colorChosen".   In the aspx page, add a JavaScript function of the same name and include two parameters in the function call. 

      function colorChosen(sender, color)
    4. To capture the selected color on the server, handle the ColorPicked event.  The selected color will be passed to the event method as an argument.
  3. Runtime interaction

    At runtime, click on the active color box displayed by the ColorPicker.  A drop down list containing colors will be displayed.  Click on a color to select it.  The JavaScript function defined in the previous step will be called and the name of the selected color will popup in an alert box.  The active color box will now display the selected color.
    colorpicker runtime



  The following table provides a list of properties of interest.  For complete reference information, see the ColorPicker control in the library reference section.

Property Name  Type Description
ChosenColor Color Gets or sets the current chosen color.
ShowColorNames boolean True will display a drop down list with one color and name on each line.  False will display a grid of colors.
DropDownHeight string The height in pixels of the drop down list.
DisplayText string The text displayed at runtime next to the color box.
OnColorPickedClient string The name of a JavaScript function which will be called when a color is selected.  Two parameters are passed to the function: sender and the color name.


Event Type Description
ColorPicked Occurs when a color is selected.