0

我使用 gwtupload 库来更改我的应用程序的上传视图。我想实现与此示例“使用可自定义按钮的单个上传器...”中的基本相同。因此我有一个自定义按钮类：

public class CostumButton extends Composite implements HasClickHandlers {
    DecoratorPanel widget;

    public CostumButton() {
      widget = new DecoratorPanel();
      initWidget(widget);
      widget.setStyleName("costum-Button");

      widget.setSize("100%","100%");

    }

    public HandlerRegistration addClickHandler(ClickHandler handler) {
      return addDomHandler(handler, ClickEvent.getType());
    }


  }

和 FileUploadFormImplDefault：

// new costum button
CostumButton button = new CostumButton();


// Create a FileUpload widget.
fileUpload = new SingleUploader(FileInputType.CUSTOM.with(button));

fileUpload.setTitle("costumFileUpload");

fileUpload.getWidget().setSize("100%", "50px");
RootPanel.get().add(fileUpload);

我的css文件：

.base-Button:active {
        position:relative;
        top:1px;
        border: none;
}

.costum-Button {
    cursor: pointer;
    background-color: green;
    background-image: url("resources/img/button_upload0.png");  
}

.custom-Button:hover {
    background-image: url("resources/img/button_upload0_hover.png");    
}

一切都加载了上传视图：

uploadForm = new FileUploadFormImplCostum(actionUrl);
add(uploadForm);

当我启动我的应用程序（在调试模式下）时，什么都没有显示。我尝试使用 chrome 调试模式对其进行调试，但我的服装形式没有任何证据。不太清楚为什么。谢谢任何帮助。

//编辑：修正了一些事情，知道我有我的自定义按钮和每个setAutoSubmit(true); 我禁用了“发送/提交”按钮。禁用工作正常，但它只是不可见，所以它在那里并占用空间，这是一个问题，因为我的上传者在另一个面板中并且知道我无法居中它，因为它位于提交按钮的中心。那么如何删除或重叠按钮。CSS？谢谢 ：）

4

1 回答 1

0

我解决了 Css 和位置的问题。

提示：如果将来有人想自定义 UploadForm，对于简单的单文件上传，将 clickHanderler 添加到新表单（图像、按钮等）上会更容易，它会在基本上传上执行元素点击形式。然后，您可以将基本表单放置在显示区域之外，或者将其设置在新的自定义 UploadForm 后面，然后使用 css 美化它。

gwtupload 框架非常好，但是对于这个简单的任务来说就太多了。对于带有动画等的多重文件上传，我可以推荐它:)

于 2014-02-21T07:11:20.633 回答