It seems that Panel doesn't inherit from HasClickHandlers and I can't add a clickHandler to DivElement. Is there any way to add the clickHandler to a DIV?
EDIT: The reason I can't use Label as that the DIV I want to be clickable contains other DIV.
By default, Panel doesnt 'sink' the onCLick event. That is, clicking on Panels doesnt actually result into a 'ClickEvent' and hence the handler isnt fired. To use click events with Panel (or for that matter any other Widget) you must first invoke sinkEvents() on it with the appropriate event bits.
For example:
SimplePanel p = new SimplePanel();
p.sinkEvents(Event.ONCLICK);
p.setTitle("Click me");
p.setSize("600px", "600px");
p.addHandler(new ClickHandler(){
#Override
public void onClick(ClickEvent event) {
Window.alert("SimplePanel clicked!");
}
}, ClickEvent.getType());
The above piece of code first 'enables' click events for the SimplePanel using p.sinkEvents(Event.ONCLICK); and then goes on to add the standard ClickHandler onto it. Note that even though SimplePanel doesnt implement HasClickHandlers, you can always add a handler using the addHandler() method.
Use the FocusPanel.
A simple panel that makes its contents focusable, and adds the ability to catch mouse and keyboard events.
public class ClickableDiv extends FlowPanel implements HasClickHandlers {
#Override
public HandlerRegistration addClickHandler(ClickHandler handler) {
return addDomHandler(handler, ClickEvent.getType());
}
}
That should be all you need. addDomHandler will take care of "sinking" the event type for you.
Related
I am performing the following action in GWT
public class FooPanel extends SimplePanel {
private String url;
public FooPanel () {
super(DOM.createAnchor());
Button button = new Button();
button.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
foo();
}
});
add(button);
}
}
however when I run the code I get the following error
SimplePanel can only contain one child widget
However Button is a single widget so I am not sure what the problem is? The problem doesn't occur if i don't add the button
Remove this line:
super(DOM.createAnchor());
You don't need it.
You can simply use your Button in your code, or extend a Button widget. Adding a Button to a SimplePanel does not offer any benefits.
Have a look at source code of SimplePanel#add() to analyze this error.
#Override
public void add(Widget w) {
// Can't add() more than one widget to a SimplePanel.
if (getWidget() != null) {
throw new IllegalStateException("SimplePanel can only contain one child widget");
}
setWidget(w);
}
Now its clear from the source code that you have already added a widget in SimplePanel.
Call SimplePanel#getWidget() to get the already added widget.
Look at the source code of default constructor if SimplePanel class. It might help you to understand that how SimplePanel enclose the widget inside it.
/**
* Creates an empty panel that uses a DIV for its contents.
*/
public SimplePanel() {
this(DOM.createDiv());
}
Try with setWidget(button); instead of add(button);
quick question on GWT from a newbie. Considering the following code:
FlowPanel block = buildMyBlock(); // buildMyBlock builds a FlowPanel with different widgets in it
block.addDomHandler(
new ClickHandler()
{
#Override
public void onClick(ClickEvent event)
{
// do some stuff
}
},
ClickEvent.getType());
in the onClick() method, I'd like to be able to make different treatments depending on the internal elements that have been clicked inside block
Is it possible? And how ?
You can use Element.as(event.getNativeEvent().getEventTarget()) to retrieve the actual target of the event.
I'm new to GWT programming. So far I have a DialogBox which is supposed to collect a login and a password, which can if required launch another DialogBox that allows someone to create a new account.
The first of these two DialogBoxes always appears at the top left of the browser screen, and can't be dragged, although part of the definition of a DialogBox is that it can be dragged. However, the second DialogBox can be dragged about the screen without any problem.
What I'd really like is for the first DialogBox to appear in the middle of the screen & be draggable, both of which I thought would happen automatically, but there's not.
So, what things can stop a DialogBox from being draggable? There is nothing on the RootPanel yet. Does that make a difference?
Code fragments available if they help, but perhaps this general outline is enough for some pointers.
Thanks
Neil
Use dialogBox.center() This will center your DialogBox in the middle of the screen. Normally a DialogBox is by default draggable.
Just tried it out and it doens't matter if your RootPanel is empty our not. When I just show the DialogBox on ModuleLoad it is draggable and it is centered. Probably the problem is situated somewhere else.
This is the example of google itself:
public class DialogBoxExample implements EntryPoint, ClickListener {
private static class MyDialog extends DialogBox {
public MyDialog() {
// Set the dialog box's caption.
setText("My First Dialog");
// DialogBox is a SimplePanel, so you have to set its widget property to
// whatever you want its contents to be.
Button ok = new Button("OK");
ok.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
MyDialog.this.hide();
}
});
setWidget(ok);
}
}
public void onModuleLoad() {
Button b = new Button("Click me");
b.addClickListener(this);
RootPanel.get().add(b);
}
public void onClick(Widget sender) {
// Instantiate the dialog box and show it.
new MyDialog().show();
}
}
Here more information about the DialogBox.
Without seeing any of your code it's hard to tell what's going wrong. The following code works for me (ignore the missing styling...):
public void onModuleLoad() {
FlowPanel login = new FlowPanel();
Button create = new Button("create");
login.add(new TextBox());
login.add(new TextBox());
login.add(create);
create.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
final DialogBox box = new DialogBox();
FlowPanel panel = new FlowPanel();
Button close = new Button("close");
close.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
box.hide();
}
});
panel.add(new Label("some content"));
panel.add(close);
box.setWidget(panel);
box.center();
}
});
DialogBox firstBox = new DialogBox(false, true);
firstBox.setWidget(login);
firstBox.center();
}
Both boxes are draggable and shown in the center of your browser window.
Looks like you're overriding this method in Widget:
public void fireEvent(GwtEvent<?> event) {
if (handlerManager != null) {
handlerManager.fireEvent(event);
}
}
In Widget, handlerManager refers to a private HandlerManager.
Either add super.fireEvent(event) to your method or as you have done rename it.
Well, with vast amounts of trial and error I have found the problem, which was just this: I had a method in an object I'd based on DialogBox called fireEvent, which looked like this:
public void fireEvent(GwtEvent<?> event)
{
handlerManager.fireEvent(event);
}
Then, when a button was clicked on the DialogBox, an event would be created and sent off to the handlerManager to be fired properly.
And it turns out that if I change it to this (LoginEvent is a custom-built event):
public void fireEvent(LoginEvent event)
{
handlerManager.fireEvent(event);
}
... or to this ....
public void fireAnEvent(GwtEvent<?> event)
{
handlerManager.fireEvent(event);
}
the DialogBox is draggable. However, if the method begins with the line
public void fireEvent(GwtEvent<?> event)
then the result is a DialogBox which can't be dragged.
I'm a bit unsettled by this, because I can't fathom a reason why my choice of name of a method should affect the draggability of a DialogBox, or why using a base class (GwtEvent) instead of a custom class that extends it should affect the draggability. And I suspect there are dozens of similar pitfalls for a naive novice like me.
(Expecting the DialogBox to centre itself was simply my mistake.)
i need to register a cross platform and version independent click event to the document.
that means i have a two text box and submit button but when i click outside of the two text box and submit button then
alert will be displayed .how can i achive this by gwt
document.get().addMouseClick ???
The easiest way that comes to mind is to wrap everything in a FocusPanel:
ClickHandler clickHandler = new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
Window.alert("TextBox/Button clickHandler.");
event.stopPropagation(); // The important line - We stop the event
// propagation here so that the FocusPanel
// doesn't get the event
}
};
TextBox textBox = new TextBox();
textBox.addClickHandler(clickHandler);
Button button = new Button("Test");
button.addClickHandler(clickHandler);
// Since FocusPanel is a SimplePanel, it can only have one child, so we are
// wrapping everything additionally in a HorizontalPanel
HorizontalPanel hPanel = new HorizontalPanel();
hPanel.add(textBox);
hPanel.add(button);
FocusPanel focusPanel = new FocusPanel(hPanel);
focusPanel.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
Window.alert("Outside."); // Clicked outside of the TextBox/Button
}
});
RootPanel.get().add(focusPanel);
The downside is that you need to assign ClickHandlers to every element you don't want an alert for (you can use the same ClickHandler for that to save memory - like I did above). Other than that, the FocusPanel implementation should ensure that the onclick behavior stays cross-browser.
I'm using a RichTextArea in a GWT app. I want to add a context menu to my RichTextArea:
public class MyRichTextArea extends RichTextArea implements HasContextMenuHandlers {
public HandlerRegistration addContextMenuHandler(ContextMenuHandler h) {
return addDomHandler(h, ContextMenuEvent.getType());
}
}
(...)
myRichTextArea.addContextMenuHandler(new ContextMenuHandler() {
public void onContextMenu(ContextMenuEvent event) {
contextMenu.show();
}
});
This works, however, the context menu only appears when I right-click on the border of the RichTextArea. If I right-click into the RichTextArea, e.g. on the contained text, the browser's default context menu is shown.
How can I display my own context menu?
Prevent default context memu:
myRichTextArea.addDomHandler(new ContextMenuHandler() {
#Override public void onContextMenu(ContextMenuEvent event) {
event.preventDefault();
event.stopPropagation();
// do what you want to do instead
}
}, ContextMenuEvent.getType());
I would go after a method that tells you that the rich text area has the focus, like hasfocus, or maybe better, an event listener (addFocusListener) to tell you when the focus is there on a mouse click for the right mouse button?
Does that make sense?