GWT-Ext EditorGridPanel rendering problem - gwt

I am using GWT 1.6.4 and GWT-Ext 2.0.6. I am trying to use EditorGridPanel and facing rendering problems.
When the module loads I create a Panel (TopPanel) with BorderLayout and add that to the ViewPort. I then create another Panel (CenterPanel) and add EditorGridPanel, three buttons to the center of the BorderLayout Panel (TopPanel). I tried many layouts for CenterPanel but still not able to get what I want.
I want the table to showup with the required data and scrollbars. All the three buttons comes below the table. The data for the table come via Async call when the module loads, so when the screen is rendered to the user, the data is populated in the table. But looks like the table gets rendered with no data and when the async process finishes the table gets populated but don’t get resized to fit the screen so only show me one row.
The problem is with the Grid, I am not getting any scrollbars. Secondly I don’t want to define the height and width of the Grid. I want it to take as much as possible and show scrollbars, just like we do in html table by setting width and height as 100%.
Thanks

I have found the solution. I had to add the Grid on a panel. I had to set the layout of that panel to FitLayout(). Secondly had to call doLayout() on that panel after loading the Store with the data. I now get the scrollbars for the table as well as it fits the whole available space.

Related

Why does the same exact material-ui text field's height shrink in one spot and not another?

I am using the Material UI Text Field component as a search bar in my app. On one of the pages, I have it in 2 spots, one on the outside of the page, and another inside my DevExtreme Data Grid.
See here
For whatever reason, this shrinks the search bar, despite it being the exact same component being used in 2 spots.
My question is, what causes MUI to shrink the height of their text input field so that I can fix it accordingly inside of my data grid?
I've tried adjusting line-height, padding, margin's, etc all inside the data grid, unfortunately to no avail. The only thing I've noticed is that deep in the inspector tool, the shrunken search bar has a height of 1.435em, and checking that off will cause the search bar to correct itself to the standard height.

gwt visualization table, add scroll bar and width is no longer fitted

I am using the gwt visualization API. I use the Table widget and would like to specify the height using the setHeight() method.
When I put enough records, the vertical scroll bar shown up. The width of the table no longer fit the data after the scroll bar show up. The column labels are long records are forced to split to two lines:
How can I avoid it ?
(I don't want to fix the width of the table as the data is dynamic and I will add arbitrary columns also).
Ok, I'm not particularly familiar with the "gwt visualization API" but the the first solution which comes to mind, is that you always show the scroll bars and make the field a little bit bigger.
Her a little code example:
ScrollPanel sp = new ScrollPanel();
sp.setAlwaysShowScrollBars(true);
or if you are using UiBinder:
<g:ScrollPanel ui:field="scrollPanel" alwaysShowScrollBars="true">
You can also let a scroll panel appear in the bottom so your lines still appear in the bottom, but I don't thin that's what you want...
Regards,
Stefan

how to add a disclosure panel to a cellTable column in GWT

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.

Vertically add elements to a scrollview: diffs between Java and iPhone SDK?

Folks,
coming from the Java/Swing world, I am sometimes puzzled by the UI programming on the iPhone. I've spent the last hours with Googling for information but it seems that I asked the wrong questions by thinking too much in Java. Could you please point me to resources to get more familiar with the GUI concepts to be able to achive the following functionality:
Basically, I want to create a vertically scrollable view that represents structured text (for example, a recipe). Each step consists of a title and a textual description. As I want to fold and unfold such steps, the title would be somehow interactive and by clicking it the description would be displayed or hidden.
In Java, I would create a component that renders one such section. The layout manager would compute the components preferred height (with or without description being displayed).
Then, in Java, I would create a panel with a vertical layout manager and sequentially add my components. This panel would be placed in a scroll pane; the scroll pane would ask the panel to layout itself and then show a viewport on it, if for example the height is bigger than the scroll pane's height.
What Java provides me is:
layouting of elements (computing their preferred height and width), thus no need to deal with coordinates and dimensions
dynamic creation of UIs by creating and adding components during runtime
What I understood on the iPhone:
I can dynamically add views as subview to a view, e.g. a scrollview by calling addSubview
I can even remove that stuff using removeFromSubview (as explained here Clear content of UIScrollView)
What I don't understand on the iPhone:
does one view always correspond to a visible screen (I did use tab and navbar navigation so far and there whenever I set a new view, it fills the current visible screen minus the space needed for the two bars)?
or is it possible to define a view that contains a label on top ("north") and a text in center; if so, could such a view automatically determine its height?
can I realize my example in a similar way like in Java or would I need to calculate all dimensions and coordinates of the individual components on my own? (This example seems to touch on that topic: iPhone scrollView add elements dynamically with id)
Alternatively, could I use a WebView and render my stuff as local HTML using JavaScript to show or hide nodes?
Thanks for any hint or link!
There are no layout managers in Cocoa, views are being reposition according to their struts and springs settings. For information on that read the documentation: http://developer.apple.com/library/ios/#documentation/DeveloperTools/Conceptual/IB_UserGuide/Layout/Layout.html
To create a "view that contains a label on top and a text in center" you create a view with subviews - one being a label at the top, second the textview in center. If you configure struts/springs for all of subviews properly, they will autoresize when the container view is resized.
You should also get accustomed to Interface Builder, creating views in code is real pain in the ass.

How to set initial size of a TreeViewer?

I'm using a TreeViewer within a jface WizardPage and the initial input into the tree causes the WizardPage to grow vertically so that it can show all of the tree's values. When expanding one of the tree's values, then the vertical scrollbar works as expected. I'd like to be able to set the tree's size initially so that it is fixed and the scrollbar is already shown when the WizardPage is first drawn, but doing this isn't particularly obvious to me - the setSize method on the TreeViewer's Tree doesn't seem to do anything.
Any help would be appreciated!
Just for the records for this old question:
We solve this problem in our applications by using an own layout manager which we can set fixed sizes for certain controls (with Swing we had done that by using component.setPreferredSize(size)). If no such fixed size is used, we calculate the preferred size of the control while performing the layout. This prevents making controls getting more and more space depending on the control's content when the user resizes the application window or dialog.