Cursor.registerCustomIcon: Difference between revisions
(Created page with "{{ClientsideJsFunction}} {{JSContainer| Register a custom cursor. === Required Params === *'''type:''' {{RageType|Number}} *'''packageFilePath:''' {{RageType|String}} *'''offsetX:''' {{RageType|Float}} *'''offsetY:''' {{RageType|Float}} === Return Value === *'''void''' {{RageType|void}} ==Syntax== //This types are taken from here: https://rage.mp/files/file/495-windows-style-cursor-pack/ <pre> const MAP_CURSOR_NAME_TO_TYPE = { CT_POINTER: 0, CT_CROSS: 1, C...") |
No edit summary |
||
| Line 2: | Line 2: | ||
{{JSContainer| | {{JSContainer| | ||
Register a custom cursor. | Register a custom cursor. | ||
'''NOTE:''' If you'd like to reset the cursor simply set the path to an empty string. | |||
=== Required Params === | === Required Params === | ||
*'''type:''' {{RageType|Number}} | *'''type:''' {{RageType|Number}} | ||
| Line 12: | Line 14: | ||
*'''void''' {{RageType|void}} | *'''void''' {{RageType|void}} | ||
== | ==Cursor Types== | ||
//This types are taken from here: https://rage.mp/files/file/495-windows-style-cursor-pack/ | //This types are taken from here: https://rage.mp/files/file/495-windows-style-cursor-pack/ | ||
<pre> | <pre> | ||
| Line 63: | Line 65: | ||
</pre> | </pre> | ||
==Syntax== | |||
<pre> | <pre> | ||
mp.gui.cursor.registerCustomIcon(type, packageFilePath, offsetX, offsetY); | mp.gui.cursor.registerCustomIcon(type, packageFilePath, offsetX, offsetY); | ||
Latest revision as of 10:33, 11 May 2024
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]);
}
});