FlatColorPickerComponent
Represents the Kendo UI FlatColorPicker component for Angular.
The FlatColorPickerComponent lets you choose colors through palettes with predefined sets of colors and through a gradient that renders an HSV canvas. You can preview the selected color, revert it to its previous state, or clear it.
Definition
Package:@progress/kendo-angular-inputs
Selector:kendo-flatcolorpicker
Export Name:Accessible in templates as #kendoFlatColorPickerInstance="kendoFlatColorPicker"
Syntax:
<kendo-flatcolorpicker [(value)]="selectedColor"></kendo-flatcolorpicker>
Inputs
Configures the layout of the Apply and Cancel action buttons.
'end'
Sets the initially active view in the FlatColorPicker. Supports two-way binding.
clearButton
boolean
Specifies whether the FlatColorPicker displays a Clear color button.
true
disabled
boolean
Sets the disabled state of the FlatColorPicker. To disable it in reactive forms, see Forms Support.
false
Specifies the output format of the FlatColorPicker.
If the input value is in a different format, the component parses it into the specified output format.
'rgba'
Configures the gradient view.
Configures the palette view.
preview
boolean
Displays Apply and Cancel action buttons and a color preview pane.
When enabled, the component value does not change immediately upon color selection, but only after the Apply button is clicked.
The Cancel button reverts the current selection to its initial state, i.e., to the current value.
true
readonly
boolean
Sets the read-only state of the FlatColorPicker.
false
Sets the size of the FlatColorPicker internal elements. The default value is set by the Kendo theme.
value
string
Specifies the initially selected color.
Specifies the views to render. The default value is gradient and palette.
Events
activeViewChange
EventEmitter<string>
Fires when the view is about to change.
Used to provide a two-way binding for the activeView property.
Fires when the user cancels the current color selection.
The event is emitted on preview pane or on 'Cancel' button click.
valueChange
EventEmitter<any>
Fires when the component value changes.