Action Color Picker

For iOS and Android development with Xamarin and Visual Studio

Available exclusively as part of the Action Component suite.

Action ComponentsSample App

About Action Color Picker

Action Color Picker provides a highly customizable, cross platform graphical color selection system for iOS and Android. With Action Color Picker you can present the user with the currently selected color, allow them to select the desired hue, then change the saturation and brightness of that hue, all with a minimum of code.

Action Color Picker provides functions to move easily between the HSV, RGB and native UIColor (iOS) and Color (Android) spaces. In many cases the same code used to work with an Action Color Picker on one platform can be used virtually unchanged on another which not only saves time, but improves code maintainability.


The Action Color Picker Suite

The Action Color Picker is actually a suite of several individual components that can be added to your iOS or Android apps to provide a wide range of color selection interfaces. Because of this flexibility, you can use the individual components of the suite to tailor the color selection UI to your app’s look and feel.

The following sections will define the individual components of the Action Color Picker and how they can be used within your apps.

ACColorCube (iOS/Android)

The Action Color Cube displays a color selection cube in the app’s user interface that allows the user to move a pointer around to select the Saturation and Brightness of a color Hue. For example:

This control is typically used with an Action Hue Bar (ACHueBar) to select the initial color Hue.

ACColorPickerViewController (iOS Only)

The Action Color Picker View Controller creates a color selection dialog box that fully handles the process of showing a currently selected color and allowing the user the select a new color. For Example:

It can be called at any point in an iOS app to allow the user to select a new color. For example:

// Create picker
var picker = new ACColorPickerViewController();
picker.Title = "Select a Pretty Color";
picker.Color = colorWell.Color;

// Wireup events
picker.SelectionFinished += (color) => {
    DismissViewController(true, null);
    colorWell.Color = color;

// Display
PresentViewController(picker, true, null);

ACColorWell (iOS/Android)

The Action Color Well displays a framed color well that shows the currently selected color and allows the user to tap the well which raises the Touched event. For example:

The ACColorWell is typically used along with the ACHueBar and ACColorCube controls and can be any size inside of the UI.

ACHueBar (iOS/Android)

The Action Color Hue Bar presents a hue selection bar to the user that they can interact with to select the current color. For example:

The ACHueBar is typically used with the ACColorCube and ACColorWell to form a fully color setting UI. When added to an app’s UI, the ACHueBar needs to be set to 256 pixels wide by 50 pixels high.

HSVColor (iOS/Android)

Defines a color as its Hue, Saturation and Value properties and contains utilities to move the color to and from other color spaces such as UIColor (iOS) or Color (Android).

HSVImage (iOS/Android)

The HSVImage class creates the HSV images to present in the ACColorCube and ACHueBar based on the current Hue, Saturation and Value properties.

RGBColor (iOS/Android)

Represents a color based on its Red, Green and Blue properties and contains the properties and methods to convert the color to a different color space, such as UIColor (iOS) or Color (Android).