Question

我想我已经看到了这个答案，但我不记得在哪里可以肯定。

我正在尝试使用GUI Builder创建选项卡式面板界面，但是没有看到该选项。我似乎记得的部分是有人在GUI Builder中有一种复制方法。我似乎无法在我的大脑，旧谷歌团体或此处找到这些信息。

有人可以慢慢记忆吗？

谢谢...

Answer 1

也许您所指的帖子是this one ?无论如何，无论你有多少面板，你都可以在GUI中设计它们，一个在另一个之上或者（更简单地）一个在另一个之下一个“父”垂直面板，并与客户端处理程序一起显示/隐藏您需要的那个。我有一个示例here with 2 panels in an UI，UI是用脚本设计的，但这并不重要，请查看客户端处理程序以了解它是如何工作的。

如果今晚我有空闲时间，我将在GUI中制作4个面板的演示脚本; - ）。

编辑：此处为a test example（独立）或embedded in a Google site + link to the script（制作副本进行编辑）

请注意，在GUI构建器中，您必须“玩”以查看每个面板的可见性，我使用了一个足够大的主面板将2个面板放在一起，这样您就可以更好地实现小组之间的“和谐”（在我的测试中不是这种情况; - ））

和代码（非常简单的基本示例4面板，每个面板都是textBox＆amp; a Label，只是为了测试按钮上的处理程序）：

function doGet() {
  var app = UiApp.createApplication();

  var UI=app.loadComponent('multiUi')

  var panel1 = app.getElementById('panel1')
  var panel2 = app.getElementById('panel2')
  var panel3 = app.getElementById('panel3')
  var panel4 = app.getElementById('panel4')

  var Button1 = app.getElementById('Button1')
  var Button2 = app.getElementById('Button2')
  var Button3 = app.getElementById('Button3')
  var Button4 = app.getElementById('Button4')

  var pHandler1 = app.createClientHandler()
  .forTargets(panel1).setVisible(true).forTargets(panel2,panel3,panel4).setVisible(false)
  Button1.addClickHandler(pHandler1)

  var pHandler2 = app.createClientHandler()
  .forTargets(panel2).setVisible(true).forTargets(panel1,panel3,panel4).setVisible(false)
  Button2.addClickHandler(pHandler2)

  var pHandler3 = app.createClientHandler()
  .forTargets(panel3).setVisible(true).forTargets(panel2,panel1,panel4).setVisible(false)
  Button3.addClickHandler(pHandler3)

  var pHandler4 = app.createClientHandler()
  .forTargets(panel4).setVisible(true).forTargets(panel2,panel3,panel1).setVisible(false)
  Button4.addClickHandler(pHandler4)

  app.add(UI)
  return app;
}

Answer 2

以下代码根据您放入的数组动态生成标签：

function doGet() {
    // create application
    var app = UiApp.createApplication();

    // set array
    var aTabs = ['donald','katrijn','dagobert'];                                                         

    // create tab panel
    var pTab = app.createTabPanel();                                                

    // add tabs to panel
    for(var k=0; k<pTabs.length; k++) {
      pTab.add(app.createLabel("This tab is reserved for " +  aTabs[k]), aTabs[k]);
    } 

    // add panel to application 
    app.add(pTab); 

    // set focus to first tab                                                                                     
    pTab.selectTab(0);                                                                                   

    // return to application
    return app;
}

有关tabPanel参考，请参阅link。

将您的脚本发布为网络应用，允许您在Google网站上插入脚本。

在GUI Builder谷歌应用程序中复制选项卡面板

2 个答案: