Cursor.registerCustomIcon
Client-Side Function
JavaScript |
---|
JavaScript Syntax
Register a custom cursor.
NOTE: If you'd like to reset the cursor simply set the path to an empty string.
Required Params
- type: Number
- packageFilePath: String
- offsetX: Float
- offsetY: Float
Return Value
- void void
Cursor Types
//This types are taken from here: https://rage.mp/files/file/495-windows-style-cursor-pack/
const MAP_CURSOR_NAME_TO_TYPE = { CT_POINTER: 0, CT_CROSS: 1, CT_HAND: 2, CT_IBEAM: 3, CT_WAIT: 4, CT_HELP: 5, CT_EASTRESIZE: 6, CT_NORTHRESIZE: 7, CT_NORTHEASTRESIZE: 8, CT_NORTHWESTRESIZE: 9, CT_SOUTHRESIZE: 10, CT_SOUTHEASTRESIZE: 11, CT_SOUTHWESTRESIZE: 12, CT_WESTRESIZE: 13, CT_NORTHSOUTHRESIZE: 14, CT_EASTWESTRESIZE: 15, CT_NORTHEASTSOUTHWESTRESIZE: 16, CT_NORTHWESTSOUTHEASTRESIZE: 17, CT_COLUMNRESIZE: 18, CT_ROWRESIZE: 19, CT_MIDDLEPANNING: 20, CT_EASTPANNING: 21, CT_NORTHPANNING: 22, CT_NORTHEASTPANNING: 23, CT_NORTHWESTPANNING: 24, CT_SOUTHPANNING: 25, CT_SOUTHEASTPANNING: 26, CT_SOUTHWESTPANNING: 27, CT_WESTPANNING: 28, CT_MOVE: 29, CT_VERTICALTEXT: 30, CT_CELL: 31, CT_CONTEXTMENU: 32, CT_ALIAS: 33, CT_PROGRESS: 34, CT_NODROP: 35, CT_COPY: 36, CT_NONE: 37, CT_NOTALLOWED: 38, CT_ZOOMIN: 39, CT_ZOOMOUT: 40, CT_GRAB: 41, CT_GRABBING: 42, CT_CUSTOM: 43, };
Syntax
mp.gui.cursor.registerCustomIcon(type, packageFilePath, offsetX, offsetY);
Example
This example is taken from here: https://rage.mp/files/file/495-windows-style-cursor-pack/
Client-Side
const CURSORS = [
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_POINTER,
path: 'cursors/pointer.png',
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_HELP,
path: 'cursors/help.png',
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_NONE,
path: 'cursors/pointer.png',
offset: [10000, 10000],
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_HAND,
path: 'cursors/hand.png',
offset: [-10, 0],
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_IBEAM,
path: 'cursors/beam.png',
offset: [-24, -24],
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_MOVE,
path: 'cursors/move.png',
offset: [-18, -18],
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_EASTWESTRESIZE,
path: 'cursors/east-west-resize.png',
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_NORTHSOUTHRESIZE,
path: 'cursors/nort-south-resize.png',
},
{
type: MAP_CURSOR_NAME_TO_TYPE.CT_NOTALLOWED,
path: 'cursors/notallowed.png',
offset: [-12, -12],
}
];
mp.events.add('playerReady', () => {
mp.browsers.new('package://ui/cursor-tester.html');
setTimeout(() => mp.gui.cursor.visible = true, 500);
for (const cursor of CURSORS) {
const offset = cursor.offset || [0, 0];
mp.gui.cursor.registerCustomIcon(cursor.type, cursor.path, offset[0], offset[1]);
}
});