controlsfx / controlsfx/controlsfx

Is it possible to get the x/y position of range slider thumbs without using CSS lookup to find the nodes?

Open
#1,578 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Java
Stars
1.7k
Forks
300
Avg merge
16d 17h
Merged PRs (30d)
1

Description

I have two floating popups/tooltips that follow the position of the low and high thumbs when dragged. This currently works perfectly using the x/y location of the thumbs and offsetting from there. But I want to move away from the lookup method and there doesn't appear to be a way to find the thumb positions without it.

`Node highThumb = slider.lookup(".high-thumb");`
`Node lowThumb = slider.lookup(".low-thumb");`

`Bounds hBounds = highThumb.getBoundsInLocal();`
`Bounds lBounds = lowThumb.getBoundsInLocal();`
`Bounds tBounds = slider.getBoundsInLocal();`

`double xHigh = highThumb.localToScreen(hBounds.getMinX(), hBounds.getMinY()).getX() + 10;`
`double xLow = lowThumb.localToScreen(lBounds.getMaxX(), lBounds.getMaxY()).getX() - 10;`
`double y = slider.localToScreen(tBounds.getMaxX(), tBounds.getMaxY()).getY() + 15;`

![Image](https://github.com/user-attachments/assets/00d5648c-8026-47ab-9bf7-5ce644b78143)

The solution I'm working on is to take the slider low/high value vs max value as a percentage of its length, and then offset from the slider's minX/maxX accordingly

`double minX = slider.localToScreen(slider.getBoundsInLocal()).getMinX();`
`double maxX = slider.localToScreen(slider.getBoundsInLocal()).getMaxX();`
`double length = maxX - minX;`

`double sLow = slider.getLowValue();`
`double sHigh = slider.getHighValue();`
`double sMax = slider.getMax();`

`double xL2 = minX + ((sLow / sMax) * length) + 10;`
`//double xH2 = minX + ((sHigh / sMax) * length) + 10;`
`double xH2 = maxX - (((sMax - sHigh ) / sMax) * length) - 10;`

This produces a very similar result, but is only accurate right at the edges of the slider. There is some drifting that occurs when the thumbs are closer to the middle, that I have so far been unable to solve.

![Image](https://github.com/user-attachments/assets/ae3c8e41-6343-48ff-ac01-5b7bb4235245)

![Image](https://github.com/user-attachments/assets/23782dcd-88d0-4751-b293-5389fa4c8c7a)

![Image](https://github.com/user-attachments/assets/5f47268d-c19a-4d8a-a710-c3aad514d584)

the drift is different depending on which side I use as the reference:

![Image](https://github.com/user-attachments/assets/96c6eac9-ad45-4906-84d4-6b68b85ced08)

Is there a better way to do this? Or is there some other way to access the x/y positions of the thumbs without using CSS lookup?

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.