Embed ProgressBar inside ListGrid cell, progress bar overlaps on the next cells

[zhanghuancs]

Test version: Version SNAPSHOT_v9.1d_2014-01-14 (2014-01-14)

We embed ProgressBar component inside ListGrid cell using createRecordComponent.

We do not set width for each list grid column, instead, we use SmartClient autoFitWidthApproach, autoFitFieldWidths, autoFitExpandField, autoFitFieldsFillViewport to auto size the column width.

We find that the progress bar component will overlay on top of the next cells, which makes the other cells hidden behind.

Attached is a standalone jsp page, which can be used as a test case.

Note, this does not happen if I change smartclient version back to Version v9.0p_2013-07-15 (2013-07-15). See attached images.

It should have two possibilities:
1) If we define the progress bar length, the column width should be automatically set to be larger or equal to progress bar width, so that the progress bar can be embedded inside the cell;
2) Or if we do not define the progress bar length, the progress bar width should be just 100% percent to the width of the cell which contains this progress bar

Another question is for the SmartClient auto fit column width approach, which seems not appropriate. Why the first column takes so much space, while the other columns group together. Each column should be evenly distributed. I wonder if I'm using the wrong attributes or there is some way to work around this issue. (test it with full screen size)
The four attributes we are using are:

autoFitFieldsFillViewport: true,
autoFitWidthApproach: "both",
autoFitFieldWidths: true,
autoFitExpandField: "name",

Thanks.

[Isomorphic]

Setting the progress bar column to autoFit doesn't make sense. You are telling the field to autoFit to the progressBar and the progressBar to autoFit to the field, so how big should it be?

Set either the progressBar or field to a fixed pixel width to correct the issue.

[zhanghuancs]

Setting the progress bar column to autoFit doesn't make sense. You are telling the field to autoFit to the progressBar and the progressBar to autoFit to the field, so how big should it be?

Set either the progressBar or field to a fixed pixel width to correct the issue.

The issue is not only for the progress bar width.

The attached test case did set the progress bar length to 200. The issue is it overlays on top of the previous column in the
Version SNAPSHOT_v9.1d_2014-01-14 (2014-01-14)

[Isomorphic]

Sorry, we misspoke - you will need to actually set a width on the field rather than trying to get the field to auto-size to the progressBar. Setting *just* a value on the Progressbar isn't enough.

Once you set a value on the field, the issue disappears.

[zhanghuancs]

Sorry, we misspoke - you will need to actually set a width on the field rather than trying to get the field to auto-size to the progressBar. Setting *just* a value on the Progressbar isn't enough.

Once you set a value on the field, the issue disappears.

Got it. Because in the old version, setting progress bar length is enough.

I updated my code to set the field width on progress bar column.

The other question is when SmartClient handle the auto fit width, why the first column will take that much of space, instead of evenly distributed the column? How can achieve this?

Thanks.

[Isomorphic]

In the old version, these settings would still produce an issue if only the progressBar's size was set.

Evenly distributed field widths is what you get if you disable auto-fitting, so it seems like what you want is to just remove the setting you added?

We'd recommend revisiting the docs for the settings you are using - they are doing exactly what they say they will, and perhaps what you actually want is just to enable auto-fitting on specific fields (via listGridField.autoFitWidth).

[zhanghuancs]

In the old version, these settings would still produce an issue if only the progressBar's size was set.

Evenly distributed field widths is what you get if you disable auto-fitting, so it seems like what you want is to just remove the setting you added?

We'd recommend revisiting the docs for the settings you are using - they are doing exactly what they say they will, and perhaps what you actually want is just to enable auto-fitting on specific fields (via listGridField.autoFitWidth).

Got it. Thanks.