Brief:
I have a GWT TextBox and CellList. I would like the up/down keys to do keyboard selection in the CellList while focus is still in the Textbox (search filter). How do I do that?
Details:
Right now, if I focus the celllist, it behaves as I want, however, I don't want to have to leave the search field to select an element with the up/down keys. The up/down keys seem to have a behavior I don't need in the Textbox (move to beginning/end of text).
It's actually rather easy: use a SuggestBox and provide your own SuggestionDisplay, which can be a CellList or Menu widget (or whatever) sitting anywhere you want it.
The DefaultSuggestionDisplay opens a Menu in a PopupPanel, but that's just the default implementation. If you ever used Google Wave, what you're asking for looks a lot like the person chooser when inviting people to your waves, and it was a SuggestBox AFAICT.
Related
I am trying to display a word suggestion list when ctl+space entered as in eclipse.
For that I need to know the location where user has entered ctrl+space so that i can display the suggestion list exact below to the word user just entered.
I see ways to get the mouse cursor position , But isnt there a way to get the keyboard button pressed position ,
I am writing inside textArea, I tried getCursor, but it gives me the no of word on which user entered ctrl+space. Not the location as per the Window.
Any idea
thanks
There is no reliable, accurate and cross-browser way to do it with TextArea.
You can experiment with a RichTextArea (you don't have to provide a toolbar for rich text features) and its getFormatter().insertHTML() method. It will insert a new HTML element at a cursor position. You can insert a list of suggested words, that you can style to look anyway you like, or you can insert an empty div and try to show a panel relative to it.
Or you can use a different UI approach. Create a panel with a fixed position relative to your TextArea and show your suggested words there - similar to the way good smartphone keyboards show suggested words just above the keyboard itself. Once your users realize that suggested words always show up in the same place, they may even like this design better.
I have strange problem..
I want to do this:
I have a focuspanel. In default I want to give him focus:
this.setFocus(true);
I have function onBlur which is able to save all information from focuspanel. But the focus panel doesn's have focus... I must click on him, and in other place to start function onBlur..
Second problem is a... When I have focus and I click on other widget in my focus panel I lose focus.. (Which I have from click on this panel.) It is not expect.
Only way to save information is to fill it in the focus panel, click on the blank space in focus panel and in other place out focus panel.. I don't know how to fix it..
Please, help!
A FlowPanel is a div and can't have focus by default, you need to set the tabindex: https://stackoverflow.com/a/3656524/66416
I have a VerticalPanel consisting of an Image and a Label with some text in it. What I'm trying to implement is something like a Desktop Icon - when you click it - it gets 'marked' and probably a menu will appear. When you click outside of the icon - the menu should disappear and the icon will get unmarked.
Currently I'm trying to achieve this by wrapping the VerticalPanel in a FocusPanel and playing with some focus handling but I have not achieved any satisfying results so far.
I would appreciate if you could give me some guidance on how to best implement this.
Thanks.
You're on the right track with the FocusPanel wrapper. The key point about the FocusPanel for what you want to do is that it captures clicks (by implementing HasClickHandlers). You can then handle clicks and assign the panel CSS rules e.g. border-width, border-color, or background-color, etc., according to however you'd like to indicate your icon as pressed/selected.
Its seems that you need a ToggleButton and a basic PopupPanel
I have an editor which is comprised of a table and a set of selection-specific form fields below it, so that when I make a selection in the table, the fields below it will change. When the editor is sized too small, the fields container gets a scrollbar:
The problem is that when I make a selection in the table, I can't scroll the fields container down (with the mouse wheel) because the focus is still within the table. Currently I have to select one of the fields to be able to scroll its container or manually drag the scrollbar itself, but it's much easier to just click or hover anywhere in the target container to focus it for mouse wheel scrolling.
How can I make the composite body (in my case, a Form) selectable? Or even better, is there a way to control scrolling depending on where the mouse cursor is?
If you want to control scrolling based on where the mouse cursor is located, you're going to have to write a combination org.eclipse.swt.events.MouseMoveListener and org.eclipse.swt.events.MouseWheelListener.
Component method setFocus() brings the component into keyboard focus.
I've not tried to do this. Be sure to handle the case where the user does not have a scroll wheel on their mouse.
How can I modify a GWT menu - grey out some entries, put a checkmark next to others, according to my application state?
My app has a menu bar across the top - File, Edit, View, Insert, Format, etc. I have a number of paragraphs, each of which could have a different format. When the user clicks on Format, I want the format menu to show a checkmark next to the menuItem that corresponds to the format of the currently selected paragraph. If some formats are inappropriate for the currently selected paragraph, I want to grey those menuItems out.
The main issue is when to do the update: (a) when the Format menu button is clicked, or (b) each time my user selects a new paragraph?
I find option (a) more appealing. But how can I detect this? A MenuItem doesn't have any facility for adding event listeners. It could be a mouseClick that I need, but it might be a mouseOver: if the user clicks on the Insert menuItem the Insert menu will appear, but then if the mouse is moved over Format, then the Format menu will appear.
Option (b) sounds simpler, but wastes more processor time.
For my contextMenu (right click on the paragraph), it's much easier, because the menu is only constructed when the right click happens.
I've resorted to using the square-root symbol (√) for a tick. Does anyone know a nicer way? Do I need to use HTML and use " Plain-Format" for my menu item?
Finally, is there a way to disable (grey-out) a menu item so that it can't be selected?
Option (a) sounds better from a conserving resources point of view.
Instead of using the square-root symbol, why don't you use an image (using the com.google.gwt.user.client.ui.Image class)?
I think a more elegant/simple solution might be to use the checkbox class for your menu items. That way you could have automatic ticks/checks instead of having to use an image or the square-root symbol. Also, you will be able to "grey-out" items with setEnabled(false). Otherwise, you will have to write your own widget or add your own functionality to your menu labels in order to "grey-out" items.