我在从 native 脚本调用 java 时遇到问题。我传递了我想要的名为 imagesPanel 的实例作为参数,知道该实例实现了 ImageHolder。 Window.alert() 就在调用被调用之前,但调用从未发生。

有什么我忘记做的事情吗?

/** 
 * Used this link as a model: http://blog.revathskumar.com/2012/04/html5-show-thumbnail-preview-of-image.html 
 *  
 * http://www.gwtapps.com/doc/html/com.google.gwt.doc.DeveloperGuide.JavaScriptNativeInterface.JavaFromJavaScript.html 
 *  
 * FIXME check file size too and eventually add a forbidden icon:  http://www.sanwebe.com/2013/10/check-input-file-size-before-submit-file-api-jquery 
 * @param fileUpload 
 * @param imagesPanel 
 * @return 
 */ 
protected native String initiateFilesInput(Element fileUpload, UploadItemWidget imagesPanel)/*-{ 
    fileUpload.children[0].children[0].addEventListener("change", 
            fileUpload.addEventListener("change", function(e) { 
                showThumbnail(fileUpload.children[0].children[0].files, 
                        imagesPanel); 
            }, false)); 
 
    $entry(function showThumbnail(files, imagesPanel) { 
        for (var i = 0; i < files.length; i++) { 
            var file = files[i] 
            var image = $doc.createElement("img"); 
            image.file = file; 
 
            var reader = new FileReader(); 
            reader.onload = (function(img) { 
                return function(e) { 
                    img.src = e.target.result; 
                    $wnd.alert('check =' + img); 
                    imagesPanel.@fr.onevu.vume.client.common.widget.fileUpload.ImageHolder::addImage(Lcom/google/gwt/dom/client/Element;)(img); 
                }; 
            }(image)); 
 
            var ret = reader.readAsDataURL(file); 
        } 
    }) 
}-*/; 
 
@Override 
public void addImage(Element image) { 
    System.out.println( "adding "+ image); 
    panel.getElement().appendChild(image); 
} 

这是接口(interface)代码

import com.google.gwt.dom.client.Element; 
 
public interface ImageHolder { 
 
    void addImage(Element image); 
} 

请您参考如下方法:

在进行一些更改后,它对我来说工作正常。

  • 删除所有children[0].children[0]

  • 删除$entry()

<小时 />

完整代码:

public static native String initiateFilesInput(Element fileUpload, UploadItemWidget imagesPanel)/*-{ 
    fileUpload.addEventListener("change", fileUpload.addEventListener( 
            "change", function(e) { 
                showThumbnail(fileUpload.files, imagesPanel); 
            }, false)); 
 
    function showThumbnail(files, imagesPanel) { 
 
        for ( var i = 0; i < files.length; i++) { 
            var file = files[i] 
            var image = $doc.createElement("img"); 
            image.file = file; 
 
            var reader = new FileReader(); 
            reader.onload = (function(img) { 
                return function(e) { 
                    img.src = e.target.result; 
 
                    imagesPanel.@fr.onevu.vume.client.common.widget.fileUpload.ImageHolder::addImage(Lcom/google/gwt/dom/client/Element;)(img); 
                }; 
            }(image)); 
 
            var ret = reader.readAsDataURL(file); 
        } 
    } 
}-*/; 
<小时 />

您的原始帖子中缺少部分代码。请验证。

public class ImageHolder implements UploadItemWidget { 
 
    public SimplePanel panel = new SimplePanel(); 
 
    public FileUpload fileUpload = new FileUpload(); 
 
    public ImageHolder() { 
        panel.add(fileUpload); 
    } 
    ... 
} 

入口点类

public void onModuleLoad() { 
 
    ImageHolder imageHolder = new ImageHolder(); 
    RootPanel.get().add(imageHolder.panel); 
 
    ImageHolder.initiateFilesInput(imageHolder.fileUpload.getElement(), imageHolder); 
} 

屏幕截图:(已选择3张图片)


评论关闭
IT虾米网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!