How to toggle "over" style on a button in LibGDX? - java

I want to create a menu using TextButton. The menu should be accessible by mouse and keyboard. For the correct hovering behaviour, I set the style as usual:
TextButton.TextButtonStyle textButtonStyle = new TextButton.TextButtonStyle();
textButtonStyle.up = skin.newDrawable("background", Color.GRAY);
textButtonStyle.down = skin.newDrawable("background", Color.DARK_GRAY);
textButtonStyle.checked = skin.newDrawable("background", Color.DARK_GRAY);
textButtonStyle.over = skin.newDrawable("background", Color.LIGHT_GRAY);
textButtonStyle.font = skin.getFont("default");
This works fine with mouse (the over style is toggled when the mouse is hovering). However, I want to be able to select a menu item by keyboard. The "currently selected" menu item should be selectable using the arrow keys and enter should confirm the item.
The keyboard interaction is not an issue here, but setting the "highlighted" mode on the button. I imagine selecting a button using the keyboard should behave the same as hovering over it with a mouse. But it looks like there is no way of "toggling" the state of the button using the API. There is an isOver() method, but no setOver() method.
Any ideas? Do I really have to create two styles and switch them out with setStyle()? I would consider that ugly..

Create a custom class for your actor and override your isOver method to return isFocused || super.isOver()
By the way, you might take a look at https://github.com/MrStahlfelge/gdx-controllerutils/wiki/Button-operable-Scene2d for not reinventing the wheel.

If you wish to programmatically make the button think that it has been hovered upon, send an InputEvent with type enter which signifies that the mouse has entered onto the button:
InputEvent event = new InputEvent();
event.setType(InputEvent.Type.enter);
event.setPointer(-1);
button.fire(event);
Use the exit InputEvent for defocusing it:
InputEvent event = new InputEvent();
event.setType(InputEvent.Type.exit);
event.setPointer(-1);
button.fire(event);

So basically, the easiest what you can do is just to retrieve the desired button style right from your skin and apply this to the button like this:
Skin skin = getYourSkin(); // or even button.getSkin() I believe should also work
button.setStyle(skin.get(styleName, ButtonStyle.class));
This way you don't need to create a style but you can just get it from your skin definition

Related

Disable Material Checkbox ripple effect temporarily

I have an SpannableString text with links on com.google.android.material.checkbox.MaterialCheckBox view.
I need to disable actual checkbox toggling while user clicks on link in CheckBox text.
I achieved that by caling view.cancelPendingInputEvents() in ClickableSpan's onClick.
However, the ripple effect on the checkbox is still present. I was able to disable it by calling this, also in ClickableSpan's onClick:
var drawable = textView.background
if (drawable is RippleDrawable) {
drawable = drawable.findDrawableByLayerId(0)
textView.background = drawable
}
The problem is, how I should revert this? How to revert default MaterialCheckBox ripple effect after click is done?

Vaadin: Using an image as a button

