ColorGradientComponent
Represents the Kendo UI ColorGradient component.
The ColorGradientComponent lets you select a color by moving a drag handle over a gradient area. You can use it directly or as part of the kendo-colorpicker.
Definition
Package:@progress/kendo-angular-inputs
Selector:kendo-colorgradient
Export Name:Accessible in templates as #kendoColorGradientInstance="kendoColorGradient"
Syntax:
<kendo-colorgradient [(ngModel)]="color"></kendo-colorgradient>Inputs
clearButton
boolean
Shows or hides the Clear color button.
false
contrastTool
string
Enables the color contrast tool that checks the contrast ratio of the selected color against a predefined background color. See example.
delay
number
Sets the delay (in milliseconds) before the value changes on handle drag.
0
disabled
boolean
Disables the ColorGradient. To disable it in reactive forms, see Forms Support.
false
Sets the output format of the ColorGradient. The input value may be in a different format, but it will be parsed into the output format after the component processes it.
DEFAULT_OUTPUT_FORMAT
gradientSliderSmallStep
number
Sets the step (in pixels) for moving the gradient drag handle with Shift+arrow keys.
DRAGHANDLE_MOVE_SPEED_SMALL_STEP
gradientSliderStep
number
Sets the step (in pixels) for moving the gradient drag handle with the arrow keys.
DRAGHANDLE_MOVE_SPEED
opacity
boolean
Shows or hides the alpha slider.
true
readonly
boolean
Sets the read-only state of the ColorGradient.
false
Sets the size of the ColorGradient internal elements. The default value is set by the Kendo theme.
value
string
Sets the value of the selected color.
Fields
isFocused
boolean
Returns true if the component or its content is focused.
Events
valueChange
EventEmitter<string>
Fires when the user selects a new color..
Methods
Focuses the component.