godot-docs/classes/class_button.rst

:github_url: hide

.. Generated automatically by doc/tools/make_rst.py in Godot's source tree.
.. DO NOT EDIT THIS FILE, but the Button.xml source instead.
.. The source is found in doc/classes or modules/<name>/doc_classes.

.. _class_Button:

Button
======

**Inherits:** :ref:`BaseButton<class_BaseButton>` **<** :ref:`Control<class_Control>` **<** :ref:`CanvasItem<class_CanvasItem>` **<** :ref:`Node<class_Node>` **<** :ref:`Object<class_Object>`

**Inherited By:** :ref:`CheckBox<class_CheckBox>`, :ref:`CheckButton<class_CheckButton>`, :ref:`ColorPickerButton<class_ColorPickerButton>`, :ref:`MenuButton<class_MenuButton>`, :ref:`OptionButton<class_OptionButton>`

Standard themed Button.

Description
-----------

Button is the standard themed button. It can contain text and an icon, and will display them according to the current :ref:`Theme<class_Theme>`.

\ **Example of creating a button and assigning an action when pressed by code:**\ 


.. tabs::

 .. code-tab:: gdscript

    func _ready():
        var button = Button.new()
        button.text = "Click me"
        button.connect("pressed", self, "_button_pressed")
        add_child(button)
    
    func _button_pressed():
        print("Hello world!")

 .. code-tab:: csharp

    public override void _Ready()
    {
        var button = new Button();
        button.Text = "Click me";
        button.Connect("pressed", this, nameof(ButtonPressed));
        AddChild(button);
    }
    
    private void ButtonPressed()
    {
        GD.Print("Hello world!");
    }



Buttons (like all Control nodes) can also be created in the editor, but some situations may require creating them from code.

See also :ref:`BaseButton<class_BaseButton>` which contains common properties and methods associated with this node.

\ **Note:** Buttons do not interpret touch input and therefore don't support multitouch, since mouse emulation can only press one button at a given time. Use :ref:`TouchScreenButton<class_TouchScreenButton>` for buttons that trigger gameplay movement or actions, as :ref:`TouchScreenButton<class_TouchScreenButton>` supports multitouch.

Tutorials
---------

- `2D Dodge The Creeps Demo <https://godotengine.org/asset-library/asset/515>`__

- `OS Test Demo <https://godotengine.org/asset-library/asset/677>`__

Properties
----------

+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` | :ref:`alignment<class_Button_property_alignment>`           | ``1``     |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`bool<class_bool>`                                           | :ref:`clip_text<class_Button_property_clip_text>`           | ``false`` |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`bool<class_bool>`                                           | :ref:`expand_icon<class_Button_property_expand_icon>`       | ``false`` |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`bool<class_bool>`                                           | :ref:`flat<class_Button_property_flat>`                     | ``false`` |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`Texture2D<class_Texture2D>`                                 | :ref:`icon<class_Button_property_icon>`                     |           |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` | :ref:`icon_alignment<class_Button_property_icon_alignment>` | ``0``     |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`String<class_String>`                                       | :ref:`language<class_Button_property_language>`             | ``""``    |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`String<class_String>`                                       | :ref:`text<class_Button_property_text>`                     | ``""``    |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+
| :ref:`TextDirection<enum_Control_TextDirection>`                  | :ref:`text_direction<class_Button_property_text_direction>` | ``0``     |
+-------------------------------------------------------------------+-------------------------------------------------------------+-----------+

Methods
-------

+-----------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
| void                  | :ref:`clear_opentype_features<class_Button_method_clear_opentype_features>` **(** **)**                                                        |
+-----------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
| :ref:`int<class_int>` | :ref:`get_opentype_feature<class_Button_method_get_opentype_feature>` **(** :ref:`String<class_String>` tag **)** |const|                      |
+-----------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
| void                  | :ref:`set_opentype_feature<class_Button_method_set_opentype_feature>` **(** :ref:`String<class_String>` tag, :ref:`int<class_int>` value **)** |
+-----------------------+------------------------------------------------------------------------------------------------------------------------------------------------+

Theme Properties
----------------

