.. include:: ../../global.rst

Toolbar Button
####################################################################################################

..	note::
	Toolbar buttons only work when placed on List Views.

Properties
****************************************************************************************************

Details
====================================================================================================
*	Name
*	Text
*	:strike:`Tooltip`

Settings
====================================================================================================
*	Icon

General
====================================================================================================
*	:strike:`Tab Index`
*	Visible
*	Enabled
*	:strike:`Format`
*	:strike:`Conditional Format`

Events
****************************************************************************************************
*	Clicked

Actions
****************************************************************************************************
*	:strike:`Focus`

Special
****************************************************************************************************

Text
====================================================================================================
The text of a toolbar button is only shown when the K2 icon is set to "None" and no FontAwesome icon has been specified.

FontAwesome
====================================================================================================
In version 2.0 and above, you can use FontAwesome icons as the icon for a toolbar button.
In order to do so, you simply need to append the following to the name of the control: :code:`[fa|x|yyyy]`, where:

*	:code:`x` needs to be replaced by one of the following values

	*	:code:`s` for the Solid icon set.

	*	:code:`r` for the Regular icon set.

	*	:code:`l` for the Light icon set.

	*	:code:`b` for the Brands icon set.

*	:code:`yyyy` needs to be replaced by the icon code.
	:ref:`FontAwesome codes <font-awesome>` can be found in `their cheat sheet <https://fontawesome.com/cheatsheet/pro>`_.

A sample toolbar button name is :code:`toolBarButton1 [fa|l|f708]`.

.. note::
	The FontAwesome icon takes precedence over the K2 icon.

.. note::
	The default K2 icons are simple predefined icons FontAwesome icons.

Screenshots
****************************************************************************************************
.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-android-2-1.jpg
	:class:		k2ba-screenshot with-shadow
.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-ios-2-1.png
	:class:		k2ba-screenshot with-shadow

.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-android-4-1.jpg
	:class:		k2ba-screenshot with-shadow
.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-ios-4-1.png
	:class:		k2ba-screenshot with-shadow

.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-android-4-2.jpg
	:class:		k2ba-screenshot with-shadow
.. image::	../../images/reference/controls/toolbar-button/control-toolbar-button-ios-4-2.png
	:class:		k2ba-screenshot with-shadow