Auto Fit

The example and code below show what you need to add to one of your Blazor page components to implement auto-fit.

The AutoFit parameter is used to automatically adjust the column widths to fit the content. It only runs on the first render and does not update when the content changes.

The column widths are calculated with the process below:

  • Loop through the columns and find the biggest width of each cell of the column
  • Build the GridTemplateColumns string using the fr unit

This does not work when Virtualization is turned on. The GridTemplateColumns parameter is ignored when AutoFit is set to true. This is untested in MAUI.

Example

With auto-fit

Identity
Name
Birth date
Biography
10895Jean Martin1825-11-29Born on November 29, 1825, in Paris, France, is renowned as the founder of modern neurology.
10944António Langa1972-05-15Born on May 15, 1972, in Columbia, South Carolina, is a distinguished former professional basketball player.
11203Julie Smith1944-11-25Born on November 25, 1944, in Annapolis, Maryland, is an acclaimed American mystery writer celebrated for her rich storytelling.
11205Nur Sari1922-04-27Nur Sari is a fictional character known for her extraordinary contributions to the field of renewable energy.
11898Jose Hernandez1962-08-07Born on August 7, 1962, in French Camp, California, is a Mexican-American engineer.
12130Kenji Sato2004-01-09

Without auto-fit

Identity
Name
Birth date
Biography
10895Jean Martin1825-11-29Born on November 29, 1825, in Paris, France, is renowned as the founder of modern neurology.
10944António Langa1972-05-15Born on May 15, 1972, in Columbia, South Carolina, is a distinguished former professional basketball player.
11203Julie Smith1944-11-25Born on November 25, 1944, in Annapolis, Maryland, is an acclaimed American mystery writer celebrated for her rich storytelling.
11205Nur Sari1922-04-27Nur Sari is a fictional character known for her extraordinary contributions to the field of renewable energy.
11898Jose Hernandez1962-08-07Born on August 7, 1962, in French Camp, California, is a Mexican-American engineer.
12130Kenji Sato2004-01-09
Download: 
An error has occurred. This application may no longer respond until reloaded. Reload 🗙