+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_color<class_Button_theme_color_font_color>`                             | ``Color(0.875, 0.875, 0.875, 1)``   |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_disabled_color<class_Button_theme_color_font_disabled_color>`           | ``Color(0.875, 0.875, 0.875, 0.5)`` |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_focus_color<class_Button_theme_color_font_focus_color>`                 | ``Color(0.95, 0.95, 0.95, 1)``      |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_hover_color<class_Button_theme_color_font_hover_color>`                 | ``Color(0.95, 0.95, 0.95, 1)``      |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_hover_pressed_color<class_Button_theme_color_font_hover_pressed_color>` | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_outline_color<class_Button_theme_color_font_outline_color>`             | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`font_pressed_color<class_Button_theme_color_font_pressed_color>`             | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_disabled_color<class_Button_theme_color_icon_disabled_color>`           | ``Color(1, 1, 1, 0.4)``             |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_focus_color<class_Button_theme_color_icon_focus_color>`                 | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_hover_color<class_Button_theme_color_icon_hover_color>`                 | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_hover_pressed_color<class_Button_theme_color_icon_hover_pressed_color>` | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_normal_color<class_Button_theme_color_icon_normal_color>`               | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Color<class_Color>`       | :ref:`icon_pressed_color<class_Button_theme_color_icon_pressed_color>`             | ``Color(1, 1, 1, 1)``               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`int<class_int>`           | :ref:`hseparation<class_Button_theme_constant_hseparation>`                        | ``2``                               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`int<class_int>`           | :ref:`outline_size<class_Button_theme_constant_outline_size>`                      | ``0``                               |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`Font<class_Font>`         | :ref:`font<class_Button_theme_font_font>`                                          |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`int<class_int>`           | :ref:`font_size<class_Button_theme_font_size_font_size>`                           |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`StyleBox<class_StyleBox>` | :ref:`disabled<class_Button_theme_style_disabled>`                                 |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`StyleBox<class_StyleBox>` | :ref:`focus<class_Button_theme_style_focus>`                                       |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`StyleBox<class_StyleBox>` | :ref:`hover<class_Button_theme_style_hover>`                                       |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`StyleBox<class_StyleBox>` | :ref:`normal<class_Button_theme_style_normal>`                                     |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+
| :ref:`StyleBox<class_StyleBox>` | :ref:`pressed<class_Button_theme_style_pressed>`                                   |                                     |
+---------------------------------+------------------------------------------------------------------------------------+-------------------------------------+

Property Descriptions
---------------------

.. _class_Button_property_alignment:

- :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` **alignment**

+-----------+---------------------------+
| *Default* | ``1``                     |
+-----------+---------------------------+
| *Setter*  | set_text_alignment(value) |
+-----------+---------------------------+
| *Getter*  | get_text_alignment()      |
+-----------+---------------------------+

Text alignment policy for the button's text, use one of the :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` constants.

----

.. _class_Button_property_clip_text:

- :ref:`bool<class_bool>` **clip_text**

+-----------+----------------------+
| *Default* | ``false``            |
+-----------+----------------------+
| *Setter*  | set_clip_text(value) |
+-----------+----------------------+
| *Getter*  | get_clip_text()      |
+-----------+----------------------+

When this property is enabled, text that is too large to fit the button is clipped, when disabled the Button will always be wide enough to hold the text.

----

.. _class_Button_property_expand_icon:

- :ref:`bool<class_bool>` **expand_icon**

+-----------+------------------------+
| *Default* | ``false``              |
+-----------+------------------------+
| *Setter*  | set_expand_icon(value) |
+-----------+------------------------+
| *Getter*  | is_expand_icon()       |
+-----------+------------------------+

When enabled, the button's icon will expand/shrink to fit the button's size while keeping its aspect.

----

.. _class_Button_property_flat:

- :ref:`bool<class_bool>` **flat**

+-----------+-----------------+
| *Default* | ``false``       |
+-----------+-----------------+
| *Setter*  | set_flat(value) |
+-----------+-----------------+
| *Getter*  | is_flat()       |
+-----------+-----------------+

Flat buttons don't display decoration.

----

.. _class_Button_property_icon:

- :ref:`Texture2D<class_Texture2D>` **icon**

+----------+------------------------+
| *Setter* | set_button_icon(value) |
+----------+------------------------+
| *Getter* | get_button_icon()      |
+----------+------------------------+

Button's icon, if text is present the icon will be placed before the text.

To edit margin and spacing of the icon, use :ref:`hseparation<class_Button_theme_constant_hseparation>` theme property and ``content_margin_*`` properties of the used :ref:`StyleBox<class_StyleBox>`\ es.

----

.. _class_Button_property_icon_alignment:

