JavaFX rounded corners hitbox - java

In my program I have styled my buttons using css. I am using "-fx-background-radius" to round the corners and have noticed that when I hover over where the corners used to be it allows me to click the button. I was just wondering if there is a way to make it so that the 'hit-box' for the button matches what you see.
Thank you.

The pickOnBounds property
Defines how the picking computation is done for this node when triggered by a MouseEvent or a contains function call. If pickOnBounds is true, then picking is computed by intersecting with the bounds of this node, else picking is computed by intersecting with the geometric shape of this node.
The "bounds" are essentially the rectangular region containing the node (button in this case). The "geometric shape" accounts for how the node is actually rendered.
So you just need to call setPickOnBounds(false) on the button.

Related

JavaFX, why are the pixel values in anchor panes double? Also what happens if you put in 10.5 for example?

Recently I started working with javaFX anchor panes and I saw that the distance value is a double. Now my question is why did they chose a double instead of an int? I mean it's the number of pixels and you can't move the content by half a pixel as far as I know. A little example:
AnchorPane.setTopAnchor(something, 10.5);
In this example it would set the top anchor to 10.5 pixel. So again, why did they chose to make it a double and what exactly do I change when I put in 10.5 instead of 10.0?
Layout coordinates in JavaFX are all doubles. Depending on the properties of the the final position of the child may actually be rounded to an integral value (see the snapToPixel property). (AnchorPane does not seem to do this, but simply uses non-integral values for the positions/widths of children.)
Furthermore there may be transforms that align the node to pixels, e.g. scaling by a factor 2.
In general it's not possible to always align the "node pixels" to the display pixels perfectly in all cases. (Just consider a rotation of by 45°.)
If a part of a Node does not completely cover a pixel after all transformations have been applied, the result is the color of the node being drawn with an opacity that depends on the part of the pixel being covered by the node, e.g. the edge of a rectangle positioned at 10.5 results in the node's color being drawn on "pixel 10" with half opacity.
I don't know what is the real reason for that, but as said in the docs
AnchorPane allows the edges of child nodes to be anchored to an offset from the anchor pane's edges. If the anchor pane has a border and/or padding set, the offsets will be measured from the inside edge of those insets. docs
so it seems that it calculates the difference between the node child and the anchor panes's edges to determine where to place the node child and distance calcualte are always calculated float/double formats !
But in the code it seems seamless they both do the same thing

SWT DragSourceEvent image not anchored to mouse pointer correctly

I have the following issue when I drag and drop from a tree viewer in SWT. I am setting the image attribute of the dragSourceEvent e.g.
event.image = _dragImage
which works fine EXCEPT for instances where I have a long label on my tree viewer node. If I have a long string and start the drag event from the far right edge of the caption on the node, I notice that the drag image is not correctly anchored and is actually offset X pixels according to the distance from the start of the tree node string to the end of the tree node string.
Anyone any suggestions? Yee would probably have to demo to get an idea of it. Has anyone seen this?
If you set the fields event.offsetX and event.offsetY to 0, it will put the top-left of the image exactly on the mouse pointer.
If you set them to 100, it will put the top-left of the image 100 pixels to the left and above the mouse pointer.
SWT pre-populates these numbers in an attempt to get your image to line up with the offset of your original click. Not sure why it's not working in your case.

Rounded buttons

I want to have something like this five buttons, one button surrounded by four other buttons. Just like this:
I know that with Android that we can only have square type views so how would it be possible to do this? OpenGl or something? Anyone have any links to something related? Basically I want curved buttons that are close together.
My guess is that at the end of the day it will be easier to do this in a custom view.
But if you want to use stock views, I'd suggest the following. First, use a RelativeLayout container to arrange the four outside buttons in a 2x2 grid. Then position the center button so it overlaps the grid in the center. Put the center button at a higher Z (closer to the user) than the four surrounding buttons. Then use transparency as part of the button images to get them to look like you want. Then (hopefully) try it out. If the Z order is right, the center button will capture taps that would otherwise have gone to one of the other four buttons.
This actually won't work as is, because the center button square will intrude into the surrounding squares. I don't know if it would work, but you can then try replacing the center button with another grid of button "pieces". The grid would have empty positions except where the center button image overlaps the grid cell. You'll have to make this fine enough to avoid intruding into the outer button images.
EDIT:
It occurred to me that perhaps you could do this with a group of TouchDelegate objects. You would arrange the buttons as I described at first, but make only the parent container clickable. It would use five TouchDelegates to find out which button (if any) was under the tap coordinates. Unfortunately, TouchDelegate only work with Rect hit regions, which leaves us where we started. However, you could cannibalize the source of TouchDelegate and define your own version that accepts some sort of general shape class instead of just a Rect. (The shape class would have to have the equivalent of Rect.contains() to test for a hit. There's nothing built into Android, but you could easily write your own classes for the specific shapes you have.)
You could simplify the code a bit by putting the hit and delegation logic directly in the parent container view, but it would be cleaner, I think, to have a reusable delegate class that separates out the event handling from the container itself.
You can use a mask color for example:
a completely red button,like the image that you posted,the just do pixel color check against the red button,something like:
bool insideMyAwsomeShapeButton(int mouse_x,int mouse_y) {
if get_image_pixel_color_at_pos(mouse_x,mouse_y) == rgbcolor(1,0,0)
{
return true;
}
return false; }
again,this is just a thought,you have to find out specific api on android to do the task,like check pixel color.

How to find location of JTree node on screen

I want to search a particular node of JTree and determine its location on screen. My aim is to start hovering mouse from the top left corner of that node and perform a mouse click in my JFC.
Can anyone help me with this? Is it possible?
Knowing the coordinates x and y (from the mouse event), you can get the path via JTree.getPathForLocation. The bounds of the node are returned by JTree.getPathBounds(path).
Without knowing more information, it's hard to nail this down.
However, I'd suggest you take a look at
JTree.getPathBounds
JTree.getRowBounds
JTree.getRowForPath
SwingUtilities.convertPointToScreen
This should help you work out where on the screen a node is
You can use processMouseEvent. And the MouseEvent will get you the X and Y coordinates of your mouse.

Select and move multiple shapes in Java3D

Is there a simple way to select and move (rotate, pan, zoom) multiple shapes in Java3D simultaneously? I've seen the examples where you can pick (click) a single shape and drag it, but I haven't been able to find an easy way to select and move multiple shapes.
What I want to be able to do is:
Have many unselected shapes on the screen
Select one or more shapes (by individually clicking or dragging a box)
Move only the selected shapes with a mouse listener
When the shapes are unselected, they should stay where they are and stop moving
When new shapes are added, they should stay where they are and start moving
My initial idea was to have 2 Branch Groups "Selected" and "Unselected". The Selected BranchGroup would have a parent TransformGroup that is attached to the root, the Unselected BranchGroup would be attached directly to the root. As items were selected (which I can do with a PickCanvas) they would be removed from the Unselected BG and put in the Selected BG.
The main problem with this is that the shapes jump when they are selected or unselected. This is because they are taking on the transform of the group they are going to.
I feel like there is probably some easier way to do this, maybe leveraging something that is built into Java3D.
The best way I figured out how to do this was to use the 2 Branch Group method I suggested in the initial question.
You create 2 Branch Groups, one for selected nodes and one for unselected nodes. When you move nodes from one group to the other, you must translate the individual nodes so they remain at their current position rather than jumping to the translation of the new branch group they are joining.

Categories