创建具有类似于 Bootstrap 的输入前缀功能的 Gmail 插件

Question

StackOverflow 社区您好，

我正在使用 Google Apps 脚本开发 Gmail 插件，并尝试实现与 Bootstrap 提供的输入组和前缀功能类似的功能。具体来说，我想向 Gmail 插件内的输入字段添加前缀（图标或文本）。

在 Bootstrap 中，我可以通过以下代码实现这一点：

<div class="input-group mb-3">
  <span class="input-group-text" id="basic-addon1">@</span>
  <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
</div>

我想在 Gmail 插件中复制这种前缀功能，用户可以在输入字段之前看到符号或文本，并且输入字段会相应地调整大小。 作为参考，这是我想要的功能，如 Google 表格中所示：(https://prnt.sc/u4cLB1DT4uNs)。 以下是卡服务中简单文字输入的代码。

代码。 GS

let widget = CardService.newTextInput().setTitle("Currency")

return CardService.newCardBuilder().addSection(CardService.newCardSection().addWidget(widget)).build()

我的问题是：

1. 是否可以使用 Google Apps 脚本在 Gmail 插件中实现这种输入前缀功能？

2. 如果是，实现这一点的一般方法是什么？ Google Apps 脚本是否提供了可用于在 Gmail 插件中创建输入前缀的特定方法或组件？

3. 在 Gmail 插件中实现此类功能时，我应该注意哪些限制或注意事项？

我非常感谢社区可以提供的任何见解、代码示例或指导。预先感谢您的帮助！

这是输入文本的代码。

最诚挚的问候， [莫辛]

Answer 1

如果我正确理解你的问题，你想在应用程序脚本中使用 Bootstrap 功能。 您仍然可以使用 Bootstrap，就像将 Bootstrap 添加到 html 代码中一样，只需在 .html 中的应用程序脚本中添加 Bootstrap cdn 即可。 否则你必须像在 html 中一样使用标签手动设置它的样式。

示例如下：

结果：