Header width

Header width

Posted by: baloghbencefacebook on 11 November 2021, 12:32 am EST

• 

  baloghbencefacebook

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 11 November 2021, 12:32 am EST

  Is it possible to make headers in a table fit to width but all other cells word wrap?

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 12 November 2021, 4:41 am EST

  Hi,

  For this, you may calculate the table header width and set the column width according to that length. Please refer to the following code snippet and the attached sample that explains the same.

  
   document.getElementById("btn").addEventListener("click", () => {
      /*traverse the table header cells */
      for (let i = 1; i < 5; i++) {
        /* set the width of the column according table header width */
        sheet.setColumnWidth(
          i,
          getTextlength(sheet.getValue(1, i), sheet.getActualStyle(1, i).font)
        );
      }
    });
  }
  
  function getTextlength(text, font) {
    let context = document.createElement("canvas").getContext("2d");
    context.font = font;
    /*return the text width + width of filter dialog icon*/
    return Math.ceil(context.measureText(text).width) + 22;
  }
  
  
  

  sample: https://codesandbox.io/s/blazing-tree-qredu?file=/src/index.js
  
  Regards
  
  Avinash