Search code examples
user-interfacegoogle-sheetsgoogle-apps-script

Sheet button ui formatting


We are doing sheet and we encode the data. I would like to have a button that will format the range of the cell for

eg: when I click the button the sheet will create its own borders, colors, filters and etc.

Sample Sheet SampletSheet

I only have this code to start with:

function formatSheet(){
  let sheet = SpreadsheetApp.getActiveSpreadsheet();

  let headers = sheet.getRange('A1:G1');
  let table = sheet.getDataRange();

  headers.setFontWeight('bold');
  headers.setFontColor('white');
  headers.setBackground('#52489C');

  table.setFontFamily('Roboto');
  table.setHorizontalAlignment('center');
  table.setBorder(true, true, true, true, true, true, '#52489C', SpreadsheetApp.BorderStyle.SOLID);
}  

I want to make have buttons that will auto format the sheets for me and button to remove all of the formatting.


Solution

  • By using Drawing or using getUi()

    To create a custom button theres 2 ways on how to create.

    First one is by using Drawing:

    Custom Drawing

    After you draw the shape and putting a text just click assign script.

    Assign your custom Function

    Second is using SpreadsheetApp.getUi():

    let ui = SpreadsheetApp.getUi();
    
      ui.createMenu('Custom Menu').addItem('Format Headers', 'formatSheet').addToUi();
    

    See image below:

    get.Ui Custom Menu

    Reference: