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.
Related
I`m using GWT-Popup-Panel with the following code:
private static class MyPopup extends PopupPanel {
public MyPopup() {
// PopupPanel's constructor takes 'auto-hide' as its boolean parameter.
// If this is set, the panel closes itself automatically when the user
// clicks outside of it.
super(true);
// PopupPanel is a SimplePanel, so you have to set it's widget property to
// whatever you want its contents to be.
setWidget(new Label("Click outside of this popup to close it"));
}
}
public void onModuleLoad() {
final Button b1 = new Button("About");
b1.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
final MyPopup g = new MyPopup();
g.setWidget(RootPanel.get("rightagekeyPanel"));
g.setPopupPositionAndShow(new PopupPanel.PositionCallback() {
public void setPosition(int offsetWidth, int offsetHeight) {
g.setPopupPosition(b1.getAbsoluteLeft(), b1.getAbsoluteTop());
g.setAutoHideEnabled(true);
}
});
g.setVisible(true);
g.setWidth("500px");
g.setHeight("500px");
g.show();
}
});
It does appear when clicking Button b1, but not when clicking it the second time. What is wrong?
Make one popup, outside of your ClickHandler, at the same level as your Button. You also don't need that PositionCallback to center your popup. You can just call g.center() to show it and center it. It's a known issue on the GWT support pages that it won't center properly if you don't set a width to it. It will center properly if you give your popup a proper width.
The reason it doesn't show again is because you remove the widget inside RootPanel.get("rightagekeyPanel") and put it into your popup. It is no longer there the next time you try to do it.
A widget can only be in one place at a time, so if you remove it from its parent, keep track of it with a variable or something, so you can re-use it. Otherwise, you must re-instantiate the widget.
public void onModuleLoad() {
final Button b1 = new Button("About");
final MyPopup g = new MyPopup(); //create only one instance and reuse it.
g.setAutoHideEnabled(true);
g.setSize("500px", "500px"); //sets width AND height
b1.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
g.setWidget(RootPanel.get("rightagekeyPanel"));//DON'T DO THIS.
g.center();//will show it and center it.
}
});
}
Just say in my case I had to add some widget to make the PopUpPanel appear. Try using a label to make sure the Popup is showing.
PopupPanel popup = new PopupPanel();
popup.setVisible(true);
popup.center();
popup.show();
popup.setWidth("500px");
popup.setHeight("500px");
popup.add(new Label("Test"));
When the user clicks a button, I want to fire the ListGrid Selection event. I called "resultControl.resultGrid.selectRecord(0);" but it didn't work.
From your initial question and your comment, I understand that you want to simulate a selection event in your ListGrid, through a button. Assuming that I understand well, and you are only interested in one record selection (the first one), all you have to do is the following:
final ListGrid listGrid = new ListGrid();
//Initialize your listgrid's data etc.
listGrid.addSelectionChangedHandler(new SelectionChangedHandler() {
#Override
public void onSelectionChanged(SelectionEvent event) {
SC.say("here my code");
}
});
IButton button = new IButton("Select");
button.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
listGrid.selectRecord(0);
}
});
A last note, System.out or System.err won't produce anything when your application runs in production mode. Use a suitable logging solution or the SC.say(), if you want to provide the user with a message, instead.
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.)
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.
I am trying to focus on a particular list view in a tree, I am using the following code
this.txtListName.setCursorPos(this.txtListName.getText().length());
this.txtListName.setFocus(true);
The text view has the cursor blinking inside it but when I type a key nothing happens, I have to select the text view again before being able to type.
Why is this happening.
SOLVED
The setting the the focus was done inside a for loop that looped over and created the Tree Items, when I removed it from the for loop it worked.
Could it be that something in your current call stack is taking the focus away after you set it. You could try setting the focus in a timeout:
(new Timer() {
#Override
public void run() {
txtListName.setFocus(true);
}
}).schedule(0);
I've tried to recreate your problem but the following snippet works for me:
public void onModuleLoad() {
Tree tree = new Tree();
final TextBox box = new TextBox();
box.setText("some content");
tree.add(box);
Button btn = new Button("set focus");
btn.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
box.setCursorPos(box.getText().length());
box.setFocus(true);
}
});
RootPanel.get().add(tree);
RootPanel.get().add(btn);
}
Isn't that what you're trying to achieve?