Button Object

The Button object is one of the most important interactive elements available in Game Launcher Creator. It provides a clear visual control that users can click to perform an action inside your launcher interface.

Buttons can be used for many different purposes including launching games, navigating between pages, opening settings, displaying panels, or triggering custom behaviour.

Button Overview

A Button object represents an interactive control that users can click to trigger an action. It can display text, optional icons, and customised styling so it fits naturally into your launcher design.

Because buttons are extremely flexible, they are commonly used as the primary way users interact with a launcher interface.

Typical Uses

• Launch Game buttons
• Open Settings controls
• Account login actions
• Navigation between launcher pages
• Opening popups or panels
• Links to community, store, or support pages

Default Button Settings

When a Button object is created, it starts with a set of sensible defaults so it is immediately visible and ready to use.

Button Properties

The Button object includes a range of properties that allow you to control both its visual appearance and how it behaves inside your launcher.

Text

This property defines the label displayed on the button. The text should clearly describe the action that will occur when the button is clicked.

Examples include Play, Install, Update, or Open Settings.

Icon Settings

Buttons can optionally display an icon alongside the text.

• Icon String selects the icon shown on the button.
• Icon Position controls where the icon appears relative to the label.
• Icon Size adjusts the visual size of the icon.
• Spacing defines the distance between the icon and the text.

Icons are commonly used to reinforce actions visually, such as using a play icon for launch buttons or a cog icon for settings.

Colors

The colour settings allow the button to visually respond when users interact with it.

• Background Color defines the normal button background.
• Hover Background changes the background when the button is hovered.
• Text Color controls the label colour.
• Hover Text Color changes the label colour when hovered.

Typography

The typography settings control how the text on the button is displayed.

• Font Family selects the typeface.
• Font Size controls text size.
• Font Weight determines how bold the label appears.
• Italic enables italic styling.
• Underline adds an underline to the label.

Border

Border properties control the outline and shape of the button.

• Corner Radius controls how rounded the corners are.
• Border Width defines the thickness of the border.
• Border Color sets the border colour.

Setting the border width to 0 removes the border completely.

Custom CSS

For users of Developer Edition, the Button object also supports Custom CSS. This allows you to push the appearance further with more advanced styling for premium launcher designs.

Button Events

The Button object supports events that allow it to respond to user interaction.

On Click

This event triggers when the user clicks the button. It is typically used to launch games, open pages, display panels, or trigger other actions.

On Hover

This event activates when the cursor moves over the button. It can be used to provide additional interface feedback and visual polish.

Button Actions

Change Button Text

This action allows you to dynamically update the visible label of a button.

For example, the same button might display Install, Update, or Play depending on the current state of your launcher.

Custom CSS Example

The example below shows how Custom CSS can be used to create a more premium call-to-action style for a button. This is especially useful for featured actions such as launching a game, opening a store page, or highlighting a major update.

border-radius: 12px;
font-weight: 700;
letter-spacing: 0.02em;
background: linear-gradient(135deg, #3b82f6, #2563eb);
box-shadow: 0 12px 30px rgba(37, 99, 235, 0.35);
transition: all 0.2s ease;
:hover {
 transform: translateY(-1px);
 box-shadow: 0 16px 36px rgba(37, 99, 235, 0.45);
}

This style gives the button a stronger call-to-action look with a softer shape, more depth, and a more premium hover effect.

Example Use Cases

Primary Launch Button

A large and visually prominent button used to start the game. These usually benefit from strong colours, bold labels, and clear placement within the launcher.

Navigation Buttons

Buttons can be used to move between sections such as News, Community, Store, or Settings.

Dynamic Status Button

Buttons can also change their label depending on the current situation, making it possible to present context-aware actions such as Install, Update, or Play.

Best Practices

Keep Labels Clear

Use short, direct wording so users instantly understand what the button does.

Use Consistent Styling

Keeping colours, sizing, and typography consistent across your launcher helps create a cleaner and more professional interface.

Use Hover Feedback Thoughtfully

Small visual changes on hover can make buttons feel more responsive without becoming distracting.

Reserve Strong Styling for Important Actions

Highly styled buttons work best when used for key actions. If every button screams for attention, the whole interface starts acting like it’s trying to sell energy drinks at a monster truck rally.

Summary

The Button object is one of the core building blocks of an interactive launcher interface. With support for text, icons, styling, events, actions, and Developer Edition Custom CSS, it can be used for everything from simple navigation to bold primary actions.