Declined
Last Updated: 11 Jul 2022 14:36 by ADMIN
Kevin
Created on: 08 Jul 2022 10:33
Category: TreeList
Type: Bug Report
1
treelist locked autosize

Autosize on treelist with locked columns does not work

When the width of the grid exceeds the column lengths, you would expect autosize to expand and fill the rest of the space evenly.

https://stackblitz.com/edit/angular-7rxada-84kfzy?file=src/app/app.component.ts

Similar to https://github.com/telerik/kendo-angular/issues/3248

2 comments
ADMIN
Miroslav
Posted on: 11 Jul 2022 14:36

Hi Kevin,

Thanks for the provided information.

Before answering the main topic, I will shed some light on how the autoSize works:

  • The autoSize option sets the width of the column to their widths content, meaning that it is expected for a TreeList with autoSize set to true to have whitespace if the sum of all column widths is smaller than the actual TreeList width.
      • In this line of words for the autoSize option to work, the resizable option needs to be utilized in order for the TreeList to be resized as the developer sees fit.
      • This being said the provided StackBlitz demo is not working as expected as the Locked Columns option requires all columns to have a specified width and thats the reason why the autoSize is not working properly (which is to set the width of each column to their contents width)

    As the TreeList and Grid components have similarities in how their width behave, the following article in our Documentation describes in great aspect how the Column Width of the TreeList and Grid work in different scenarios:

    https://www.telerik.com/kendo-angular-ui/components/grid/columns/width/

    As the locked columns require the width of each column to be set explicitly, this behaviour is expected. In order for the columns to be spread across the whole Grid / TreeList while using locked columns, some CSS tweaks need to be made.

    I've created a short StackBlitz demo that demonstrates the CSS tweaks:

    https://stackblitz.com/edit/angular-9lgm9k-qk5plb?file=src%2Fapp%2Fapp.component.ts

    I hope this information helps.

    Regards,
    Miroslav
    Progress Telerik

    Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

    Kevin
    Posted on: 08 Jul 2022 10:34
    whoops, this should be changed to a bug