I have a Vaadin grid with 7 columns:
Grid grid = new Grid<>();
grid.setSizeFull();
grid.addColumn(User::getUserName).setCaption("Name").setExpandRatio(2);
grid.addColumn(User::getLastName).setCaption("Last Name").setExpandRatio(1);
grid.addColumn(User::getAge).setCaption("Age").setExpandRatio(2);
grid.addColumn(User::getWork).setCaption("Work").setExpandRatio(1);
grid.addColumn(User::getJobTitle).setCaption("Job Title").setExpandRatio(1);
grid.addColumn(User::getSalary).setCaption("Salary").setExpandRatio(1);
grid.addColumn(User::getOther).setCaption("Other").setExpandRatio(1);
What I need is to set columns width in a way - that all 7 will have be shown on a screen.
With my code now it works in a way that if text content of any column cell is very long - the last columns are not shown on the screen and screen must be scrolled horizontally.
I tried to use method setWidth() and as it takes value in pixels the grid view may differ on various browsers and screens.
What I need is to be sure that my grid looks the same way on different screens and with different cell values.
Recently I had the same situation, this was my solution:
Grid configuration
Grid<Item> gridItem = new Grid<>();
gridItem.setRowHeight(50.0);
Column configuration
gridItem.addComponentColumn(item -> {
Label label = new Label();
label.setValue(item.getText());
label.setWidthUndefined();
label.setStyleName(ValoTheme.LAYOUT_HORIZONTAL_WRAPPING);
return label;
})
.setCaption("Item")
.setWidth(380.0);
Result:
Related
I've been trying to make a 9x9 grid of textFields, where each textField is allocated to an element in a 2d array. For example the top left textField is field[0][0], the one right of that is field[1][0], and the bottom right textField is field[8][8].
So far I have
TextField[][] fields = new TextField[9][9]; {
for (Y=0;Y<9;Y++) {
XPosition=0;
for (X=0;X<9;X++) {
fields[X][Y] = new TextField(1);
fields[X][Y].setColumns(1);
fields[X][Y].setBounds(XPosition, YPosition ,32, 32);
frame.getContentPane().add(fields[X][Y]);
XPosition=XPosition+32;
}
YPosition = YPosition+32;
}
}
For some reason when I run the program, only the first 5 textFields in the top row get created. I have a feeling all the other textFields are placed under the visible ones. The frame is definitely big enough, and I can't figure out any issues with the code.
Use a grid layout : https://docs.oracle.com/javase/tutorial/uiswing/layout/grid.html
Absolute positioning is not reliable.
Adding
frame.getContentPane().setLayout(null);
has fixed the error
I'm trying to set a cell width in my LibGDX's table and it's ignoring the value I pass. I suspect it is because it's under rows that are fill and has colspan but I can't explain exactly why It is happenning.
Here's a screen:
I would like the cell of my play button to be smaller in width, so I wrote that code:
setDebug(true, true); //just mentionning, this is in the constructor of a class that extends Table, to prevent having table creation code on my screen
setWidth(400f);
setHeight(80f);
padLeft(30f);
padRight(30f);
Image image = new Image(assets.getTexture("gfx/menu/level-online.png")); //TODO icon depends on state
image.setScaling(Scaling.fill);
Button playButton = new TextButton(level.getType() == LevelType.RACE ? "Play" : "Visit", skin);
Button editButton = new TextButton("Edit", skin);
add(level.getName()).bottom().left().colspan(2).expand();
add(image).width(30f).height(30f);
row();
add(level.getOwner()).top().left().colspan(3).expand();
row();
add(playButton).width(40f).center(); //HERE
add(editButton).left().colspan(2);
As you can see, the width of the cell of the play button is supposed to be 40 but it's way more. (For reference, the cloud is 30 x 30) How can I fix this ?
Fixed it using a table in my last row to separate elements. Thanks to Xoppa and Tenfour04 for their help.
add(level.getName()).bottom().left().colspan(2).expand();
add(image).width(30f).height(30f);
row();
add(level.getOwner()).top().left().colspan(3).expand();
row();
Table buttons = new Table();
buttons.add(playButton).padRight(10f);
buttons.add(editButton);
add(buttons).expand().colspan(3).left();
I have some legacy code to fix and I'm struggling on the following:
I have 2 nested gridpanes. Inside the inner grid, text has to be added.
The column widths of both inner and outer grids are calculated relative to the screen size using following function:
private GridPane createGridPane( int []colsPercent, int []rowsPercent ) {
GridPane gridPane = new GridPane()
// setup columns
ColumnConstraints []colConst = new ColumnConstraints[colsPercent.length];
for( int i = 0 ; i < colsPercent.length ; i++ ) {
colConst[i] = new ColumnConstraints();
colConst[i].setPercentWidth(colsPercent[i]);
colConst[i].setFillWidth(true);
}
gridPane.getColumnConstraints().addAll(colConst);
// setup rows
RowConstraints []rowConst = new RowConstraints[rowsPercent.length];
for( int i = 0 ; i < rowsPercent.length ; i++ ) {
rowConst[i] = new RowConstraints();
rowConst[i].setPercentHeight(rowsPercent[i]);
rowConst[i].setFillHeight(true);
}
gridPane.getRowConstraints().addAll(rowConst);
return gridPane;
}
The grids and their contents are added by following code:
gridPane = createGridPane(colConstFeedbackScreenPercent,
rowConstFeedbackScreenPercent);
gridPane.setGridLinesVisible(true);
GridPane.setHgrow(gridPane, Priority.NEVER);
GridPane innerGridPane = createGridPane(colConstFeedbackInnerPercent,
rowConstFeedbackInnerPercent);
GridPane.setHgrow(innerGridPane, Priority.NEVER);
innerGridPane.setGridLinesVisible(true);
gridPane.add(innerGridPane, 1, 1);
If I add text to the inner gridPane, like so:
VBox vBox = new VBox();
vBox.setSpacing(25);
{
Text text = new Text(IRAPfx.getData().getOptionString("Localised text 6"));
text.setFont(Font.font("Arial",FontPosture.ITALIC,FONT_SIZE_INSTRUCTIONS));
text.setFill(Color.WHITE);
GridPane.setHgrow(text, Priority.NEVER);
vBox.getChildren().add(text);
}
...
GridPane.setHgrow(vBox, Priority.NEVER);
innerGridPane.add(vBox, 1, 1 + resultsCell );
The inner grid, and together with this inner grid the outer grid, will grow when the text string is too large to fit in its cell, resulting in the whole grid (inner and outer) being "stretched" to fit this long contents, and running over the right edge of the screen.
What I would like to archieve is that the long string runs over the outer grid, or even out of the screen if it is really long, but not stretching the whole grid.
As you can see in the code, I tried setting Hgrow to NEVER to no avail. Any suggestions how to fix it (I can't find examples or tips on the www..) would be very welcome.
Thanks in advance,
Joris
I found a partial solution to it:
You can clip or wrap the text to the available width of the cell by using 'label' in stead of 'text'. See below:
For wrapping:
{
Label label = new Label(IRAPfx.getData().getOptionString("Localised text 6"));
label.setFont(Font.font("Arial",FontPosture.ITALIC,FONT_SIZE_INSTRUCTIONS));
label.setWrapText(true);
label.setTextFill(Color.WHITE);
vBox.getChildren().add(label);
}
For clipping:
{
Label label = new Label(IRAPfx.getData().getOptionString("Localised text 6"));
label.setFont(Font.font("Arial",FontPosture.ITALIC,FONT
label.setTextOverrun(OverrunStyle.CLIP);
label.setTextFill(Color.WHITE);
vBox.getChildren().add(label);
}
This more or less solves my problem, however I still did not manage to let the text run over into the next columns (the ones to the right of the cell where the text/label is put).
Any help on that still welcome!
Have you tried the setWrappingWidth method on Text object, you can define a predefined with of this way, 200 in this case:
text.setWrappingWidth(200);
It isn't really clear to me why you have the Text elements inside a VBox before putting them into the GridPane. But you can do something like this:
vbox.maxWidthProperty().bind(innerGridPane.widthProperty().multiply(innerGridPane.getColumnConstraints().get(1).percentWidthProperty());
text.wrappingWidthProperty().bind(vbox.maxWidthProperty());
Unfortunately, you can't just get a GridPane column and get it's width property to bind it, so you have to recalculate it using the ColumnConstraints properties.
Any case where you need to have items dynamically change behaviours base on window sizes and so on, you'll need to bind the relevant properties together.
I'm developing a webapplication in the Vaadin framework.
I have a table with 14 columns. The last column holds three icons and a problem I'm having is that like half of the time the table is rendered the icon furthest to the right will be "cut in half" vertically. To avoid this problem I tried to set a fixed width to this column that I think would eradicate the problem, however, nothing happens..
I'm using the conventional approach:
simCardTable.setColumnWidth(actionColumn, 135);
However, no matter what value I set to be the column width the column stays the same... Does anyone know why this is? Is it because it's the last column to be added and therefore there's no space to spare..?
Btw, that is the only column I set a specific width to, all of the restoring columns have a the standard width specified by the width of the column header or the cell content.
Any help would be very appreciated!
As i understand from your question ("The last column holds three icons") you use ColumnGenerator to create this last column, with icons. If I right, it mean that you created some sort of custom layout with this icons inside, in this case for you should work this:
final ColumnGenerator generator = new ColumnGenerator() {
private static final long serialVersionUID = 1L;
#Override
public Component generateCell(Table source, final Object itemId, Object columnId) {
final HorizontalLayout layout = new HorizontalLayout();
layout.setSizeFull();
Embedded icon1 = new Embedded();
Embedded icon2 = new Embedded();
Embedded icon3 = new Embedded();
//Add some themeresource to embedded components
//Do some listners to this icons
layout.addComponent(icon1);
layout.addComponent(icon2);
layout.addComponent(icon3);
//Set column with
setColumnWidth(columnId, 100);
return layout;
}
};
I followed some tips in this guide: JTable with horizontal scrollbar but still having problems.
I have two column headers: Name and Description (for our purposes in this ex.)
I want to be able to scroll horizontally whenever an entry is added (ie: Name/Description is just 1 line). However, Swing doesn't seem to default to that behavior!
I have a JTable embedded in a ScrollPane. JScrollPane has the following parameters: JScrollPane.VERTICAL_SCROLLBAR_AS_NEEDED and JScrollPane.HORIZONTAL_SCROLLBAR_AS_NEEDED
If I disable with: myTable.AutoResizeMode(AUTO_RESIZE_OFF) the column headers don't fill up the whole table (maybe just 1/2 of the table). I have to manually resize the "Description" Column to see the whole thing.
How can I have autoresizing, but the horizontal scrolling still works?
You can extend JTable as follows:
public class JHorizontalFriendlyTable extends JTable {
#Override
public Dimension getPreferredSize() {
if (getParent () instanceof JViewport) {
if (
((JViewport) getParent()).getWidth() > super.getPreferredSize().width)
) {
return getMinimumSize();
}
}
return super.getPreferredSize();
}
#Override
public boolean getScrollableTracksViewportWidth () {
if (autoResizeMode != AUTO_RESIZE_OFF) {
if (getParent() instanceof JViewport) {
return (((JViewport) getParent()).getWidth() > getPreferredSize().width);
}
return true;
}
return false;
}
}
sample usage:
jScrollPane1 = new JScrollPane();
TableModel jTable1Model = new DefaultTableModel(...);
JTable jTable1 = new JHorizontalFriendlyTable();
jScrollPane1.setHorizontalScrollBarPolicy(ScrollPaneConstants.HORIZONTAL_SCROLLBAR_ALWAYS);
jScrollPane1.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_AS_NEEDED);
jScrollPane1.setViewPortView(jTable1);
jTable1.setModel(jTable1Model);
jTable1.setPreferredSize(new java.awt.Dimension(1051,518));
jTable1.setPreferredScrollableViewPortSize(new java.awt.Dimension(1000,528));
jTable1.getSize(new java.awt.Dimension(1051, 528));
if (jTable1.getPreferredScrollableViewPortSize().getWidth() >
((JViewPort) jTable1.getParent()).getPreferredSize().getWidth())
{
jTable1.setAutoResizeMode(JTable.AUTO_RESIZE_ALL_COLUMNS);
jTable1.doLayout();
}
jTable1.setDragEnabled(false);
jTable1.setColumnSelectionAllowed(false);
jTable1.getTableHeader().setReorderingAllowed(false);
Auto resize means automatically resizing to avoid scrolling.
So the answer is no with standard JTable.
Check out JXTable and see if it does what you want (I haven't used it myself).
One approach might be to use setAutoResizeMode(JTable.AUTO_RESIZE_ALL_COLUMNS) when you create the table and then use setPreferredScrollableViewportSize() to specify your desired size. After you pack() the window, use setAutoResizeMode(JTable.AUTO_RESIZE_OFF) to allow horizontal scrolling.
If I disable with:
myTable.AutoResizeMode(AUTO_RESIZE_OFF)
the column headers don't fill up the
whole table (maybe just 1/2 of the
table).
By default each column is only 75 pixels wide. You can change the width of the description column to be whatever you want. Read the JTable API and you will find a link to the Swing tutorial on "How to Use Tables" which explains how to do this.
However, even using this approach the column size will not change if the user resizes the frame. It you want to handle this situation then you need to add a ComponentListener to the table (or maybe the scroll pane). Then whenever the componentResized() method is fired you can total the widths of the two columns and then adjust the width of the description column as required to make sure the column total width is not less than the width of the table.
I have to manually resize the
"Description" Column to see the whole
thing.
If you know that your description column will always be large enough to fill the viewport of the scrollpane then you can use the Table Column Adjuster to automatically calculate the maximum width of the description column