I would like to create Custom Gwt Celltable with editable columns, where each column may accept any type of widget, is there way to do it, please let me know?
Thanks for your help.
The Cell system, by design, does not allow widgets to be added inside of a Cell. This is the point of the Cell idea - drawing many elements with a single instance, and letting that one instance handle the events for all of them.
This is how the various Cell-based widgets can perform better than the FlexTable or Grid, which allow widgets.
The closest you can get is to draw a Widget on some event sent to the Cell instance, but even there you must be careful to detach the widget when you are finished with it, or risk a memory leak.
Related
Sometimes having to create controller, registering it in widget and then registering listener in controller looks like overengineering. I'm trying to understand why Flutter Team decided to go this path for some widgets, i.e. for text field, list view, while for others, i.e. for button widgets we can simply register onPress listener right in the widget itself, which obviously is easier and requires less boilerplate code.
Any reason why having controllers is a better thing compared to simple event listeners?
Controllers are used to store state higher up in the widget tree so a parent widget can both react to it as well as change it.
In the case of a text field, it wouldn’t be convenient to have a callback when a user presses a key and then have the parent construct the new text that should be displayed and rebuild the text field with that. (And it is not just key presses because you can paste text as well.) So the text field stores the text, so it always knows what to display and the onChange callback can report the whole text after the user changes it.
But then you might want to change to text from the parent as well. They could have made it such that the parent would have to rebuild the text field with a new text in such as case. However, for some use cases where you don’t just want to overwrite what a user typed, the parent would have to stored the text as well. Which would duplicate the state.
In the end it is simpler to have the controller own the state (the text) and allow both the parent and text field to change it and to read it.
For a ScrollController the situation is similar: both the scroll view and its parent might want the change the scroll position. And both might want to read it (surely the scroll view does).
Another advantage of the controller pattern is that the “parent” could be several widgets higher and you’d only have to pass a single controller through the intermediate widgets instead of several callbacks and several pieces of data.
I think this is because of 1st principal of S.O.L.I.D. which means single responsibility. Each object should be responsible for its own specific functionality. TextField serves text input, ListView serves item browsing nothing more. If you need some other (optional) data you need to ask someone other who responsible for it. Indeed, it is a controller.
From other side this approach gives some flexibility. You may change controller on runtime.
I am looking to add a label and image to a CellTable column, with following requisites:
- Label should be followed by an image.
- Click on the column (anywhere on label or image), toggles the image.
I am thinking of creating a custom widget containing an HorizontalPanel. Which in itself contains the Label and Image. Before putting substantial time on the same, just want an confirmation whether this approach is proper ?
No, you cannot put a widget in a CellTable. You will have to make a custom cell (extend AbstractCell) and generate HTML directly.
Take a look at GWT's implementation of different cells to see how they achieve clicking, etc. There are no nice ClickEvents, for example - you have to respond to the browser events directly.
To toggle an image you will have to re-draw the entire table, or use crazy javascript that you don't want to use.
I have a cell table that has several columns whose data may occasionally be wider than their column's width.
I have my css text-overflow set to ellipsis so it is obvious to the user that there is more to the cell's value when it exceeds the column's width.
With a "normal" widget, I would just use setTitle() to automatically display the full contents on mouse over, but the TextCell (and all other cell widgets) do not extend UiObject, so they do not have this method available.
A TextCell is implemented by a div within a td tag. Being able to set the title on either elements would give me the behavior I am looking for, but I cannot seem to find a way to get a handle on either of the elements.
What is the best way to get the HTML title behavior to work in a cell table widget?
Thanks,
Doug
you can write your own cell implementation and set the title in the html template yourself.
Take a look at a cell implementation. Basically they provide the html string for rendering.
Some of these kinds of issues have been "fixed" in GWT 2.3. But if you are stuck with using GWT 2.2, then writing your own cell implementation is the way to go.
I have a cellTable with 5-6 columns. I want to put a plus icon in each row on clicking of which will display the details maybe in a disclosure panel. I have been looking around for a while now and I cannot find any information on how to achieve this. Could someone point me in the right direction?
i suspect i probably have to add a cellTree to the column? how do i go about this?
Thank you for your response in advance.
There is work in progress to allow expandable rows in CellTable among other features (maybe GWT 2.3). You can see more details here:
http://groups.google.com/group/google-web-toolkit-contributors/browse_thread/thread/b4a8a6e3c98ac061#
If that is not enough or you can not wait untill it is released I can think of two ways to achieve it:
As you said, using a CellTree.
Creating a custom cell that stores
state (open/close). Depending on the
state the cell will render
differently. In same way it is
similar to how EditTextCell works, in
"edit" state it renders an input
field while in "normal" state it renders
simple text.
I'm trying to do that too ... I managed to mimic that functionality toying with the html and a custom cell class that allows clickable pictures.
It is working for normal content such as text but if you'd like to get an asynchronous data to show in the expended line, I don't know how to do it ... (I'm trying to do exactly that).
Also, it doesn't look good because the columns don't align well ...
So what I've done is:
- create a custom cell class to display a picture (right pointing triangle, looking like the triangle in the disclosure panel)
In the click event get the HTML code of the selected row and copy it. Replace the content of the row (all cells) in the table with only one cell with its colspan set to number of columns. In the cell, add a table with first line the copied row and second line the content to display as expanded.
Get the image to sink an event for closing. In event, reset the original row that we copied.
I hope it helps.
I'm really struggling with a choice between the GWT Tree widget, which has been a part of GWT for ages; or the new CellTree, which is introduced by GWT 2.1.
The tree I want to present to the user is not particularly large, but I am very concerned about responsiveness.
The data at the nodes of the tree will be editable. By clicking on a node, the user will put the node into edit mode. Editing the more simple nodes will require only a single TextBox or TextArea; but others will involve several widgets, over which I want styling control via CSS.
I'm attracted to the CellTree approach because it seems to offer great flexibility and speed; however, the sample code for CellTree editing deals with only very simple data types: string, date, integer, etc. I don't know if CellTree is appropriate when you've got more complex node-editing needs.
What do you think? Is CellTree the best approach? Does CellTree replace Tree in general? What heuristics can I apply in choosing between them?
I'm using a CellTable with several custom input Cells, including one comprised of many widgets. It works great!
It took me a couple of hours to understand how to implement a custom Cell that could do complex operations - since a single instance of the Cell will flit around the CellTree, pretending to be many instances, you need to understand how it's getting its data and when it is refreshed and rendered. I learned a lot from the source of the DatePickerCell.
I can't speak for CellTree, but the CellTable is very flexible, was easy to program, and saves me hundreds of Widget instances.
Using CellTree is problematic. Because it hasn't good access to view implementation stored in CellTree. It cause problem (ex. for me :D) in making custom handlers for opening nodes with children by clicking on whole parent cell. Of course you can make custom cells by AbstractCell, where you must write own renderer.
I think this widget must be enchanced and more objects must be more visible for users.
Customizing CSS is simple. All what you have to do is extende CellTree.resource and insert own css based on celltree.css class names.