图像在加工完成后加载并在此之后保留

Question

我的代码如下。它将接受来自输入文本的数据;那么它将在谷歌电子表格中从stackoverflow（基于输入）中获取最新的最新Feed。

我有（想）设置一个外部gif图像显示为一个进度指示器，同时获取RSS馈送和其处理正在进行。

问题是：当我删除评论部分;那个gif图像将永远不会被用户看到，并且当它保留为注释时;该过程完成后，该应用程序正在加载该gif图像，并在之后保留。

我希望它只在进程（获取rss和处理它）时才可见。那么有什么办法可以做到吗？

function stackoverflow(){ 
    var app =UiApp.createApplication().setHeight(380).setWidth(800); 
    app.setTitle("Enter tag name"); 
    var mydoc=SpreadsheetApp.getActiveSpreadsheet();  
    var txtBox = app.createTextBox().setFocus(true).setWidth("150").setId("ticker").setName("ticker"); 
    var mainpanel = app.createHorizontalPanel().setId('mainpanel'); 
    mainpanel.add(txtBox); 
    var subbtn = app.createButton("Get posts!").setId("tick").setWidth("80"); 
    mainpanel.add(subbtn); 
    var myloadingimg=app.createImage("http://schedule.msu.edu/img/InProgress.gif").setHeight("26").setWidth("26").setId("loadingimg"); 
    mainpanel.add(myloadingimg.setVisible(false)); 
    app.add(mainpanel); 
    var panel = app.createVerticalPanel().setId('panel');  
    var submitHandler = app.createServerHandler("clicker").addCallbackElement(mainpanel); 
    subbtn.addClickHandler(submitHandler); 
    app.add(panel); 
    mydoc.show(app); 
} 
function clicker(e){ 
    var app = UiApp.getActiveApplication(); 
    var txtBox = app.getElementById("ticker"); 
    app.getElementById("loadingimg").setVisible(true); 
    var panel=app.getElementById("panel"); 
    app.remove(1); 
    var panel = app.createVerticalPanel().setId('panel');  
    var stackurl = "http://stackoverflow.com/feeds/tag?tagnames="+e.parameter.ticker+"&sort=newest"; 
    var stackXML = UrlFetchApp.fetch(stackurl).getContentText(); 
    var stackDOC = Xml.parse(stackXML, false); 
    var stackentry = stackDOC.getElement().getElements('entry'); 

    for (var i = 0; i < stackentry.length; i++) {  
     var result = stackentry[i]; 
     panel.add(app.createHTML("<br><b>Post Title: </b>"+ result.getElement('title').getText()+"<br>")); 
     panel.add(app.createAnchor('', '') .setText("Post URL").setHref(result.getElement('link').getAttribute('href').getValue()));  
     panel.add(app.createHTML("<br>")); 
     } 

    var scroll = app.createScrollPanel().setPixelSize(760, 280); 
    scroll.add(panel); 
    app.add(scroll); 
    //app.getElementById("loadingimg").setVisible(false); 
    return app; 
} 

function onOpen() 
{ 
    var ss = SpreadsheetApp.getActiveSpreadsheet(); 
    var menuEntries = []; 
    menuEntries.push({name:'stackoverflow',functionName:'stackoverflow'}); 
    ss.addMenu("f2", menuEntries); 
} 

Answer 1

你可以使用clientHandlers，这是专门用于这种情况。

function stackoverflow(){ 
    ... 
    var clientHandler = app.createClientHandler().forTargets(myloadingimg).setVisible(true); 
    var submitHandler = app.createServerHandler("clicker").addCallbackElement(mainpanel); 
    subbtn.addClickHandler(submitHandler).addClickHandler(clientHandler); 
    ... 
} 
function clicker(e){ 
    var app = UiApp.getActiveApplication(); 
    .... 
    app.getElementById("loadingimg").setVisible(false); 
    return app; 
}