I just started yesterday using GWT, so maybe I'm not using the proper mechanism to solve that problem. So, I will try to explain exactly what I'm trying to do (with a simple problem) and 2 solutions I came up with to address that problem.
Problem:
Remember an index that can be updated via other widgets. Let's use focus to represent it.
[button 1]
[button 2] [button A]
[button 3]
The buttons [1..3] and [A] are not in the same class and need to find the element using the id using the DOM. The reason is that those 2 views needs to be orthogonal.
We can use up/down key to move the focus from button 1 to 3.
If we are on the buttons [1..3] and press right, we go to button A.
If we are on the button A and press left, we go to button previously focused.
What we want to do is save or set the focus index when pressing right.
Solution 1: Global variables
I'm not usually fond of global variables, but in some case it's handy. By using, for instance, a dictionary (Dictionary.getDictionary) defined globally in the javascript, I could save the current index in it using the "Focus Event" in that case.
So, in the key press event, when left would be fired, I would just read the value in the dictionary.
I haven't tested yet, but I think it should work.
Solution 2: Set the value with the Element
Element element = DOM.getElementById("button id A");
element.<setFocusLeftKey>("button id [1..3]");
Here what I would like to achieve is just in the "onFocus" Event, I would simply set the value of that button.
So is it possible to cast/find the object with the Element? I think that if there is no easy way, it's probably because it's not recommended.
Is there a simpler way/other method to achieve that?
So, any thought or solutions?
Thanks in advance.
P.S. I haven't found a better title for that, so if any suggestion, just put it in the comments and I'll update it.
Using ID is definitely not the suggested way to do this in GWT. You say you need this mechanism to keep your views orthogonal to one another. This is noble, but in GWT you would achieve by using another resource (an EventBus, implemented in SimpleEventBus) that hides the different components from one another. In fact, I would argue that looking up the element by ID strongly couples the two views and is smelly.
Armed your EventBus you simply create and fire custom events that let the views (or, better, their presenters) communcate with one another. For example here you could have: NavigateRightFromButtonsEvent and NavigagteLeftFromButtonA event.
However, depending on the size of your app (or as a first experiment) you could decide to couple your two views. In this case simply pass the view for the button list into the one for button A and vice-versa. This is not really worse than relying on a global ID.
No matter which mechanism you choose (event bus or wiring the views together), you should now have access directly to the instance of the widget you want to highlight. To focus, just call setFocus(true) on it.
Related
My idea is to create a kind of growing form. Now the question is: What is the best way to do this? I haven't found a library, yet. On the picture below, you can see how I thought it to be. It should go to the next step after each input and an EditText field should appear. Any advice on existing libraries or tips on which UI component should be used to realized would be appreciated. Thanks for the help!
you have plenty approach but the one i prefer to use:
make your list, then for each index assign its next EditText. by default make your all EditTexts (except first one) disabled. then add a listener each index to observe its text. as soon as it was filled tell that listener to enable its next EditText.
maybe its not so efficient but its simple and makes code more readable. and also you can extend that easily if you just implement two first indexes because the rest is just the same.
I need to build a View which has a 4 layer nested Multi-Accordion with a lot of checkboxes inside them. All together there might be around 30-40 Checkboxes all through the Accordions.
The next step will be, that i have some sort of logic behind all this. Depending on the selection combination of the checkboxes I will change a text label accordingly.
My thought process was: I put up all these checkboxes and give them a numeric fx:id representing there position in the nested accordion graph. Something like "1_1" or "2_4_1".
After that, I build one ChangeListener calling a Method on Selection of a Checkbox. I can look up the Id of the checked box, look it up in my data (to see which Text belongs to it and if any rules interfer with other boxes) and handle the logic accordingly while putting the id and its text in a Map or List to keep it for later and to keep track of the checked boxes.
Now I came to know, that getting the fx:id isnt something JavaFX wants me to do. I cant deliver a custom id in custom property inside the FXML either (couldnt find anything regarding this).
I am now pretty much at the end of my knowledge (I did just start with JavaFX and have some basic Java knowledge) and it seems to me, that I tackle this topic from the wrong side.
My question is now: What would be a best practice to handle dozens of checkboxes and trigger logic in the code according to the box that was checked without writing a ChangeListener for every single Check Box leaving me with some (imo) ugly code all the way.
EDIT: I forgot to mention: I did achieve some sort of functional solution by writing a custom CheckboxChangeListener with a reference to the Element the addListener method was called on and using "getId()" on this reference. I came to know though, that this method references the css:id of the fxml element and not its fx:id and I am not quite sure if this is a proper way to go
You should look into databinding with javafx. For example:
CheckBox cb1 = new CheckBox("1");
CheckBox cb2 = new CheckBox("2");
BooleanProperty isCb1Selected = cb1.selectedProperty();
BooleanProperty isCb2Selected = cb2.selectedProperty();
Textfield foo = new TextField().visibleProperty().bind(isCb1Selected.and(isCb2Selected));
This would hide the textfield foo if atleast one of the checkboxes isn't selected.
You can find other examples here and here an oracle tutorial
I am writing a browser based application using GWT and making use of websql (yes, I know it is deprecated). I have created a custom table widget (based on FlexTable) and enabled it to scroll with the help of some CSS trickery. What I am striving to achieve (without much success) is that when the user scrolls to the start/end of the current data in the table, an event is fired and the next subset of X rows is returned from the websql DB and replaces the data currently in the table. In order for this to work, I need to keep track of the data offset in the table widget so that I can pass this to the query and use the limit and offset functions of SQL to return the required data. However, I just cannot seem to get the logic right to implement the data offset tracker within the widget. Another complication is that I need the table to be able to scroll 'into the past' (so to speak), so that it can retrieve data from before the initial start point when the table loads.
I have been at this for a number of days now and just cannot seem to get it right. So I was wondering/hoping that someone might be able to point me in the right direction (PLEASE!).
Thanks in advance
Tim
I am not sure why this is causing a problem.
int page = 0;
// when you hit the bottom
page++;
loadData(page);
// when you hit the top
if (page > 0) {
page--;
loadData(page);
}
Tim I think it is not a good idea controlling the scroll with CSS trickery.
I have done something similar soon and controlling all the logic (pagination, scroll positions,...).
What I suggest to use is a gwt's scrollPanel, a HasData widget (like a cellList) your custom AbstractCell (class which is rendered for each row of your list) and asyncDataProvider ( which gives you the onRangeChange handler for asking to your server when the range data display has changed).
You can force/fire that event when in scrollPanel.addScrollHandler detects you are arriving to the end.
If you want to see all of this in action have a look into (click on source code): http://gwt.googleusercontent.com/samples/Showcase/Showcase.html#!CwCellList
EDIT [according comment below]:
A. If you want to override the data (in the example is X+X+X...) with the new retrieved just maintain always the same range of data displayed [display.setVisibleRange(0, newPageSize);], and start from 0 when you render the new data (on your RangeChange listener).
B. If you need to have control over up and down scrolls instead of taking advantage of the used events internally on the cellList (basically onRangeChange), you can create your custom events and fire them (this option could be easier for your colleagues for understanding everything). And do not worry about controlling up and down scrolls, inside the ShowMorePagerPanel.java you can see a simple example of knowing up and down controls.
Anyway, I did not explain more detailed because I did not see you very convinced to use CellList approach (and I was using my tablet :D ).
If you change your mind, just let me know and I write for you a proper example step by step (this part could be tricky, so if you are lost it is normal ;) ).
I have a JXTree and I'd like to add searching to it this way:
As the user types, the model returns the matching elements of the tree and selects the first one of the set in the tree's view.
The problem is, that by default the JXTree has an other keylistener, that selects an element starting with the currently typed letter.
Sometimes the native listener fires last making the outcome wrong. What can be done to prevent this behavior? I don't want to remove the inherent listener because it has arrow based navigation... (Which I have to reimplement.)
I've already read this: Is the order in which KeyListeners will be called guaranteed?, but I don't think that I can create the proposed listener wrapper without great effort, since BasicTreeUI's Handler class is private.
That's not a feature of JXTree but JTree. Overriding JTree#getNextMatch() to always return null should disable the JTree selection on key press.
I am using list-field in a BlackBerry application. In each list-field item, I have a bitmap-field at the left, text at center and again a bitmap-field at the right.
Can I determine whether the fields are focusable inside the list-field rows for keypad versions of BlackBerry Devices for e.g BlackBery Tour?
No in list field no control except whole row is focusable explicitly. If you want to perform any click events you can use touchEvent() but the calculation will be too complex and not so reliable.
If you want to have separate clickable items in one row you must use HorizontalFieldManager each time.
Update: : I have come across this scenario twice, and if I were in place of you I will consider what exactly the feature is about, If you are concerned about UI and there is not any heavy functionality behind focusing you can try touchEvent or navigationClick but using both will be cumbersome. Too much logic, too much thinking, hard to test.
If there is any functionality, you have an option to add them on menu, It will be more convenient way than using horizontal field manager or the above mentioned methods.