How to center align a button using CardService?

115 Views Asked by At

I m trying to center align a button horizontally in my calendar addon plugin using google apps script but cannot find any property to do so for buttons.

So, before, we made it work by a hack, which involved adding another button in a disabled state and keeping whitespaces as its text.

This approach was effective previously, but due to some changes on the Apps Script side, buttons with whitespaces are now being displayed with a grey outline.

I attempted to find a way to remove the outline and also tried substituting the whitespaces with tabs and other similar characters, but I was unable to hide the outline.

Consequently, I tried to center-align the button itself like setTextAlignment but couldn't find any property to do so.

The outline beside the next button is the button with whitespace:

Below is my current code for the button that I m trying to center align

var whitespaces =
    "                        ";

  var blankButton = CardService.newTextButton()
    .setText(whitespaces)
    .setOnClickAction(action)
    .setDisabled(true);
  var blankbuttonSet = CardService.newButtonSet().addButton(blankButton);

  var button = CardService.newTextButton()
    .setText(translate("NEXT", selctlang))
    .setOnClickAction(action)
    .setTextButtonStyle(CardService.TextButtonStyle.FILLED);

  var buttonSet = CardService.newButtonSet()
    .addButton(blankButton)   // this is where blank button is being added
    .addButton(button);


  const cardSection1GridItem = CardService.newGridItem()
    .setTitle("Get started with APP")
    .setSubtitle("Please enter the Host ID  given by your service provider.")
    .setTextAlignment(CardService.HorizontalAlignment.CENTER)
    .setLayout(CardService.GridItemLayout.TEXT_BELOW);

  const cardSectionGrid = CardService.newGrid()
    .setNumColumns(1)
    .addItem(cardSection1GridItem);


  //   languagesection.addWidget(radioGroup);
  var section = CardService.newCardSection()
    .addWidget(image)
    .addWidget(textInput)
    .addWidget(buttonSet);

  var card = CardService.newCardBuilder().addSection(section);

  return card.build();
0

There are 0 best solutions below