Main Site

Checkbox

Object Preview
Remember Me
Windowed Mode
Developer Edition OBJECT

The Checkbox object is a standard interface element that allows users to make binary choices (true/false, on/off). This object is essential for giving players control over their experience directly from your Custom Game Launcher.

Checkboxes are typically used in settings panels, login screens, or setup pages to gather user preferences before a game is launched.

Pro Tip

Because the Checkbox is a Developer Edition feature, it inherently supports advanced data binding and dynamic state tracking via variables.

Checkbox Overview

The Checkbox object consists of an interactive square box paired with a text label. Users can click either the box or the label to toggle its state. You have full control over the typography, color, and default state of the object to match your launcher's theme perfectly.

Typical Uses

  • Toggling Windowed Mode vs Fullscreen
  • Opting into "Remember Me" on login pages
  • Accepting End User License Agreements (EULA)
  • Enabling or disabling background launcher music
  • Activating optional game mods or plugins

Default Settings

When dragged onto the canvas, the Checkbox comes pre-configured with standard properties to get you started.

Property Default Value
Label Text My Checkbox
Checked by Default False (Unchecked)
Text Color #E0E0E0 (Light Grey)
Font Family Poppins

Properties

You can fine-tune the Checkbox via the properties panel.

Content & Behaviour

  • Label Text: The text shown to the right of the checkbox.
  • Checked by Default: Determines if the box starts in the checked state when the launcher opens.

Typography & Colours

  • Font Family & Size: Customize the font used for the label text.
  • Font Weight: Adjust the thickness of the text, ranging from 100 to 900.
  • Styling: Options to render the label text in Italic or with an Underline.
  • Text Color: Modify the color of the label text to contrast with your background.

Checkbox Events

The Checkbox object is highly interactive and provides three main events to trigger your logic.

On Checked

Fires explicitly when the user clicks to set the checkbox to the checked state. Use this to immediately enable features, show hidden objects, or play a positive UI sound.

On Unchecked

Fires when the checkbox is set to the unchecked state. Use this to disable features or hide elements that are no longer relevant.

On Toggle

Fires on any change between the checked and unchecked states. This is useful when you want a single event sequence to dynamically evaluate the new state.

Checkbox Actions

While the Checkbox acts primarily as a trigger, it interacts perfectly with the launcher's built-in data systems.

Push to Variable

You can extract the state of the Checkbox by using the Push to Variable action. This reads the checked property and stores it in a global variable for later use, such as writing it to a local INI file.

Set Object Property from Variable

Conversely, you can use the Set Object Property from Variable action to dynamically check or uncheck the box based on saved user preferences loaded at startup.

Building Logic with the Checkbox

Checkboxes are perfect for creating interactive settings menus and login screens within your Custom Launcher.

Example 1: Saving a Basic INI Preference

If you want to remember if a user prefers "Windowed Mode" for their game:

  1. On the Checkbox's On Toggle event, add a Push to Variable action to store its checked property in a variable named varWindowed.
  2. Next, add a Set INI Value from Variable action to save varWindowed permanently to a local configuration file, such as settings.ini.
  3. When the user clicks your "Play Game" button, you can use a Compare a Variable action on varWindowed to decide whether to launch the game with the -windowed command line argument.

Example 2: A Persistent "Remember Me" Toggle

For a login screen, you'll want the Checkbox to visually update itself based on what the user chose the last time they opened the launcher.

Saving the State:

  1. On the Checkbox's On Toggle event, use the Push to Variable action to grab the checked property and store it in varRememberMe.
  2. Add a Set File Value from Variable action to save the value of varRememberMe to a simple text file, like login_data.txt.

Loading the State on Startup:

  1. Open your Global Events or the Page's startup events.
  2. Use the Set Variable from File action to read login_data.txt back into the varRememberMe variable.
  3. Finally, use the Set Object Property from Variable action. Target your Checkbox object, select the checked property, and supply it with varRememberMe. The Checkbox will now automatically tick itself if the user had it enabled during their last session!

Custom CSS Example

For users of Developer Edition, you can heavily modify the visual appearance of the Checkbox using Custom CSS. By overriding the default HTML input styling, you can create custom active states and custom checkmarks.

Pro Tip

You do not need to scope the CSS; the engine automatically applies it to your specific object. Use !important to ensure your styles override the native browser defaults.

Custom CSS Preview

css

/* Hide the default browser checkbox */
.glcv4-checkbox-wrapper input[type="checkbox"] {
appearance: none !important;
width: 22px !important;
height: 22px !important;
background: #1a1c23 !important;
border: 2px solid #3b82f6 !important;
border-radius: 6px !important;
cursor: pointer !important;
position: relative !important;
transition: all 0.2s ease !important;
}
/* Style the background when checked */
.glcv4-checkbox-wrapper input[type="checkbox"]:checked {
background: #3b82f6 !important;
}
/* Create a custom checkmark using a pseudo-element */
.glcv4-checkbox-wrapper input[type="checkbox"]:checked::after {
content: '' !important;
position: absolute !important;
left: 6px !important;
top: 2px !important;
width: 5px !important;
height: 10px !important;
border: solid white !important;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg) !important;
}
/* Add a hover effect to the label text */
.glcv4-checkbox-wrapper label:hover {
color: #ffffff !important;
}

Summary

The Checkbox object is a crucial interface element for building robust settings menus and capturing user intent. Paired with global variables and events, it adds powerful interactivity to your Custom Game Launcher.