Is it possible to expand GWT droplist(ListBox) by keyboard? - gwt

I have a flextable full of listboxes set to listBox.setVisibleItemCount(1), so they act as droplists.
When clicked on with the left mouse button they expand and let the user select an item.
Is it possible to mimic the mouse click with a keyboard key?
I've already tried to add keypress handler to the listbox that will fire a mousedown native event, but that did nothing.
Anyone have any idead?
Thanks in advance

I haven't found a solution yet for my problem but I have this workaround that works for now:
listBox.addBlurHandler(new BlurHandler() {
public void onBlur(BlurEvent event) {
ListBox listBox = ((ListBox)event.getSource());
SelectElement.as(listBox.getElement()).setSize(1);
}
});
listBox.addKeyPressHandler(new KeyPressHandler() {
public void onKeyPress(KeyPressEvent event ) {
if (event.getCharCode() == 32) {
ListBox listBox = ((ListBox)event.getSource());
SelectElement.as(listBox.getElement()).setSize(listBox.getItemCount());
}
}
});

Related

addValueChangeHandler of gxt ComboBox only fired on focus on another field

I have form with several GWT GXT 3 fields, one of which is a combo box.
When the combo box changes it should call a doSomething method.
My problem is that the onValueChange is only fired when I focus on another form field.
I would like that it changed just when I select an item of the combo box.
How can I do it?
This is part of my code.
final ComboBox<DropDownItemDTO> field = new ComboBox<DropDownItemDTO>(storeCombo, propsTitoliRioComboItemDTO.label());
...
field.addValueChangeHandler(new ValueChangeHandler<DropDownItemDTO>() {
#Override
public void onValueChange(ValueChangeEvent<DropDownItemDTO> event) {
if (event.getValue()!=null) {
value.setFieldValue(event.getValue().getValue());
} else {
value.setFieldValue("");
}
doSomething(event.getValue().getValue());
}
});
I ended up using SelectionHandler, which fires right away on selection
field.addSelectionHandler(new SelectionHandler<DropDownItemDTO>() {
#Override
public void onSelection(SelectionEvent<DropDownItemDTO> event) {

How to programmatically open a gwt listbox?

I have a user form with a lot of gwt listbox. The form is like an excel form with named list.
It's ugly and the arrows take place.
I would like the cells were like in excel. The arrow appears only when you click in the cell.
I start to program my own widget with a textbox and a listbox embedded into a DeckPanel, switching when you click on the textbox or when the value change. But with this solution, it is necessary to click again to open the listbox.
Now, it will be great, if when you click on the textbox, the listbox will be displayed already open.
In the code below, I try to do this into the method onClick wih this line:
DomEvent.fireNativeEvent(event.getNativeEvent(), listBox);
But it has no effects.
public class CustomListBox extends Composite implements ClickHandler,
ChangeHandler, HasChangeHandlers {
private final StringListBox listBox;
private final TextBox textBox;
private final DeckPanel panel;
public CustomListBox() {
textBox = new TextBox();
textBox.addClickHandler(this);
textBox.setReadOnly(true);
listBox = new StringListBox();
listBox.addChangeHandler(this);
panel = new DeckPanel();
panel.add(textBox);
panel.add(listBox);
panel.showWidget(0);
// All composites must call initWidget() in their constructors.
initWidget(panel);
}
#Override
public void onClick(ClickEvent event) {
Object sender = event.getSource();
if (sender == textBox) {
panel.showWidget(1);
DomEvent.fireNativeEvent(event.getNativeEvent(), listBox);
}
}
public void addItem(String item) {
listBox.addItem(item);
}
public int getSelectedIndex() {
return listBox.getSelectedIndex();
}
public String getItemText(int selectedIndex) {
return listBox.getItemText(selectedIndex);
}
#Override
public HandlerRegistration addChangeHandler(ChangeHandler handler) {
return listBox.addChangeHandler(handler);
}
#Override
public void onChange(ChangeEvent event) {
Object sender = event.getSource();
if (sender == listBox) {
textBox.setText(getItemText(getSelectedIndex()));
panel.showWidget(0);
}
}
}
Since you are already programming your own widget, why don't you go all the way. Don't swap out the text box for a list box widget. Instead of a textbox use a label. Add an arrow to your label background when you mouse over, then use a popupPanel for the list itself. In the popupPanel you can make the list items whatever you like, just make sure when you click on it, it sets the text in your original label.

GWT checkbox hides/shows widget

How to add clickHandler to a gwt checkbox, so that when the checkbox is checked, a listbox is shown and when it is unchecked, the listbox disappears?
Following is what I have so far. When I check the checkbox, the list appears, but when I uncheck it, the listbox does not disappear.
VerticalPanel vPanel = new VerticalPanel();
ListBox list = new listBox();
list.setVisible(false);
vPanel.add(list);
.....
.....
checkBox.addClickHandler(new ClickHandler()
{
public void onClick(ClickEvent event)
{
boolean checked =((CheckBox) event.getSource()).isEnabled();
if(checked==true)
{
list.addItem("a");
list.addItem("b");
list.addItem("c");
list.setVisible(true);
}
else if(checked==false)
{
componentList.setVisible(false);
}
}
});
Thanks so much in advance.
A better way to do it is to do the value changed handler. The user can even use the keyboards to check the checkbox!
CheckBox c = new CheckBox();
c.addValueChangeHandler(new ValueChangeHandler<Boolean>() {
#Override
public void onValueChange(ValueChangeEvent<Boolean> event) {
componentList.setVisible(event.getValue());
}
});
}
edit -
You should add the items in the list outside. And, depending on the default checkbox value,(checked or unchecked), set the component visible or hidden outside itself in the start.
enabled != checked! (use isChecked or getValue)
Otherwise, go with Bhat's code and advises.

GWT: context menu in RichTextArea

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?

Suppress control-click context menu, gwt 1.6

My gwt 1.6 application intercepts mouse clicks on hyperlinks, so when a user shift-clicks on links to "authors" they get an Edit... dialog box instead of navigating to the author's page. That's working nicely.
I'd now like to allow the user to control-click to select more than one author, but I can't figure out how to suppress the browser's default popup menu. This code handles shift-clicks correctly, but fails in the hosted browser when I control-click and half-fails in Firefox (handleCtrlClick() gets called, but I still get the browser menu):
public void onModuleLoad() {
Event.addNativePreviewHandler(this);
}
//
// Preview events-- look for shift-clicks on paper/author links, and pops up
// edit dialog boxes.
// And looks for control-click to do multiple selection.
//
public void onPreviewNativeEvent(Event.NativePreviewEvent pe) {
NativeEvent e = pe.getNativeEvent();
switch (Event.getTypeInt(e.getType())) {
case Event.ONCLICK:
if (e.getShiftKey()) { handleShiftClick(e); }
if (e.getCtrlKey()) { handleCtrlClick(e); }
break;
case Event.ONCONTEXTMENU:
if (e.getCtrlKey()) { // THIS IS NOT WORKING...
e.preventDefault();
e.stopPropagation();
}
break;
}
}
A breakpoint set inside the ONCONTEXTMENU case is never called.
IIRC ctrl + click is the correct way to select multiple items not ctrl + right click unless you're using a one button mouse (iMac), in that case I can't help you.
Could you provide more details?
Edit:
Why not override the contextmenu (e.g. disable it) then create your own context menu widget (perhaps based on vertical MenuBar + MenuItems) and display it only on Ctrl + RightClick?
In other words you'd create a MouseHandler somewhat like this (pseudo code):
public void onMouseDown(MouseDownEvent event) {
Widget sender = (Widget) event.getSource();
int button = event.getNativeButton();
if (button == NativeEvent.BUTTON_LEFT) {
if(event.is_ctrl_also)
{
// Add to selection
selection = selection + sender;
}
else
{
// Lose selection and start a new one
selection = sender;
}
}
else if(button == NativeEvent.BUTTON_RIGHT) {
if(event.is_ctrl_also)
{
// show context menu
this.contextmenu.show();
}
else
{
// do something else
}
}
return;
}
I've not encountered the bug with Ctrl-Leftclick firing a ContextMenu event, but I'm sure you could also make a workaround for Firefox only using permutations.
I'm getting closer:
public void onModuleLoad() {
Event.addNativePreviewHandler(this); // Catch shift- or control- clicks on links
addContextMenuEventListener(RootPanel.getBodyElement());
}
protected native void addContextMenuEventListener(Element elem) /-{
elem.oncontextmenu = function(e) {
return false; // TODO: only return false if control key down...
};
}-/;
That disables the right-click menu entirely; I'd really like to disable it ONLY if the control key is pressed...