小部件之间的Google App Script宽度

Question

我使用谷歌应用程序脚本来创建一个Web应用程序。您可以看到密码文本和密码文本框之间存在大量间距。我该如何调整间距？

这是我的代码：     function doGet（）{       var app = UiApp.createApplication（）;

  var mygrid = app.createGrid(2, 2);
  mygrid.setWidget(0, 0, app.createLabel('Incomplete Challenges').setStyleAttributes(css.Title));
  mygrid.setWidget(1, 0, app.createLabel('Password:').setStyleAttributes(css.Inputs));
  mygrid.setWidget(1, 1, app.createPasswordTextBox().setName("text"));

  var mybutton = app.createButton('Submit');

  var submitHandler = app.createServerClickHandler('getResults');
  submitHandler.addCallbackElement(mygrid);
  mybutton.addClickHandler(submitHandler);

  var mypanel = app.createVerticalPanel();
  mypanel.add(mygrid);
  mypanel.add(mybutton);
  app.add(mypanel);

  return app;
}

提前致谢。

还有一件事，我在另一个.gs文件中使用了一些CSS ......在这里它是：

var css={};
css.Title = { fontFamily:'Fantasy', fontSize:'24px', width: '250', marginTop:'5'};
css.Labels = { fontFamily:'Verdana', fontSize:'12px', width: '100', marginTop: '5'};
css.Inputs = { fontFamily:'Verdana', fontSize:'12px', width: '70'};
css.TextArea = { fontFamily:'Verdana', fontSize:'12px', width: '200', height: '50'};
css.PutBorder = {borderStyle: 'solid'};

Answer 1

网格是一个小部件，它在每行的列中保持相同的宽度。列中最宽的标签决定了此列的宽度，因此您得到的结果是合理的。

您可以简单地将第一个标签放在网格之外，如下所示：

function doGet(){
  var app = UiApp.createApplication();
  var mypanel = app.createVerticalPanel().setStyleAttributes(css.mypanel);
  var mygrid = app.createGrid(2, 2);
  mypanel.add(app.createLabel('Incomplete Challenges').setStyleAttributes(css.Title));
  mygrid.setWidget(0, 0, app.createLabel('Password:').setStyleAttributes(css.Inputs));
  mygrid.setWidget(0, 1, app.createPasswordTextBox().setName("text"));

  var mybutton = app.createButton('Submit');

  var submitHandler = app.createServerClickHandler('getResults');
  submitHandler.addCallbackElement(mygrid);
  mybutton.addClickHandler(submitHandler);

  mypanel.add(mygrid);
  mypanel.add(mybutton);
  app.add(mypanel);

  return app;
}

var css={};
css.mypanel = { padding : '25px'};
css.Title = { fontFamily:'Fantasy', fontSize:'24px', width: '250', marginTop:'5'};
css.Labels = { fontFamily:'Verdana', fontSize:'12px', width: '100', marginTop: '5'};
css.Inputs = { fontFamily:'Verdana', fontSize:'12px', width: '70'};
css.TextArea = { fontFamily:'Verdana', fontSize:'12px', width: '200', height: '50'};
css.PutBorder = {borderStyle: 'solid'}; 

结果：