GSmGpE6CwX2y9JjB25B8
We use cookies on this site to enhance your user experience

Click-to-Move

Click-to-Move

Aug 29 2019, 9:15 AM PST 10 min

Click-to-move (or tap-to-move on touch devices) is a control scheme players can enable within the Roblox Settings menu. It allows players to issue a movement command which causes their character to walk a path to the selected destination. While moving, white dots show the remaining path to be walked. The character will automatically jump or walk off ledges in order to reach the destination. If the destination is unreachable the character will shrug.

A Roblox character walking towards a clicked position. His path is displayed by white dots on the ground.

By default, Click-to-move uses PathfindingService to calculate a walkable path from the player’s current position to the selected destination. Internally, this calculation uses a navigation mesh which can be shown through Roblox Studio’s Settings (under Studio > Show Navigation Mesh).

A Roblox character walking towards a clicked position within a small maze. The displayed path bends around the walls.

Customization API

This control scheme is implemented within the PlayerModule which exposes API to customize and control the click-to-move visuals and behavior. Using a LocalScript, you can configure the behavior of the ClickToMoveController with the functions listed below:

Configuration Getter/Setter Functions Description
Show PathSetShowPath(boolean)
GetShowPath()
Whether the path the character is taking is displayed
Default: true
Waypoint TextureSetWaypointTexture(content)
GetWaypointTexture()
The texture rendered along the current path
Default: "rbxasset://textures/ui/traildot.png"
Waypoint RadiusSetWaypointRadius(number)
GetWaypointTexture()
The size of the texture rendered along the current path
Default: 1.5
End Waypoint TextureSetEndWaypointTexture(content)
GetEndWaypointTexture()
The texture rendered at the destination
Default: "rbxasset://textures/ui/waypoint.png"
Waypoints Always On TopSetWaypointsAlwaysOnTop(booolean)
GetWaypointsAlwaysOnTop()
Whether textures rendered along the current path render on top of 3D geometry
Default: false
Failure Animation EnabledSetFailureAnimationEnabled(boolean)
GetFailureAnimationEnabled()
Whether an animation (shrug) is played on the character if an unreachable destination is selected
Default: true
Ignored Parts TagSetIgnoredPartsTag(string)
GetIgnoredPartsTag()
A CollectionService tag for parts to be ignored when pathfinding
Default: nil
Use Direct PathSetUseDirectPath(boolean)
GetUseDirectPath()
Whether pathfinding should be disabled and a straight line should be walked
Default: false
User Jump EnabledSetUserJumpEnabled(boolean)
GetUserJumpEnabled()
Whether the player is able to manually jump while walking the path
Default: true

Template Configuration Script

The following script features all of the configuration setters. It can be pasted into a LocalScript within StarterPlayerScripts and then customized to your games’ needs.

local PlayerModule = require(script.Parent:WaitForChild("PlayerModule"))
local ClickToMoveController = PlayerModule:GetClickToMoveController()
ClickToMoveController:SetShowPath(true)
ClickToMoveController:SetWaypointTexture("rbxassetid://90482820") -- white circle
ClickToMoveController:SetWaypointRadius(.75)
ClickToMoveController:SetEndWaypointTexture("rbxassetid://1826692749") -- green down arrow
ClickToMoveController:SetWaypointsAlwaysOnTop(true)
ClickToMoveController:SetFailureAnimationEnabled(true)
ClickToMoveController:SetIgnoredPartsTag("ClickToMoveIgnore")
ClickToMoveController:SetUseDirectPath(false)
ClickToMoveController:SetUserJumpEnabled(true)

Control API

At the moment, the ClickToMoveController features one function for manually issuing click-to-move commands.

ClickToMoveController:MoveTo(position, showPath = true, useDirectPath = false)

Parameters:

  • datatype/Vector3 position - The destination to which the character should walk
  • boolean showPath - Whether the calculated path waypoints should be displayed
  • boolean useDirectPath - Whether PathfindingService will be skipped and a straight line should be walked instead

Usage:

ClickToMoveController:MoveTo(Vector3.new(0, 0, 0), true, false)