Google Apps脚本ToggleButton用法

时间:2013-12-15 22:08:06

标签: google-apps-script

如何使用google-apps-script的ToggleButton?

toggleButton doc 解释了如何在事件处理程序中获取鼠标位置或各种修饰键状态等信息,但我仍然无法弄清楚最基本的 - 如何获取ToggleButton的状态,并使用它。

请帮助我完成以下示例,以便ToggleButton在向上计数或向下计数之间切换(到目前为止键入的字符,或允许剩余的字符数)。

var max = 124;

function doGet() {
  var app = UiApp.createApplication();
  var panel = app.createVerticalPanel(); 
  var text = app.createTextArea().setName("text");
  var handler = app.createServerHandler("count").addCallbackElement(panel);
  var toggleButton = app.createToggleButton('So far', 'Remaining').setId('btn');
  app.add(panel);
  panel.add(text);
  panel.add(toggleButton); //Add a UI Widget
  panel.add(app.createButton("Count", handler));
  panel.add(app.createLabel("0 characters").setId("label"));
  return app;
}

function count(e) {
  var app = UiApp.createApplication();
  // Because the text area was named "text" and added as a callback element to the
  // button's click event, we have its value available in eventInfo.parameter.text.
  var text;
  if (e.parameter.btn == true) {
    text = "counting up";
  } else {
    text = "counting down";
  }
  app.getElementById("label").setText(e.parameter.text.length + " characters, " + text);
  return app;
}

感谢Serge的回答。我仍然在努力使用它的一部分,因为我现在真的通过例子学习。我已将代码更改为您的代码,并添加了尝试使用它的努力。但是,每次单击“计数”按钮时,我都会看到文本长度发生变化,但是toggleButton的结果并未切换。

由于

1 个答案:

答案 0 :(得分:1)

奇怪的是,您可以使用ID获取值(通常我们必须使用小部件Name,如您所说)

我通过添加panel来修改您的代码以保存所有小部件,因此我只有一个callbackElement来分配给处理程序。 我在Logger.log中显示切换按钮的结果,因为我不知道最终目的,并且不想像什么想象代码; - )

注意: e.parameter.btn返回的值是布尔值的字符串表示:对于具有逻辑状态的窗口小部件,通常为“true”或“false”...

test code here with result shown

var max = 124;

function doGet() {
  var app = UiApp.createApplication();
  var panel = app.createVerticalPanel(); 
  var text = app.createTextArea().setName("text");
  var handler = app.createServerHandler("count").addCallbackElement(panel);
  var toggleButton = app.createToggleButton('So far', 'Remaining').setId('btn');
  app.add(panel);
  panel.add(text);
  panel.add(toggleButton); //Add a UI Widget
  panel.add(app.createButton("Count", handler));
  panel.add(app.createLabel("0 characters").setId("label"));
  return app;
}

function count(e) {
  var app = UiApp.createApplication();
  // Because the text area was named "text" and added as a callback element to the
  // button's click event, we have its value available in eventInfo.parameter.text.
  app.getElementById("label").setText(e.parameter.text.length + " characters");
  Logger.log(e.parameter.btn);
  return app;
}

编辑:这是您的代码已修改为可以正常工作(请注意e.parameter.btn值上的“”和新的处理程序触发器) - 更新了演示代码。

var max = 124;

function doGet() {
  var app = UiApp.createApplication();
  var panel = app.createVerticalPanel(); 
  var handler = app.createServerHandler("count").addCallbackElement(panel);
  var text = app.createTextArea().setName("text").setPixelSize(180,100).addKeyUpHandler(handler);
  var toggleButton = app.createToggleButton('So far', 'Remaining').setId('btn');
  app.add(panel);
  panel.add(text);
  panel.add(toggleButton); //Add a UI Widget
  panel.add(app.createLabel("0 characters").setId("label"));
  return app;
}

function count(e) {
  var app = UiApp.createApplication();
  var toggle = e.parameter.btn == "false";// this way I convert the string value in a "real" boolean
  if(toggle){
    app.getElementById("label").setText(e.parameter.text.length + " characters  (toggle btn = "+e.parameter.btn+')');
  }else{
    app.getElementById("label").setText(max-Number(e.parameter.text.length) + " characters  (toggle btn = "+e.parameter.btn+')');
  }  return app;
}