I need to create a celltable with 100% width and I need a relative width column and another two with fixed width.
I am doing it in this way:
table.setWidth("100%", true);
table.setColumnWidth(checkBoxColumn, 50, Unit.PX);
table.setColumnWidth(nameColumn, 35.0, Unit.PCT);
table.setColumnWidth(emailColumn, 65.0, Unit.PCT);
as says in http://code.google.com/webtoolkit/doc/latest/DevGuideUiCellTable.html
In FF it runs ok, but in Google Chrome but I can't get it working.
This is what I am getting http://www.under-code.com/cap-celltable.png
How can I fix this? Is there anything that I am doing wrong?
From the screenshot of your DOM, I notice you have a table inside of a table. The upper most table having no width, and the inner most table having width 100%. I believe the upper most table having no width is what is giving you trouble here.
By any chance are you using a VerticalPanel to layout your CellTable? It's underlying implementation is a table which can cause this sort of wonkiness.
If so, you can try:
1: Using a FlowPanel, SimplePanel, or HTMLPanel instead. Their underlying implementations are divs, which as a block level element will expand to fill the entire width of their parent.
2: Apply width=100% to your VerticalPanel
Related
I have a simple grid. Two columns with a variable amount of rows. I want to make it so i have a header row with an arrow that can collapse and show the whole grid. So when I bring up the app, only the header row is visible with an arrow, and I can click to expand/collapse to show the rest of the grid.
A TreeGrid seems like overkill since I don’t need any hierarchical structure, just the ability to collapse/expand one row. I exclusively use IE and I’ve read that Drawyer doesnt work with IE 8 and above. I return a list of the objects and the object just has two string variables.
Any help with this? I am new to Vaadin 8.
Set grid height (workaround)
As a workaround, you could set the height to be approximately the number of pixels you expect to be the height of the header.
See the Sampler demo. Click the gear icon at top to expose properties of the example Grid object. The last property shown is "Size (W x H)". Change 100% to 100px to see the effect.
Grid height set to 100%
Grid height set to 100px
You can also hide the footer (see checkbox in that property list).
I don't think this can be done with plain Vaadin. But I recommend the following simpler approach:
Initially call grid.setHeightByRows(1.5) (javadoc). This will show exactly one row and a half to indicate more data is available. A scrollbar will appear, too.
Make a new column within the grid that has a button or add a button below the grid that - when clicked - calls setHeightByRows with the number of elements in the grid and hides the button. This will show all rows.
I Have a JTable (or a JXTable to be more precise) with 3 sections of grouped columns I want to divide.
I used to have 3 tables which i programmatically linked (the scrollbar position, the sorting, the selection). I used a lot of code to get this linked, and I want to get rid of this.
Now I Am switching to 1 JXTable, because there are some things a lot nicer in this table class.
I found some (not very satisfying) solutions to almost the same problem.
Maybe some one has a good suggestion for me.
Option 1: an empty column as a divider (another color, like gray) and programatically hop over this empty column when using the arrows or tab keys.
option 2: setting the margin for just 1 side of 1 column to a larger size, so it seems like a divider. Untill now I have only found out how to set the margins for all columns
option 3: getting back to 3 seperate tables again (especially to get the tables sorted in the same way is a lot of work, because I do not want to repeat the columns in the seperate sections). This means I have to rewrite my table sorter, sorting on a non-visible column.
any suggestion is welcome (also if it's none of the three given options)
I've made something that looks somewhat like what you're going for by overriding the cell renderer on the 3rd column to have a thick right border and no other borders. You could do the same within the table column header to have the border extend up through there. It's clearly placing the border within the cell but this may be sufficient for you.
{
....
table.getColumnModel().getColumn(2).setCellRenderer(
new ThickRightBorderCellRenderer());
....
}
private static class ThickRightBorderCellRenderer
extends DefaultTableCellRenderer {
#Override
public Border getBorder() {
return BorderFactory.createMatteBorder(0, 0, 0, 3, Color.BLACK);
}
}
I'm working in Java using the Vaadin framework.
I have a table with 14 columns. My problem is that that there's a small gap to the right of the last column, like the beginning of a new column that shouldn't be there..
The image shows the problem:
I've tried solving it with using column expand ratio on the last column, but this makes it abnormally big..
Do any of you know of a property you can use, CSS or Java, that makes the columns stretch over the entire width of the table without causing large column disproportion?
This is known issue, it was closed already Ticket #6677
If you set your table to fullsize that should probably close the "gap".
YourTable.setSizeFull();
I gues you ahve your table in a layout. Set this layout margin to false and also remove spacing.
This is a continuation of the problem here jtable to image conversion not happening properly, I have implemented the answers mentioned in the previous link.
I now see that the width of the table is always constant at 300, this is okay when the table height is small, for tables which are very long the tables become really thin and the image of this cannot be used for rendering at all.
The number of columns in most tables are constant to 4.
Please do let me know if there is anything that I can try here.
Set the size of the scroll pane instead.
pane.getViewport().setViewSize(300, 700)
I'm making an application that has many lines of data coming back from a Database stub(which will become an Oracle database), and for some reason the scroll bar stops at about the 500th element. I'm wondering if there's anyway to have all the elements show within the scroll bar.
I'm assuming here that you're using Windows, because there is a fairly general problem with scrollbars on Windows: the maximum value is a short int, 32,768. Therefore, if the height of the inner composite of a ScrolledComposite is greater than 32,768 pixels, the composite will be clipped.
I haven't found a robust way of fixing this, but there is a workaround: separate the scrollbar from the composite that you wish to scroll. You can't create a ScrollBar, but you can make a ScrolledComposite that is precisely as wide as a ScrollBar, then attach a ScrollListener to it and have it adjust the layout position of the scrolling composite.
Somewhere I have a snippet, but I'm not even exactly sure if this diagnosis applies to your scenario.
You might need to set the minimum and maximum values of the ScrollBar. You would use the setMinimum() and setMaximum() methods, respectively.
It's also a good idea to set the page increment. This is the number of scroll lines that the selected value changes by when the user clicks the area between the thumb and the arrow buttons, or presses the Page Up or Page Down buttons. You would use the setPageIncrement() method.
Finally, Oracle may impose a maximum number of rows you can retrieve from a table. I believe the default is 500 rows.