- :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` **icon_alignment**

+-----------+---------------------------+
| *Default* | ``0``                     |
+-----------+---------------------------+
| *Setter*  | set_icon_alignment(value) |
+-----------+---------------------------+
| *Getter*  | get_icon_alignment()      |
+-----------+---------------------------+

Specifies if the icon should be aligned to the left, right, or center of a button. Uses the same :ref:`HorizontalAlignment<enum_@GlobalScope_HorizontalAlignment>` constants as the text alignment. If centered, text will draw on top of the icon.

----

.. _class_Button_property_language:

- :ref:`String<class_String>` **language**

+-----------+---------------------+
| *Default* | ``""``              |
+-----------+---------------------+
| *Setter*  | set_language(value) |
+-----------+---------------------+
| *Getter*  | get_language()      |
+-----------+---------------------+

Language code used for line-breaking and text shaping algorithms, if left empty current locale is used instead.

----

.. _class_Button_property_text:

- :ref:`String<class_String>` **text**

+-----------+-----------------+
| *Default* | ``""``          |
+-----------+-----------------+
| *Setter*  | set_text(value) |
+-----------+-----------------+
| *Getter*  | get_text()      |
+-----------+-----------------+

The button's text that will be displayed inside the button's area.

----

.. _class_Button_property_text_direction:

- :ref:`TextDirection<enum_Control_TextDirection>` **text_direction**

+-----------+---------------------------+
| *Default* | ``0``                     |
+-----------+---------------------------+
| *Setter*  | set_text_direction(value) |
+-----------+---------------------------+
| *Getter*  | get_text_direction()      |
+-----------+---------------------------+

Base text writing direction.

Method Descriptions
-------------------

.. _class_Button_method_clear_opentype_features:

- void **clear_opentype_features** **(** **)**

Removes all OpenType features.

----

.. _class_Button_method_get_opentype_feature:

- :ref:`int<class_int>` **get_opentype_feature** **(** :ref:`String<class_String>` tag **)** |const|

Returns OpenType feature ``tag``.

----

.. _class_Button_method_set_opentype_feature:

- void **set_opentype_feature** **(** :ref:`String<class_String>` tag, :ref:`int<class_int>` value **)**

Sets OpenType feature ``tag``. More info: `OpenType feature tags <https://docs.microsoft.com/en-us/typography/opentype/spec/featuretags>`__.

Theme Property Descriptions
---------------------------

.. _class_Button_theme_color_font_color:

- :ref:`Color<class_Color>` **font_color**

+-----------+-----------------------------------+
| *Default* | ``Color(0.875, 0.875, 0.875, 1)`` |
+-----------+-----------------------------------+

Default text :ref:`Color<class_Color>` of the ``Button``.

----

.. _class_Button_theme_color_font_disabled_color:

- :ref:`Color<class_Color>` **font_disabled_color**

+-----------+-------------------------------------+
| *Default* | ``Color(0.875, 0.875, 0.875, 0.5)`` |
+-----------+-------------------------------------+

Text :ref:`Color<class_Color>` used when the ``Button`` is disabled.

----

.. _class_Button_theme_color_font_focus_color:

- :ref:`Color<class_Color>` **font_focus_color**

+-----------+--------------------------------+
| *Default* | ``Color(0.95, 0.95, 0.95, 1)`` |
+-----------+--------------------------------+

Text :ref:`Color<class_Color>` used when the ``Button`` is focused. Only replaces the normal text color of the button. Disabled, hovered, and pressed states take precedence over this color.

----

.. _class_Button_theme_color_font_hover_color:

- :ref:`Color<class_Color>` **font_hover_color**

+-----------+--------------------------------+
| *Default* | ``Color(0.95, 0.95, 0.95, 1)`` |
+-----------+--------------------------------+

Text :ref:`Color<class_Color>` used when the ``Button`` is being hovered.

----

.. _class_Button_theme_color_font_hover_pressed_color:

- :ref:`Color<class_Color>` **font_hover_pressed_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Text :ref:`Color<class_Color>` used when the ``Button`` is being hovered and pressed.

----

.. _class_Button_theme_color_font_outline_color:

- :ref:`Color<class_Color>` **font_outline_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

The tint of text outline of the ``Button``.

----

.. _class_Button_theme_color_font_pressed_color:

- :ref:`Color<class_Color>` **font_pressed_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Text :ref:`Color<class_Color>` used when the ``Button`` is being pressed.

----

.. _class_Button_theme_color_icon_disabled_color:

