Google apps script 如何集中元素google应用程序脚本UiApp

我正在创建一个带有图像的简单应用程序。我创建的应用程序如下所示：

function createApplication(){
  var app = UiApp.createApplication().setTitle("My Simple App");
  mainImage = app.createImage("URL TO IMAGE");
  app.add(mainImage);
  return(app);
}

这会将图像置于屏幕的左上角。有人能告诉我如何将图像居中吗

---

非常感谢

您可以使用

setStyleAttribute（）

并参考一些

举个例子（我不是CSS方面的专家，所以如果它不雅观，不要怪我；-）

注意：你也可以用像素代替%来定位你的图像，正如你所注意到的，我在一个电子表格用户界面中测试了这个

---

编辑：这是一个使用像素和Bryan对CSS样式的建议的版本，更加紧凑，语法接近原始CSS方法（再次使用thx）：

---

您可以使用谷歌驱动器链接到图像。确保图像在web上是公开的，并获取文档ID。如果要共享的链接类似于： https://docs.google.com/file/d/[docID]/edit？usp=共享

与图像的直接链接是 https://googledrive.com/host/[文件编号]/

或者，如果文件夹是公用的，ID为folderID，则可以使用

---

https://googledrive.com/host/[folderID]/myimage.gif

我刚刚找到了另一种很好的方法

默认情况下，面板会收缩以完全适合其内容。这很好，因为所有小部件都非常接近。所以我们在这里做的是，我们添加了一个fullPanel，它填充了整个浏览器区域。然后添加应用程序的主面板，并在其中放置所需的任何小部件

+--fullPanel-----------------+
|                            |
|                            |
|       +-mainPanel--+       |
|       |            |       |
|       |            |       |
|       +------------+       |
|                            |
|                            |
+----------------------------+

结果如何

• 主面板内的所有小部件都完全对齐
• 主面板始终位于中央

代码如下：

function createApplication(){
  var app = UiApp.createApplication().setTitle("My Simple App");

  /* Main application Panel */
  var mainPanel = myApp.createVerticalPanel();

  /* Add any widgets to this Panel */
  mainImage = app.createImage("URL TO IMAGE");
  mainPanel.add(mainImage);

  /* Create a panel that will fill all area of browser */
  var fullPanel = myApp.createVerticalPanel();
  fullPanel.setHeight('100%');
  fullPanel.setWidth('100%');
  fullPanel.setHorizontalAlignment(UiApp.HorizontalAlignment.CENTER);
  fullPanel.setVerticalAlignment(UiApp.VerticalAlignment.MIDDLE);
  fullPanel.add(mainPanel);

  app.add(fullPanel);
  return(app);
}

---

您还可以使用

.setStyleAttributes（_imgCSS）

一次，然后将

\u imgCSS={'position'：'relative'，'left'：'50%'，'top'：'50%}在函数外部@Serge-你知道为什么我们不能在
createImage（）
中使用Google Drive链接到图像文档吗？谢谢你的提示；-）--这是一个已知的问题，使图像在GDrive无法查看编辑：嗯，这个问题并不完全相关，但我不记得确切地在哪里我重新阅读的信息。。。sorryQuick one-这在Chrome中运行良好，但是当切换到IE时，没有任何内容。。。有办法解决这个问题吗？thanksIt在safari和firefox上工作，我在mac上，无法测试IE（坦率地说，我没有错过这一点；）
+--fullPanel-----------------+
|                            |
|                            |
|       +-mainPanel--+       |
|       |            |       |
|       |            |       |
|       +------------+       |
|                            |
|                            |
+----------------------------+

function createApplication(){
  var app = UiApp.createApplication().setTitle("My Simple App");

  /* Main application Panel */
  var mainPanel = myApp.createVerticalPanel();

  /* Add any widgets to this Panel */
  mainImage = app.createImage("URL TO IMAGE");
  mainPanel.add(mainImage);

  /* Create a panel that will fill all area of browser */
  var fullPanel = myApp.createVerticalPanel();
  fullPanel.setHeight('100%');
  fullPanel.setWidth('100%');
  fullPanel.setHorizontalAlignment(UiApp.HorizontalAlignment.CENTER);
  fullPanel.setVerticalAlignment(UiApp.VerticalAlignment.MIDDLE);
  fullPanel.add(mainPanel);

  app.add(fullPanel);
  return(app);
}