GWT Java - 图像处理 - 使用 IUploader 显示新图像以替换现有图像

Question

我正在从数据库中获取徽章列表，显示带有描述的徽章图片并允许用户更改图片。当用户选择一张新图片时，它没有显示，我无法弄清楚为什么（日志中没有错误消息）。 IUploader 被触发，然后是 OnLoadPreloadedImageHandler。

如有任何帮助，我们将不胜感激。

相关代码为：

for (final Six sixDescription : sixList) {

            //Determine whether or not to display archived Six
            if ((showArchived.equals("Yes")) ||
                    ((showArchived.equals("No")) && (sixDescription.getSixArchived() == null))) {

                //Store the Six Primary Key.
                final String storeSixID = sixDescription.getSixId();

                // A panel where the thumbnails of upload images will be shown
                final HorizontalPanel existingPanelImages = new HorizontalPanel();

                //Increment the row index.
                row++;row++;

                //Allow update of a Six badge

                //Six replacement Picture Handler
                // Load the image in the document and in the case of success attach it to the viewer
                // Attach a replacement image to the pictures viewer
                final OnLoadPreloadedImageHandler showNewImage = new OnLoadPreloadedImageHandler() {
                    public void onLoad(PreloadedImage image) {
                        image.setWidth("75px");
                        existingPanelImages.clear();
                        existingPanelImages.add(image);
                        Window.alert("OnLoadPreloadedImageHandler");
                    }
                };

                final IUploader.OnFinishUploaderHandler onReplaceFinishUploaderHandler = new IUploader.OnFinishUploaderHandler() {
                    @SuppressWarnings("deprecation")
                    public void onFinish(IUploader uploader) {
                        if (uploader.getStatus() == Status.SUCCESS) {
                            new PreloadedImage(uploader.fileUrl(), showNewImage);

                            //The server sends useful information to the client by default
                            UploadedInfo info = uploader.getServerInfo();
                                            System.out.println("File name " + info.name);
                                            System.out.println("File content-type " + info.ctype);
                                            System.out.println("File size " + info.size);               

                            // You can send any customised message and parse it
                                            System.out.println("Server message " + info.message);
                            //Store path to image;
                            imagePath = info.message;

                            if (info.name != null) {
                                fileName.setText(info.name);
                            }
                            Window.alert("IUploader");
                        }
                    }
                };

                // Attach the image viewer to the document so we can get the Award image.
                //TODO Delete temporary image when finished.
                Window.alert("Existing");
                flexTable_Existing.setWidget(row, 0, existingPanelImages);
                existingPanelImages.setSize("75", "75");
                existingPanelImages.setBorderWidth(1);
                existingPanelImages.clear();
                existingPanelImages.setStyleName("gwt-TextBox");
                flexTable_Existing.getCellFormatter().setVerticalAlignment(row, 0, HasVerticalAlignment.ALIGN_TOP);
                flexTable_Existing.getCellFormatter().setHorizontalAlignment(row, 0, HasHorizontalAlignment.ALIGN_CENTER);

                //Display the current image.
                String imageDataString = sixDescription.getSixPicture();
                Image existingImage = new Image(imageDataString);
                existingImage.setWidth("75px");
                existingImage.setHeight("75px");
                existingImage.setStyleName("gwt-TextBox");
                flexTable_Existing.setWidget(row, 0, existingImage);


                // Create a new uploader panel and attach it to a document
                SingleUploader defaultUploader = new SingleUploader();
                defaultUploader.setAutoSubmit(true);
                defaultUploader.setValidExtensions("gif");
                defaultUploader.setEnabled(true);
                defaultUploader.avoidRepeatFiles(false);
                defaultUploader.setStyleName("gwt-TextBox");

                // Add a finish handler which will load the image once the upload finishes
                defaultUploader.addOnFinishUploadHandler(onReplaceFinishUploaderHandler);
                defaultUploader.getFileInput().getWidget().setStyleName("customButton");
                defaultUploader.getFileInput().getWidget().setSize("180px", "20px");

                row++;
                flexTable_Existing.setWidget(row, 0, defaultUploader);
                flexTable_Existing.getCellFormatter().setVerticalAlignment(row, 0, HasVerticalAlignment.ALIGN_MIDDLE);
                flexTable_Existing.getCellFormatter().setHorizontalAlignment(row, 0, HasHorizontalAlignment.ALIGN_LEFT);

                ////////////////////////////////////////////////////////////////////////////////


                row--;
                //Allow update of a Six Name
                final TextBox textBoxExistingSixName = new TextBox();
                textBoxExistingSixName.setStyleName("gwt-TextBox");
                textBoxExistingSixName.setText(sixDescription.getSixName());
                textBoxExistingSixName.setWidth("100px");
                flexTable_Existing.setWidget(row, 1, textBoxExistingSixName);
                flexTable_Existing.getCellFormatter().setVerticalAlignment(row, 1, HasVerticalAlignment.ALIGN_MIDDLE);
                flexTable_Existing.getCellFormatter().setHorizontalAlignment(row, 1, HasHorizontalAlignment.ALIGN_LEFT);

                //Allow update of an archive date for the Six
                final DateBox dateBoxExistingArchived = new DateBox();
                dateBoxExistingArchived.setFormat(new DefaultFormat(DateTimeFormat.getFormat("dd/MM/yyyy")));
                dateBoxExistingArchived.setStyleName("gwt-TextBox");
                dateBoxExistingArchived.setValue(sixDescription.getSixArchived());
                dateBoxExistingArchived.setWidth("100px");
                flexTable_Existing.setWidget(row, 2, dateBoxExistingArchived);
                flexTable_Existing.getCellFormatter().setVerticalAlignment(row, 2, HasVerticalAlignment.ALIGN_MIDDLE);
                flexTable_Existing.getCellFormatter().setHorizontalAlignment(row, 2, HasHorizontalAlignment.ALIGN_LEFT);
            }   
        }
    }

Answer 1

我已通过更改以下代码解决了我的问题：

//Six replacement Picture Handler
// Load the image in the document and in the case of success attach it to the viewer
// Attach a replacement image to the pictures viewer
final int currentRow = row+2;
final OnLoadPreloadedImageHandler showNewImage = new OnLoadPreloadedImageHandler() {
    public void onLoad(PreloadedImage existingImage) {
        image.setWidth("75px");
        existingPanelImages.clear();
        existingPanelImages.add(existingImage);
        flexTable_Existing.setWidget(currentRow, 0, existingPanelImages);
        existingPanelImages.setSize("75px", "75px");
        existingPanelImages.setBorderWidth(1);
        existingPanelImages.setStyleName("gwt-TextBox");
        flexTable_Existing.getCellFormatter().setVerticalAlignment(currentRow, 0, HasVerticalAlignment.ALIGN_TOP);
        flexTable_Existing.getCellFormatter().setHorizontalAlignment(currentRow, 0, HasHorizontalAlignment.ALIGN_CENTER);
    }
};

我现在遇到的问题是图像显示为全尺寸，而不是 75px x 75px。

我希望这对其他人有用。

此致，

格林

GWT Java - 图像处理 - 使用 IUploader 显示新图像以替换现有图像

GWT Java - Image handling - displaying a new image to replace an existing using IUploader

java

gwt