1

I think I've seen this answer, but I can't remember where for certain.

I'm trying to to create a tabbed panel interface using the GUI Builder, but don't see that option. The part I seem to recall is someone having an approach to replicate that in the GUI Builder. I just can't seem to find that information in my brain, the old google groups or here.

Can someone jog my memory?

Thank you...

4

2 回答 2

2

也许你指的是这个帖子?无论如何,无论您有多少面板,您都可以在 GUI 中设计它们,一个在另一个之上,或者(更简单地)在一个“父”垂直面板中一个在另一个之上,并使用客户端处理程序来显示/隐藏一个你需要的。我在这里有一个 UI 中有 2 个面板的示例,UI 是用脚本设计的,但这并不重要,请查看客户端处理程序以了解它是如何工作的。

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

编辑:这是一个测试示例(独立)或嵌入到谷歌网站+脚本链接(复制编辑)

请注意,在 GUI 构建器中,您必须“玩”每个面板的可见性才能对其进行操作,我使用了一个足够大的主面板来将 2 个面板放在一起,这样您就可以更好地了解面板之间的“和谐”(在我的测试中不是这种情况;-))

和代码(非常简单的基本示例 4 个面板,每个面板都有一个文本框和一个标签,只是为了测试按钮上的处理程序):

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;
}
于 2012-07-26T13:02:42.897 回答
0

以下代码根据您输入的数组动态生成选项卡:

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 参考。

将脚本发布为网络应用程序,允许您将脚本插入谷歌网站。

于 2012-08-19T15:36:07.540 回答