0

私は、GUIなしでSergeInsasによってこの例を複製しようとしています。

var vPanel = app.createVerticalPanel();
vPanel.add(createGrid(1,1).setId(grid1);
vPanel.add(createGrid(1,1).setId(grid2);
var handler0 = app.createClientHandler()
   .forTargets(grid1).setVisible(true)
   .forTargets(grid2).setVisible(false);
 var handler1 = app.createClientHandler()
   .forTargets(grid1).setVisible(false)
   .forTargets(grid2).setVisible(true);

ハンドラーは可視性を適切に設定します。

例とは異なり、grid2は上に揃えるのではなく、非表示のgrid1の下に配置されます。トップに正当化するにはどうすればよいですか？

注：これは、Chrome、Firefox、Explorerがトップに正当化する場合にのみ当てはまります。

ありがとう、

スコット

編集：完全なコードが追加されました

    function doGet(e) {
//create app
var app = UiApp.createApplication().setTitle('testCrawl');

// create components
var searchPanel = app.createVerticalPanel().setId('searchPanel').setWidth('100%');
var searchMenu = app.createMenuBar().setId('searchMenu').setWidth('100%');
var searchGrid = app.createVerticalPanel().setId('searchGrid').setWidth('100%')
                    .setHeight('100px').setVisible(false)
                    .setStyleAttribute("border","2px solid #C0C0C0")
var basicGrid = app.createGrid(1,1).setId('basicGrid').setWidth('100%').setVisible(false)
                basicGrid.setWidget(0,0, app.createLabel('Basic'));
var advancedGrid = app.createGrid(1,1).setId('advancedGrid').setWidth('100%').setVisible(false);
                advancedGrid.setWidget(0,0, app.createLabel('Advanced'));
var mapGrid = app.createGrid(1,1).setId('mapGrid').setWidth('100%').setVisible(false);
     mapGrid.setWidget(0,0, app.createLabel('Map'));
var archiveGrid = app.createGrid(1,1).setId('archiveGrid').setWidth('100%').setVisible(false);
      archiveGrid.setWidget(0,0, app.createLabel('Archive'));
var emailCartGrid = app.createGrid(1,1).setId('emailCartGrid').setWidth('100%').setVisible(false);
      emailCartGrid.setWidget(0,0, app.createLabel('EmailCart'));
var hideGrid = app.createGrid(1,1).setId('hideGrid').setWidth('100%').setVisible(false);


// add menu and grid
app.add(searchPanel);
searchPanel.add(searchMenu);
searchPanel.add(searchGrid);
searchGrid.add(basicGrid)
          .add(advancedGrid)
          .add(mapGrid)
          .add(archiveGrid)
          .add(emailCartGrid)
          .add(hideGrid);

// client handler
var handler0 = app.createClientHandler()
  .forTargets(searchGrid, basicGrid).setVisible(true)
  .forTargets(advancedGrid, mapGrid, archiveGrid, emailCartGrid,hideGrid).setVisible(false);
var hanlder1 = app.createClientHandler()
  .forTargets(searchGrid, advancedGrid).setVisible(true)
  .forTargets(basicGrid, mapGrid, archiveGrid, emailCartGrid,hideGrid).setVisible(false);
var handler2 = app.createClientHandler()
  .forTargets(searchGrid, mapGrid).setVisible(true)
  .forTargets(basicGrid, advancedGrid, archiveGrid, emailCartGrid,hideGrid).setVisible(false);
var handler3 = app.createClientHandler()
  .forTargets(searchGrid, archiveGrid).setVisible(true)
  .forTargets(basicGrid, advancedGrid, mapGrid, emailCartGrid,hideGrid).setVisible(false);
var handler4 = app.createClientHandler()
  .forTargets(searchGrid, emailCartGrid).setVisible(true)
  .forTargets(basicGrid, advancedGrid, mapGrid, archiveGrid,hideGrid).setVisible(false);
var handler5 = app.createClientHandler()
  .forTargets(searchGrid).setVisible(false);


// Create Menu Items
var menuItem0 = app.createMenuItem('Search', handler0);
var menuItem1 = app.createMenuItem('Advanced', hanlder1);
var menuItem2 = app.createMenuItem('Map', handler2);
var menuItem3 = app.createMenuItem('Archive', handler3);
var menuItem4 = app.createMenuItem('Email Cart', handler4);
var menuItem5 = app.createMenuItem('Hide', handler5).setId('hide');



//create menuItem separators
var separator0 = app.createMenuItemSeparator();
var separator1 = app.createMenuItemSeparator();
var separator2 = app.createMenuItemSeparator();
var separator3 = app.createMenuItemSeparator();
var separator4 = app.createMenuItemSeparator();
var separator5 = app.createMenuItemSeparator();
var separator6 = app.createMenuItemSeparator();

//Add the menu item separators and menuItem to the MenuBar
searchMenu.addSeparator(separator0).addItem(menuItem0).addSeparator(separator1)
  .addItem(menuItem1).addSeparator(separator2)
  .addItem(menuItem2).addSeparator(separator3)
  .addItem(menuItem3).addSeparator(separator4)
  .addItem(menuItem4).addSeparator(separator5)
  .addItem(menuItem5).addSeparator(separator6);

return app;

}
4

1 に答える 1

0

私はあなたのコードを試しました-それをテスト可能にするための開発です-そしてあなたが言及した問題は見当たりません...（Chromeでテストされました）あなたのテストコード全体を投稿していただけませんか？

一方、垂直パネルに2つのグリッドを使用して使用した（ここにデプロイされた）テストコードは次のとおりです。

function doGet() {
var app = UiApp.createApplication()
  var vPanel = app.createVerticalPanel().setStyleAttribute('background', 'beige');
  var grid1 = app.createGrid(1,1).setId('grid1');
  var grid2 = app.createGrid(1,1).setId('grid2').setVisible(false);
vPanel.add(grid1.setText(0, 0, 'grid1'));
vPanel.add(grid2.setText(0, 0, 'grid2'));
var handler0 = app.createClientHandler()
   .forTargets(grid1).setVisible(true)
   .forTargets(grid2).setVisible(false);
 var handler1 = app.createClientHandler()
   .forTargets(grid1).setVisible(false)
   .forTargets(grid2).setVisible(true);
   grid2.addClickHandler(handler0)
   grid1.addClickHandler(handler1)
app.add(vPanel)   
return app
}

編集：代わりに垂直パネルで境界線と高さのパラメータを設定すると、配置は変更されなくなります。ただし、グリッドはデフォルトで高さ全体を使用するため、選択した値で（1）ラベルが中央に表示されます...グリッド内により多くのセルが表示されるため、問題は自然に解消されます。これが私が変更したスクリプトの一部です：

function doGet(e) {
//create app
var app = UiApp.createApplication().setTitle('testCrawl');

// create components
var searchPanel = app.createVerticalPanel().setId('searchPanel').setWidth('100%').setHeight('100px')
                    .setStyleAttribute("border","2px solid #C0C0C0")
var searchMenu = app.createMenuBar().setId('searchMenu').setWidth('100%');
var searchGrid = app.createVerticalPanel().setId('searchGrid').setWidth('100%')
                    .setVisible(false)
于 2012-11-17T09:46:10.917 に答える