B4J Question How to use a custom mouse cursor icon

ThRuST · Jul 15, 2019

I'd like to change mouse cursor into a custom icon design and not the standard ones, is it possible to load a custom icon?

Here's the icon that I use and it's great on 3 large monitors. However I want to set it through code and not manually.

Btw you can use a plugin for Photoshop to load .ICO files and save it as .PNG

The Icon plugin for Photoshop can be found here

Attaching the Large arrow in PNG format

jmon · Jul 15, 2019

Hi,

You can do it like that:

B4X:

Sub SetCustomCursor(Dir As String, Filename As String, Width As Int, Height As Int, TargetNode As Node)
    Dim img As Image
    img.InitializeSample(Dir, Filename, Width, Height)
    Dim cursor As JavaObject
    cursor.InitializeNewInstance("javafx.scene.ImageCursor", Array(img))  
    Dim joScene As JavaObject = TargetNode  
    joScene.RunMethod("setCursor", Array(cursor))
End Sub

This code allows you to set the custom cursor on any node.

EDIT: Better Solution HERE (POST #7)

ThRuST · Jul 15, 2019

Whoa!! that's impressive, hat off for that , oh lord master of code

ThRuST · Jul 15, 2019

I love your cursors man, they are SUPERB. I would love to implement them in my project Athena if you don't mind
I should make it possible to change cursor in settings pane. Can't wait to get that working.

jmon · Jul 15, 2019

Thanks!

ThRuST said:
I love your cursors man, they are SUPERB

I'm not sure you can use them for commercial use, please check the license, I just downloaded a few by doing a simple search like that

Mashiane · Jul 15, 2019

jmon said:
I just downloaded a few

Some cool stuff here hey... wow!

ThRuST · Jul 15, 2019

I'll look into those icons and see if I can buy a few. All for one and one for all B4X B4X B4X B4X, we're growing a cult here lol

ThRuST · Jul 15, 2019

I found this free Junior Icon editor and I cannot find a way how to set a hotspot. Please help me in this quest

Go here to boldly embark on the quest of the wholy icons lol

ThRuST · Jul 15, 2019

It looks like this

ThRuST · Jul 15, 2019

About settings the hotspot, it's in the end of the textfile for the Photoshop ICON Plugin

If saving .CUR, note that the cursor hotspot is defined by the ruler origin.

Full text

To install

64-bit Windows (Vista/Windows 7):
Restart before installing;

put plugin in C:\Program Files\Adobe\Photoshop \Plug-Ins\File Formats.
If you are running on a 64-bit Windows system and are launching the 64-bit version of Photoshop CS4 or CS5, download the 64-bit version of the plugin and put it in the Plug-Ins folder corresponding to 64-bit Photoshop (i.e., the one in "Program Files" not "Program Files (x86)").
Move the plugin into the "File Formats" folder inside your Photoshop Plugins folder:
For Windows (32-bit), ICOFormat.8bi
For Windows (64-bit), ICOFormat64.8bi
For Mac OS X, ICOFormat.plugin (note that separate versions are provided for CS2, CS3/4 and CS5)
For Mac OS X/Classic, icoformat
For 68K MacOS, icoformat(68K)
If using Corel PSP Photo X2, put the plugin in C:\Program Files\Corel\Corel Paint Shop Pro Photo X2\Languages\EN\PlugIns
Quit and relaunch Photoshop, if it's already running.
To use the plugin
Use Photoshop's Open command (File menu) to open .ICO and .CUR files (which will now appear in the file browser)
Use Photoshop's Save command to create .ICO and .CUR files.
If saving .CUR, note that the cursor hotspot is defined by the ruler origin.

And here's how to set the Ruler in Photoshop..

Youtube

ThRuST · Jul 16, 2019

Ok here's a great solution to the hotspot thingey.. I found this nice editor called RealWorld cursor editor (FREE) that can set the hotspot.

Go get RealWorld Cursor Editor 2013.1
http://www.rw-designer.com/cursor-maker

Then watch the tutorial how to set the hotspot here
https://www.youtube.com/watch?time_continue=9&v=_FxPlp5Ws9g

It can also handle animating icons, yay!

Enjoy

ThRuST · Jul 16, 2019

RealWorld Cursor editor has a bug that removes the toolbar completely, so please don't bother to use it.

I found this instead, an online cursor editor, seems much easier to use
https://www.cursor.cc/

jmon · Jul 16, 2019

Flaticon has a lot of icons for free, you just need to credit the author:
https://www.flaticon.com/search?word=cursor

ThRuST · Jul 16, 2019

Thanks I will look into that. I found out that IcoFX is the king of icon editors, however as from what I experienced it couldn't set the hotspot for the PNG file I tried.
Not sure about the difference in those formats like ICO, CON, ANI since B4J uses PNG so if anyone has advice on this please share it. The hot spot is just important as the design itself, people will find out when they need it, as from yesterdays scouting for tutorials it was annoying to not find any software that could do this properly.

ThRuST · Jul 16, 2019

There's also DeviantArt. Check it out here

ThRuST · Jul 16, 2019

@jmon The size parameters doesn't seem to work?

jmon · Jul 16, 2019

ThRuST said:
The size parameters doesn't seem to work?

Yeah you're right, I didn't notice.

ThRuST said:
The hot spot is just important as the design itself

There is an option for the hotspot too, but I don't really know how to use it, maybe it will make sense to you.
Try this (I changed the width/height to hotspotX/Y position):

B4X:

'Dir, 'Filename: Directory and filename of the cursor image.
'hotspotX, hotspotY: X and Y Position of the hotspot of the cursor (where the click happens).
'TargetNode: The node on which the cursor will be changed.
Sub SetCustomCursor(Dir As String, Filename As String, hotspotX  As Double, hotspotY  As Double, TargetNode As Node)
    Dim img As Image
    img.Initialize(Dir, Filename)
    Dim cursor As JavaObject
    cursor.InitializeNewInstance("javafx.scene.ImageCursor", Array(img, hotspotX, hotspotY))
    Dim joScene As JavaObject = TargetNode
    joScene.RunMethod("setCursor", Array(cursor))
End Sub

Edit: this is from JavaFX help:

ImageCursor
public ImageCursor(Image image,
double hotspotX,
double hotspotY)
Constructs an ImageCursor from the specified image and hotspot coordinates.
Parameters:
image - the image
hotspotX - the X coordinate of the cursor's hot spot
hotspotY - the Y coordinate of the cursor's hot spot

jmon · Jul 16, 2019

jmon said:
I don't really know how to use it, maybe it will make sense to you.

Ok, I get it now. For Example my PNG image is 500x500px. If you set :

B4X:

SetCustomCursor(File.DirAssets, "cursor.png", 250, 250, MainForm.RootPane)

Then the cursor hotspot (click position) will be centered in the image (500px / 2 = 250). So

B4X:

SetCustomCursor(File.DirAssets, "cursor.png", 500, 500, MainForm.RootPane)

will set it at the bottom right of the image. The default should be 0,0 then.

ThRuST · Jul 16, 2019

@jmon Great. I have created my own arrow cursor for my project and it looks cool. The size is 200x300 but it looked twice as wide in my app and size parameters had no effect i.e 100, 100 so I'll lab with those values. Not sure what values that was used but it looked better. Personally I like those larger fancy styled icons even though taste is different so I should add in all kinds of styles to choose from. Not to seem picky, but a new source code example would be great to illustrate the hot spot in a cursor test app prefferably showing where the drawing takes place from the x, y position. The B4J community needs our very own cursor editor with the hot spot, yay!!

ThRuST · Jul 16, 2019

@jmon I have done some tests and your new code make wonders, the hot spot works as expected!! No need to call in the heavy artillery with us around lol

B4J Question How to use a custom mouse cursor icon

Well-Known Member

Attachments

Well-Known Member

Attachments

Well-Known Member

Well-Known Member

Well-Known Member

Expert

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Well-Known Member

Similar Threads

Privacy & Transparency

Privacy & Transparency