Programming
Usage Examples
Customizing Mouse Cursor and Behavior

Customizing Mouse Cursor and Behavior

WarningUnigineScript is deprecated and will be removed in future releases. Please consider using C#/C++ instead, as these APIs are the preferred ones. Availability of new Engine features in UnigineScipt is not guaranteed, as the current level of support assumes only fixing critical issues.

Defining Mouse Behavior#

The mouse behavior is defined by assigning any of the following modes:

Grab - the mouse is grabbed when clicked (the cursor disappears and camera movement is controlled by the mouse). This mode is set by default.
Soft - the mouse cursor disappears after being idle for a short time period.
User - the mouse is not handled by the system (allows input handling by some custom module).

There are two ways to set the required mouse behavior mode:

In the Editor, by selecting the corresponding option in the Controls Settings.
Via code by adding the corresponding line to the logic (world or system logic, components, expressions, etc.).

Source code (UnigineScript)

engine.controls.setMouseHandle(MOUSE_HANDLE_SOFT);
//or
engine.controls.setMouseHandle(MOUSE_HANDLE_USER);

Customizing Mouse Cursor#

You can change the look of the mouse cursor in your application using any square RGBA8 image you want. This can be done by simply adding the following lines to your code (e.g. world's init() method):

Source code (UnigineScript)

// loading an image for the mouse cursor
Image mouse_cursor = new Image("textures/cursor.png");

// resizing the image to make it square
mouse_cursor.resize(mouse_cursor.getWidth(), mouse_cursor.getWidth());

// checking if our image is loaded successfully and has the appropriate format
if (mouse_cursor.isLoaded() && mouse_cursor.getFormat() == IMAGE_FORMAT_RGBA8)
{
	// setting the image for the OS mouse pointer
	engine.app.setMouseCursor(mouse_cursor);
		
	// showing the OS mouse pointer
	engine.app.setMouseShow(1);
}

Here is a sample RGBA8 image (32x32) you can use for your mouse cursor (download it and put it to the data/textures folder of your project):

Sample cursor image

Example Code#

Below you'll find the code that performs the following:

Sets a custom icon and title for the application window
Sets a custom mouse cursor
Switches between the following two mouse control modes by the ENTER key:
- Camera control - the cursor is invisible and controls the camera (movement area restricted to the application window)
- UI control - the cursor is visible and can be used to interact with application UI (movement area unrestricted)
Switches between restricted (only application window area) and unrestricted mouse movement mode by the SHIFT key

Insert the following code into your world script file.

NoticeUnchanged methods of the AppWorldLogic class are not listed here, so leave them as they are.

Source code (UnigineScript)

// my_world.usc

// auxiliary variables
Controls controls;
Gui gui;

// widgets
WidgetLabel label;
WidgetButton button;

/// function toggling the mouse cursor's state
void ToggleMouseCursor()
{
	// getting current mouse state
	int enabled = engine.controls.isMouseEnabled();

	// toggling movement restriction to the application window area
	engine.app.setMouseGrab(1 - enabled);
	
	// toggling mouse interaction with GUI elements
	gui.setMouseEnabled(enabled); 

	// toggling mouse control
	engine.controls.setMouseEnabled(1 - enabled);
}

int init() {
	/*...*/
	
	// enabling user mouse handling
	engine.controls.setMouseHandle(MOUSE_HANDLE_USER);
	
	// initializing auxiliary variables
	controls = engine.game.getPlayer().getControls();
	gui = engine.getGui();

	// setting a custom icon for the application window
	Image icon = new Image("textures/cursor.png");
	if (icon.isLoaded() && icon.getFormat() == IMAGE_FORMAT_RGBA8)
		engine.app.setIcon(icon);

	// setting a custom title for the application window
	engine.app.setTitle("Custom Window Title");

	// preparing UI: creating a label and a button and adding them to the GUI
	label = new WidgetLabel(gui);
	button = new WidgetButton(gui, "BUTTON");
	button.setPosition(10, 40);
	gui.addChild(label, GUI_ALIGN_OVERLAP | GUI_ALIGN_TOP | GUI_ALIGN_LEFT);
	gui.addChild(button, GUI_ALIGN_OVERLAP | GUI_ALIGN_TOP | GUI_ALIGN_LEFT);

	// loading an image for the mouse cursor
	Image mouse_cursor = new Image("textures/cursor.png");

	// resize the image to make it square
	mouse_cursor.resize(mouse_cursor.getWidth(), mouse_cursor.getWidth());
	if (mouse_cursor.isLoaded() && mouse_cursor.getFormat() == IMAGE_FORMAT_RGBA8)
	{
		// setting the image for the OS mouse pointer
		engine.app.setMouseCursor(mouse_cursor);
		
		// show the OS mouse pointer
		engine.app.setMouseShow(1);
	}

	return 1;
}

/*...*/

int update() {
	/*...*/
	
	// checking for CONTROLS_STATE_USE (ENTER key by default) and toggling mouse cursor state "hidden restricted camera control" <-> "visible unrestricted UI control"
	if (controls.clearState(CONTROLS_STATE_USE) == 1)
		ToggleMouseCursor();

	// checking for CONTROLS_STATE_RUN (SHIFT key by default) and toggling mouse cursor movement restriction to application window bounds
	if (controls.clearState(CONTROLS_STATE_RUN) == 1)
		engine.app.setMouseGrab(!engine.app.getMouseGrab());

	// updating cursor position info
	label.setText(format("\n MOUSE COORDS: %d, %d)", engine.app.getMouseX(), engine.app.getMouseY()));

	// showing or hiding mouse cursor depending on its current state
	engine.app.setMouseShow(!engine.controls.isMouseEnabled());
	
	return 1;
}

/*...*/

int shutdown() {
	/*...*/
	
	//removing all widgets grom GUI
	for (int i = 0; i < gui.getNumChildren(); i++)
		gui.removeChild(gui.getChild(i));
		
	return 1;
}

Last update: 2020-04-10

Help improve this article

Was this article helpful?

Report a problem related to this article

(or select a word/phrase and press Ctrl+Enter)

Customizing Mouse Cursor and Behavior

In This Article:

Defining Mouse Behavior#

Customizing Mouse Cursor#

Example Code#