ButtonComponent

Provides UI button functions.

# Properties

[{"index":"TransitionColorSet Colors (HideFromInspector)","0":"Sets the button's color according to its state."}]

[{"index":"boolean IgnoreMapLayerCheck (Sync)","0":"Does not perform automatic substitution when the Map Layer's name is specified in SortingLayer."}]

[{"index":"TransitionRUIDSet ImageRUIDs (HideFromInspector)","0":"Sets the image of the button according to its state."}]

[{"index":"KeyboardKey KeyCode","0":"When pressing the button, it operates as if the specified keyCode was pressed."}]

[{"index":"int32 OrderInLayer (Sync)","0":"Determines the priority within the same layer. A higher number indicates higher priority."}]

[{"index":"boolean OverrideSorting (Sync) (ReadOnly)","0":"Determines whether to set the SortingLayer and OrderInLayer values manually."}]

[{"index":"boolean Selectable","0":"The option that sets whether a button's selection state can be maintained."}]

[{"index":"string SortingLayer (Sync)","0":"When two or more entities overlap, the priority is determined according to the Sorting Layer."}]

[{"index":"TransitionType Transition","0":"This is a type for the button's state transition."}]

##### inherited from Component:

[{"index":"boolean Enable (Sync)","0":"Checks whether Component is activated or not."}]

[{"index":"boolean EnableInHierarchy (ReadOnly) (HideFromInspector)","0":"Displays whether this Component is Enable in the hierarchy. If Entity Enable is false regardless of Component Enable, returns false."}]

[{"index":"Entity Entity (ReadOnly)","0":"The Entity that owns this component."}]

# Methods

##### inherited from Component:

[{"index":"boolean IsClient()","0":"Returns whether the current execution environment is a client or not."}]

[{"index":"boolean IsServer()","0":"Returns whether the current execution environment is a server or not."}]

# Events

[{"index":"ButtonClickEditorEvent","0":"The editor event occurs when clicking the Button."}]

[{"index":"ButtonClickEvent","0":"The event occurs when clicking a Button."}]

[{"index":"ButtonPressedEvent","0":"This event occurs when the button's state becomes Pressed."}]

[{"index":"ButtonStateChangeEditorEvent","0":"The editor event occurs when changing the Button's state."}]

[{"index":"ButtonStateChangeEvent","0":"This event occurs when changing the Button's state."}]

[{"index":"OrderInLayerChangedEvent","0":"This event occurs when changing the Component's OrderInLayer."}]

[{"index":"SortingLayerChangedEvent","0":"This event occurs when changing the component's SortingLayer."}]

# Examples

Here's an example of changing the button image or the color of the image while pressing the button.  
You can test by adding this Component to an Entity with ButtonComponent.
    
    
    @Component
    script ButtonHoldVisualizer extends Component
        property boolean IsButtonDown = false
        property number RedVal = 0
        property number TimerID = 0
        property any MonsterRUID = "96e955c1bf27415e84f96deea200a8f1"
        property any OriginalRUID = ""
    
        @ExecSpace("ClientOnly")
        method void OnBeginPlay()
        self.OriginalRUID = self.Entity.SpriteGUIRendererComponent.ImageRUID
        end
    
        method void CancelHoldButton()
        _TimerService:ClearTimer(self.TimerID)
        self.Entity.SpriteGUIRendererComponent.ImageRUID = self.OriginalRUID
        self.IsButtonDown = false
        self.RedVal = 0
        end
    
        @EventSender("Self")
        handler HandleButtonPressedEvent(ButtonPressedEvent event)
        -- Parameters
        -------------------------------------------------------
        if self.IsButtonDown then
        	self:CancelHoldButton()
        else
        	self.Entity.SpriteGUIRendererComponent.ImageRUID = self.MonsterRUID
        end
    
        self.IsButtonDown = true
    
        local AddMoreRed  = function()
        if self.RedVal <= 1 then
        	self.RedVal = self.RedVal + 0.2
        	self.Entity.ButtonComponent.Colors.PressedColor = Color(self.RedVal, 0, 0)
        end
        end
        self.TimerID = _TimerService:SetTimerRepeat(AddMoreRed, 0.3)
        end
    
        @EventSender("Self")
        handler HandleButtonClickEvent(ButtonClickEvent event)
        -- Parameters
        local Entity = event.Entity
        --------------------------------------------------------
        	self.Entity.SpriteGUIRendererComponent.ImageRUID = self.OriginalRUID
        	self.IsButtonDown = false
        end
    
        @EventSender("Self")
        handler HandleButtonStateChangeEvent(ButtonStateChangeEvent event)
        -- Parameters
        local state = event.state
        -------------------------------------------------------
        	if state == ButtonState.Released then
        		self:CancelHoldButton()
        	end
        end
    end
    

# SeeAlso

  * SpriteGUIRendererComponent
  * ButtonState
  * TimerService
  * [Basic UI Components](/docs?postId=744)