FloatingActionButtonComponent
Represents the Kendo UI FloatingActionButton component for Angular. Use it to represent the primary or most common action in an application.
Definition
Package:@progress/kendo-angular-buttons
Selector:kendo-floatingactionbutton
Syntax:
<kendo-floatingactionbutton
[icon]="'plus'"
[text]="'Add'"
[align]="{ horizontal: 'end', vertical: 'bottom' }">
</kendo-floatingactionbutton>Inputs
Specifies the alignment of the FloatingActionButton (see example).
{ horizontal: 'end', vertical: 'top' }
buttonClass
any
The CSS classes that will be rendered on the main button.
Supports the type of values that are supported by ngClass.
dialClass
any
The CSS classes that will be rendered on the dial items ul element.
Supports the type of values that are supported by ngClass.
dialItemAnimation
boolean | DialItemAnimation
Specifies the animation settings of the FloatingActionButton dial items.
true
Specifies the collection of dial items rendered in the FloatingActionButton popup.
[]
disabled
boolean
Specifies whether the FloatingActionButton is disabled.
false
icon
string
Defines the name of an existing icon in a Kendo UI theme.
iconClass
string
Defines a CSS class or multiple classes for custom icons.
Specifies the offset position of the FloatingActionButton (see example).
{ x: '16px', y: '16px' }
Specifies the position mode of the FloatingActionButton (see example).
'fixed'
Specifies the border radius of the FloatingActionButton (see example). The default value is set by the Kendo theme.
Specifies the size of the FloatingActionButton (see example). The default value is set by the Kendo theme.
text
string
Specifies the text content of the FloatingActionButton.
Specifies the theme color of the FloatingActionButton (see example). The default value is set by the Kendo theme.
Fields
isOpen
boolean
Indicates whether the FloatingActionButton is currently open.
Events
blur
EventEmitter<any>
Fires when the FloatingActionButton is blurred.
close
EventEmitter<PreventableEvent>
Fires when the popup is about to close. This event is preventable (more information and example).
Fires when a dial item is clicked.
focus
EventEmitter<any>
Fires when the FloatingActionButton is focused.
open
EventEmitter<PreventableEvent>
Fires when the popup is about to open. This event is preventable (more information and example).
Methods
Blurs the FloatingActionButton.
Focuses the FloatingActionButton.
Toggles the visibility of the FloatingActionButton dial items popup.
If you use the toggleDial method to open or close the dial items,
the open and close events do not fire (more information and examples).
The state of dial items popup.