I wanted to use a image as a button. I got it working, but it is not very well made, please take a look at the screenshot. As you can see the Button itself is a lot bigger than the image, but I wanted it to be as big as the image:
The actual Button is bigger than the Image. The goal here is that there is nothing but the image to click. How can I achieve this? Here is the code ofthe button on the screenshot:
Button testButton = new Button();
String basepath = VaadinService.getCurrent().getBaseDirectory().getAbsolutePath();
testButton.setIcon(new FileResource(new File(basepath + "/VAADIN/themes/mytheme/img/Button.png")));
loginForm.addComponent(testButton);
I know that
testButton.setStyleName(BaseTheme.BUTTON_LINK)
makes the button invisible, but unfortunately that does not adjust the size of the button, just the visbility..
You can simply add a click listner to an image instead of using a button.
Image image = new Image(null, new ClassResource("/images/button-img.jpg");
image.addClickListener(e -> System.out.println("click"));
image.addStyleName("my-img-button");
And add this css, I use the #Stylesheet annotation to add in CSS.
.my-img-button {
cursor: pointer;
}
It works for me:
Button button = new Button();
button.setStyleName(ValoTheme.BUTTON_LINK);
button.setIcon(new ClassResource("/images/button-img.jpg"));
button.addClickListener(e -> System.out.println("click"));
Maybe you have additional css defined?
Maybe your button is contained in a layout with a fixed height?
Also make sure that your button has no width/height configured, so it can automatically adjust its size to that of the icon image.
The next problem you'll probably run into is the focus border:
Another approach would be to use a layout click listener, and add you own mouse-over/hover/focus styling via CSS.
VerticalLayout layout = new VerticalLayout(new Image(null, new ClassResource("/images/test.png")));
layout.addLayoutClickListener(e -> System.out.println("click"));
With Vaadin 14:
Image img = new Image("src");
Button testButton = new Button(img);
Quite straightforward.

how to implement multi imageView select holding control button in javaFX

In my JAVAFX application, i am having imageviews in a tilepane , i want to implement the multi select like functionality like in android for images . I tried adding border style to the imageView on click event but that didnt work. Is there any way to achieve this.
You can embed the Image in a JavaFX Button, and set the OnAction methods of the Button:
imageButton.setOnAction(new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent e) {
System.out.println("Changing the color of the button's border :");
imageButton.setStyle("-fx-border-color:blue;");
System.out.println("For further reference, you can save the button or the image in a TreeSet:");
treeSet.add(imageButton);
}
});
If a simple click is enough to select the image, you can define the OnAction method of the Button like above. However if you need a long click (push and hold in Android style) to change the selection status of the image, you can find more information on 'push and hold' click here : how to achieve javafx mouse event "push and hold"? .

JavaFx Button adds ellipsis when rendered on a E4 ToolControl

I've an E4 application which has a ToolControl, the class that handles the tool control creates a JavaFX button, for some reason the button adds ellipsis and I've no clue why.
Here is the link to the sample application
https://github.com/SDSethia/ColoredButton.git
JavaFX shortens the label automatically, when the size of the control (a button in your case) is too small for the text. This is independent of E4. So if you increase the size of the button, the complete text will show.
I looked at your project and I am wondering why you are using the SWT renderers, although you want to use JavaFX!
If you want to use E4 + JavaFX I recommend to use the e(fx)clipse renderers. This tutorial should get you started: https://wiki.eclipse.org/Efxclipse/Tutorials/Tutorial4
The button needs a layout (I wrapped mine in an HBox) for it to render correctly. Here is the modified code
final FXCanvas canvas = new FXCanvas(parent, SWT.NONE);
button = new Button();
button.setText("FxButton (1)");
button.setStyle("-fx-background-color: #186dee; -fx-text-fill: white;");
final HBox box = new HBox();
box.getChildren().add(button);
final Scene scene = new Scene(box);
canvas.setScene(scene);
This solved the issue.

Mouse Click event

I am using RCP with eclipse 3.6 and java 6.
The user needs to click with right mouse buttom then opened a menu where he makes a choice.
Which mouse event is that?
How to fill the menu with choices?.
Regards,
Haythem
Have a look at this article about RCP and eclipse 3.6. The section that I've linked to describes how to create a context menu (for a table), that will pop up when right clicking.
What I need is how to create mouseeventlistener from a menu and menuitem
Sectionstop in my code is the composite where the mouselistener will be added
Menu menu = new Menu (parent.getShell(), SWT.POP_UP);
MenuItem item = new MenuItem (menu, SWT.PUSH);
item.setText("Text 1");
MenuItem item2 = new MenuItem (menu, SWT.PUSH);
item2.setText("text 2");
sectionStop.setMenu (menu);
Since you are on your RCP, the basic question is where does the user right clicks. Is it on your view/editor or on an object that you contributed to some viewers? A better If you then you should look into contributing via the proper extension points. Either org.eclipse.ui.popupMenus or org.eclipse.ui.menus with locationURI "popup:org.eclipse.ui.popup.any"

Categories

Resources