I'm using a DatePicker widget, and I put a little calendar image next to it. When you click on the actual DatePicker textbox, the calendar popup pops up (as it should). I'm looking to add this click handling to the little calendar image too, so that the user can click either the box or the image to see the calendar popup. Is there an easy way to do this?
I thought it might be something like this:
calendarImage.addClickHandler(datePick.getTextBox().getClickHandler())
But it doesn't seem that anything like this exists.
Thanks in advance!
Just add a clickhandler to the image that sets the datepicker visible.
It will become something like this:
private DatePicker datePicker = new DatePicker();
private TextBox textBox = new TextBox();
private Image icon = new Image("calendar.png");
public void onModuleLoad() {
datePicker.addValueChangeHandler(new ValueChangeHandler<Date>() {
#Override
public void onValueChange(ValueChangeEvent<Date> event) {
Date date = event.getValue();
String dateStr = DateTimeFormat.getFormat(DateTimeFormat.PredefinedFormat.DATE_MEDIUM).format(date);
textBox.setText(dateStr);
datePicker.setVisible(false);
}
});
datePicker.setVisible(false);
icon.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
datePicker.setVisible(true);
}
});
RootPanel.get().add(icon);
RootPanel.get().add(textBox);
RootPanel.get().add(datePicker);
}
Assuming you mean DateBox when you write DatePicker, simply call showDatePicker on click of the icon (and/or test isDatePickerShowing and call hideDatePicker)
Related
Requirement : Mask the datepicker on blur / form submit.
I was able to get the masking done onBlur with forceparse set to false but i'm unable to navigate to the next month/year in the datepicker maybe because i'm overriding the DOM handlers.
dob.setForceParse(false);
dob.addDomHandler(new BlurHandler() {
#Override
public void onBlur(BlurEvent event) {
dob.getTextBox().setText(**masked value**);
}
}, BlurEvent.getType());
dob.addDomHandler(new FocusHandler() {
#Override
public void onFocus(FocusEvent event) {
dob.setValue(**unmasked value**);
}
}, FocusEvent.getType());
I am unable to use ChangeDateHandler, since it automatically assumes "1/1/19" as "1/1/1900" and masks the text mid-way of text enter. Is there any other way i can handle this?
If you are having problems with DatePicker's TextBox you can just hide it and use any other Widget instead.
TextBox is basically used to show the DatePicker when is focused, to show selected date and to enter the date manually.
Here is an example code how to use your own TextBox with DatePicker (I use VerticalPanel to show DatePicker just below the TextBox):
VerticalPanel container = new VerticalPanel();
final DatePicker dob = new DatePicker();
// hide DatePicker's TextBox
dob.getTextBox().getElement().getStyle().setDisplay(Display.NONE);
final TextBox box = new TextBox();
box.addFocusHandler(new FocusHandler() {
#Override
public void onFocus(FocusEvent event) {
dob.show();
box.setText("**unmasked value**");
}
});
dob.addHideHandler(new HideHandler() {
#Override
public void onHide(HideEvent hideEvent) {
box.setText("**masked value**");
}
});
dob.addChangeDateHandler(new ChangeDateHandler() {
#Override
public void onChangeDate(ChangeDateEvent evt) {
Window.alert("ChangeDateEvent");
}
});
container.add(box);
container.add(dob);
Just notice, that you need to call dob.show() when TextBox is focused. I also use DatePicker's HideHandler instead of TextBox's BlurHandler to show masked value but you may change it as you wish.
If you want to change the way of parsing dates like "1/1/19", now you can add your own parser to the TextBox.
I want to call a method when the user select a date on a datepicker. I don't know how to do that, there is no onDateSet method. Should I use a listener? Please help me.
EDIT: Here's the code regarding the datepicker:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
dp=(DatePicker)findViewById(R.id.dp);
c = Calendar.getInstance();
Month =c.get(Calendar.MONTH)+1;
Day = c.get(Calendar.DAY_OF_MONTH);
Year = c.get(Calendar.YEAR);
dp.init(c.get(Calendar.YEAR),(c.get(Calendar.MONTH)+1), Day, null);
Now, this view is in the main layout of my app, it have no buttons, just the datepicker with rolling number. I want to call a method when the user roll a different number on this datepicker. There is no positive button or any button at all, so the answer wouldn't work for me...
_datePickerDialog.setButton(DialogInterface.BUTTON_POSITIVE, "Ok", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface arg0, int arg1) {
_done = true;
DatePicker datePicker = _datePickerDialog.getDatePicker();
_datePickerDialogCallback.onDateSet(datePicker, datePicker.getYear(), datePicker.getMonth(), datePicker.getDayOfMonth());
}
});
here is the link to the original article
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"));
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 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?