I have a MenuButton which consists of a Image and a Text under the image. The whole thing is build like this:
ImageResource icon = ...;
final Element span = DOM.createSpan();
Image image = new Image(icon);
span.insertFirst(image.getElement());
Element div = DOM.createDiv();
div.setInnerHTML(text);
span.insertAfter(div, span);
image.sinkEvents(Event.ONCLICK);
getElement().insertFirst(span);
The click event is set in the presenter like this:
...
private void bindEvents() {
display.getButton().addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
Window.alert("test");
}
});
The click event works just partly, when I click on the text under the image the click event works fine but when I click on the Image no click is performed!?
A different approach:
FlowPanel myButton = new FlowPanel();
myButton.add(new Image(icon));
myButton.add(new Label(myButtonText));
ClickHandler h = new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
// do something
}
};
myButton.addDomHandler(h, ClickEvent.getType());
This will catch a click event on both image and the text under it.
Related
I want to drag a text box from vertical layout container and drop it in a flow layout container. On drop, it should appear as a Rich Text Area. Please find the code below. I tried to debug the code and it is getting entered only inside dragging. Debugging is not coming inside droptarget. Can you please help me?
final TextButton textButton = new TextButton();
textButton.setText("Text Box");
DragSource source = new DragSource(textButton) {
#Override
protected void onDragStart(DndDragStartEvent event) {
super.onDragStart(event);
}
};
DropTarget dropTarget = new DropTarget(flowLayoutContainer);
dropTarget.setOperation(Operation.COPY);
dropTarget.addDropHandler(new DndDropHandler() {
#Override
public void onDrop(DndDropEvent event) {
final RichTextArea textBox1 = new RichTextArea();
flowLayoutContainer.add(textBox1);
}
});
I need to "emulate" this:
document.getElementsByTagName("body")[0].onclick = function gameOver() { ...}
in vaadin 7, to display a dialog box when the user clicks anywhere on the web page
My code:
//...
#Override
protected void init(VaadinRequest request) {
Label labelH1 = new Label("<span style=\"color:SteelBlue;\">M</span>atching "
+ "<span style=\"color:Purple;\">G</span>ame!", ContentMode.HTML);
labelH1.setStyleName("h2");
Label labelH4 = new Label("Click on the extra smiling face on the <span>left</span>.",
ContentMode.HTML);
labelH4.setStyleName("h4");
CssLayout layout = new CssLayout();
AbsoluteLayout leftLayout = new AbsoluteLayout();
leftLayout.setId("leftSide");
AbsoluteLayout rightLayout = new AbsoluteLayout();
rightLayout.setId("rightSide");
layout.addComponent(labelH1);
layout.addComponent(labelH4);
layout.addComponent(leftLayout);
layout.addComponent(rightLayout);
setContent(layout);
}
You can use the click listener on the current UI. As following:
UI.getCurrent().addClickListener(new ClickListener()
{
#Override
public void click(com.vaadin.event.MouseEvents.ClickEvent event)
{
// You can show the dialouge box or any other of your desired task here ...!!!
System.out.println("UI is clicked");
}
});
I've got a problem with a Java project I'm working on: I'm creating a grid of buttons via code in javafx on a pane. The buttons are all types of a subclass of the javafx Button class that i wrote.
Here's the header of the class:
private final String BASIC_STYLE = "-fx-font: 6 arial;";
private final String CLICKED_STYLE = "-fx-background-color: #0f0";
private int row;
private int col;
private String category;
private boolean selected = false;
Within the constructor i do the follwing:
this.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
toggleSelected();
}
});
Here's the toggleSelected() Method:
public void toggleSelected() {
this.selected = !selected;
this.setStyle(selected ? this.BASIC_STYLE : this.BASIC_STYLE+this.CLICKED_STYLE);
}
It's basically supposed to swap the style everytime you click the button. When i click the button, the button first gets selected by the OS (the border is becoming blue) and only after i click a second time on the exact same button it'll become green (the style that i'm giving it via setStyle).
However, the selected property becomes true on the first click and false on the second click, which means i click once on the button and it gets a blue border and selected = true, if i click on it a second time it becomes green and selected = false and if i click on it a third time it becomes normal again but selected will be true again.
I find it to be really strange that the first click on a button changes the "selected" variable correctly but not the style. Why is this happening and how can i avoid that i've to select the button first before i can click it?
You initialize
selected = false ;
and
setStyle(BASIC_STYLE);
But your event handler enforces the rule
selected == true -> setStyle(BASIC_STYLE);
selected == false -> setStyle(CLICKED_STYLE);
So your initial state is inconsistent with the state your handler enforces.
From the initial state, the first time you click, selected is set to true which causes setStyle(BASIC_STYLE) (which is the value it already has, so nothing changes). From then on, everything will switch as required.
You either need to change the initial state, or switch the logic of the setStyle(...) call in the handler.
public class ButtonEnterAction extends Button {
boolean selected = true;
public ButtonEnterAction(String connect) {
setText(connect);
action();
}
public ButtonEnterAction() {
action();
}
private void action() {
EventHandler<KeyEvent> enterEvent = (KeyEvent event) -> {
if (event.getCode() == KeyCode.ENTER) {
fire();
}
};
addEventFilter(KeyEvent.KEY_PRESSED, enterEvent);
// setOnMouseEntered(new EventHandler<MouseEvent>() {
// #Override
// public void handle(MouseEvent me) {
// SepiaTone st = new SepiaTone();
// setEffect(st);
// }
// });
// setOnMouseExited(new EventHandler<MouseEvent>() {
// #Override
// public void handle(MouseEvent me) {
// setEffect(null);
// }
// });
}
#Override
public void fire() {
super.fire(); //To change body of generated methods, choose Tools | Templates.
if (selected) {
SepiaTone st = new SepiaTone();
setEffect(st);
} else {
setEffect(null);
}
selected = !selected;
}
}
Create the Instant Class in ButtonEnterAction is like.
ButtonEnterAction bea = new ButtonEnterAction("TestButton");
bea.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
System.out.println("hello");
}
});
I'm learning JavaFX and this is just a small programming question.
I have 3 buttons in a VBox. And I want to apply the same 3 effects on all buttons after I put them in the Vbox. But when I use a for loop and getChildren() on the VBox, they are returned as 'Nodes'. I can't use the Button.getText() to find out the text of the button.
Is there a way I can getText of a Node? Or maybe convert the current Node to a Button and get the text that way?
VBox vbox = new VBox();
Button option1 = new Button("Single Player");
Button option2 = new Button("Network Player");
Button option3 = new Button("View Rules");
vbox.getChildren().add(option1);
vbox.getChildren().add(option2);
vbox.getChildren().add(option3);
for (final Node button : vbox.getChildren()) {
button.setOnMouseEntered(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent arg0) {
button.setEffect(addEffect(Color.web("#53CFA6"), .8, 10));
}
});
button.setOnMouseExited(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent arg0) {
button.setEffect(addEffect(Color.web("#FF6800"), .8, 10));
}
});
button.setOnMouseClicked(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent arg0) {
button.setEffect(addEffect(Color.web("#E62800"), .8, 10));
//Need to use button.getText()
//Button button; button.getText() works
}
});
}
there is two options:
1. Convert types. Easy, but not safe.
If you sure you wouldn't add other children to this VBox you can just convert Node to Button:
for (Node node : vbox.getChildren()) {
if (node instanceof Button) {
final Button button = (Button) node;
// all your logic
}
2. Use Factory pattern. Best suites, IMHO.
introduce method createButton which will setup button as you need:
private Button createButton(String name) {
final Button button = new Button(name);
button.setOnMouseEntered(...);
button.setOnMouseExited(...);
button.setOnMouseClicked(...);
return button;
}
and you code will look next way:
Button option1 = createButton("Single Player");
Button option2 = createButton("Network Player");
Button option3 = createButton("View Rules");
vbox.getChildren().addAll(option1, option2, option3);
3. Introduce your own Button class. Better if you plan to extend buttons logic.
public void FancyButton extends Button {
public FancyButton(String name) {
super(name);
//handlers logic here
}
}
You can get text from button and assign it to a string variable by this code :-
String Val = ((Button)event.getSource()).getText();
I am having this HyperLInk in my cellTable ,but its Clickhandler is not working
myHyperLInk.addClickHandler(new ClickHandler(){
public void onClick(ClickEvent event) {
Window.alert("test");
}});
It displays a warning :
The method addClickHandler(ClickHandler) from the type Hyperlink is
deprecated
When i click on the link, it simple go to the previous page from history. How can i simply say show a message dialog on pressing a hyperLink?
I think what you want may be an anchor widget vs a hyperlink.
http://google-web-toolkit.googlecode.com/svn/javadoc/2.3/com/google/gwt/user/client/ui/Anchor.html
Hyperlinks are usually used for working with the history.
Hyperlink link0 = new Hyperlink("link to foo","foo");
link0.addDomHandler(handler, ClickEvent.getType());
ClickHandler handler = new ClickHandler() {
public void onClick(ClickEvent event) {
Window.alert("test");
}
};