- :ref:`Color<class_Color>` **icon_disabled_color**

+-----------+-------------------------+
| *Default* | ``Color(1, 1, 1, 0.4)`` |
+-----------+-------------------------+

Icon modulate :ref:`Color<class_Color>` used when the ``Button`` is disabled.

----

.. _class_Button_theme_color_icon_focus_color:

- :ref:`Color<class_Color>` **icon_focus_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Icon modulate :ref:`Color<class_Color>` used when the ``Button`` is focused. Only replaces the normal modulate color of the button. Disabled, hovered, and pressed states take precedence over this color.

----

.. _class_Button_theme_color_icon_hover_color:

- :ref:`Color<class_Color>` **icon_hover_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Icon modulate :ref:`Color<class_Color>` used when the ``Button`` is being hovered.

----

.. _class_Button_theme_color_icon_hover_pressed_color:

- :ref:`Color<class_Color>` **icon_hover_pressed_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Icon modulate :ref:`Color<class_Color>` used when the ``Button`` is being hovered and pressed.

----

.. _class_Button_theme_color_icon_normal_color:

- :ref:`Color<class_Color>` **icon_normal_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Default icon modulate :ref:`Color<class_Color>` of the ``Button``.

----

.. _class_Button_theme_color_icon_pressed_color:

- :ref:`Color<class_Color>` **icon_pressed_color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+

Icon modulate :ref:`Color<class_Color>` used when the ``Button`` is being pressed.

----

.. _class_Button_theme_constant_hseparation:

- :ref:`int<class_int>` **hseparation**

+-----------+-------+
| *Default* | ``2`` |
+-----------+-------+

The horizontal space between ``Button``'s icon and text.

----

.. _class_Button_theme_constant_outline_size:

- :ref:`int<class_int>` **outline_size**

+-----------+-------+
| *Default* | ``0`` |
+-----------+-------+

The size of the text outline.

----

.. _class_Button_theme_font_font:

- :ref:`Font<class_Font>` **font**

:ref:`Font<class_Font>` of the ``Button``'s text.

----

.. _class_Button_theme_font_size_font_size:

- :ref:`int<class_int>` **font_size**

Font size of the ``Button``'s text.

----

.. _class_Button_theme_style_disabled:

- :ref:`StyleBox<class_StyleBox>` **disabled**

:ref:`StyleBox<class_StyleBox>` used when the ``Button`` is disabled.

----

.. _class_Button_theme_style_focus:

- :ref:`StyleBox<class_StyleBox>` **focus**

:ref:`StyleBox<class_StyleBox>` used when the ``Button`` is focused. The ``focus`` :ref:`StyleBox<class_StyleBox>` is displayed *over* the base :ref:`StyleBox<class_StyleBox>`, so a partially transparent :ref:`StyleBox<class_StyleBox>` should be used to ensure the base :ref:`StyleBox<class_StyleBox>` remains visible. A :ref:`StyleBox<class_StyleBox>` that represents an outline or an underline works well for this purpose. To disable the focus visual effect, assign a :ref:`StyleBoxEmpty<class_StyleBoxEmpty>` resource. Note that disabling the focus visual effect will harm keyboard/controller navigation usability, so this is not recommended for accessibility reasons.

----

.. _class_Button_theme_style_hover:

- :ref:`StyleBox<class_StyleBox>` **hover**

:ref:`StyleBox<class_StyleBox>` used when the ``Button`` is being hovered.

----

.. _class_Button_theme_style_normal:

- :ref:`StyleBox<class_StyleBox>` **normal**

Default :ref:`StyleBox<class_StyleBox>` for the ``Button``.

----

.. _class_Button_theme_style_pressed:

- :ref:`StyleBox<class_StyleBox>` **pressed**

:ref:`StyleBox<class_StyleBox>` used when the ``Button`` is being pressed.

.. |virtual| replace:: :abbr:`virtual (This method should typically be overridden by the user to have any effect.)`
.. |const| replace:: :abbr:`const (This method has no side effects. It doesn't modify any of the instance's member variables.)`
.. |vararg| replace:: :abbr:`vararg (This method accepts any number of arguments after the ones described here.)`
.. |constructor| replace:: :abbr:`constructor (This method is used to construct a type.)`
.. |static| replace:: :abbr:`static (This method doesn't need an instance to be called, so it can be called directly using the class name.)`
.. |operator| replace:: :abbr:`operator (This method describes a valid operator to use with this type as left-hand operand.)`