bryntum / support

An issues-only repository for the Bryntum project management component suite which includes powerful Grid, Scheduler, Calendar, Kanban Task Board and Gantt chart components all built in pure JS / CSS / TypeScript
https://www.bryntum.com
54 stars 6 forks source link

[ANGULAR] Bug : Wrong size of the grid after hiding child column #3514

Open matsbryntse opened 3 years ago

matsbryntse commented 3 years ago

Forum post

Hello again,

You can reproduce the bug here https://bryntum.com/examples/grid/groupedheaders/. If you hide a child column in a grid with a horyzontal scroll (you can resize the columns to have the horyzontal scroll), the grid will be too wide of the size of the hidden column :

screenshot.png

Regards, Artbil screenshot.png

Screenshot 2021-10-06 at 17 17 11
ExtAnimal commented 3 years ago

There are two issues at work here.

What you see in the final image is that the "Food" header has been reduced to its minWidth which is defined in our code as 60:

            /**
             * Column minimal width. If value is Number then minimal width is in pixels
             * @config {Number|String} minWidth
             * @default 60
             * @category Layout
             */
            { name : 'minWidth', defaultValue : 60 },

I suggest that for grouped headers, they set their own minWidth to childCount * 60, or better, the sum of the minWidths of the children so that the children do not get crushed so small. Other than that, it's just what is confgured - the column is shrunk.

The other issue is that of flexed columns inside a grouped header. They are flexing inside the width of its owning group header. But we copy its flex value into its cells below, and they flex inside the width of the whole grid.

This second issue is fixed by https://github.com/bryntum/bryntum-suite/pull/3840