Question

我有一个包含几个组件的简单portlet：3 Button个对象，1 Slider，1 MenuBar和分配给Label的图片（由servlet生成）。现在，当我在Label的图片之间切换时（我有更多的图片），我希望将图片Label放置在旧图片Label对象的位置：

我的图片Label位于portlet的左下角。当我选择另一张图片Button新图片MenuBar时，Slider个对象，Label和Label位于图片Label下在其他组件下绘制（在Button对象下，MenuBar，Slider），因此Button个对象...位于顶部且图片Label位于portlet的底部

例如，我通过选择菜单中的颜色来更改图片Label的背景：

newItem1.addItem("Blue",new Command(){
    public void menuSelected(MenuItem selectedItem){
        if(pictureA.isVisible()){
            pictureB.setVisible(false);
            pictureC.setVisible(false);
            window.removeComponent(pictureA);
            pictureA= new Label("<img src=http://localhost:8888/portlet/KiviatDiagramm?background=blue", Label.CONTENT_XHTML);
            window.addComponent(pictureA);
        } else {
            window.showNotification("", Notification.TYPE_WARNING_MESSAGE);

        }
    }
});

更新：

我已经从Label对象切换到嵌入式图像（Embedded）（这好多了）我试图用新颜色重新分配Embedded对象上的资源但是它不起作用，这就是我所做的：

public void init() {

    URL PictureAUrl= null;
    try {
        pictureAUrl= new URL("http://localhost:8888/portlet/pictureA");
    } catch (MalformedURLException e) {
        e.printStackTrace();
    }
    URL PictureBUrl= null;
    try {
        pictureAUrl= new URL("http://localhost:8888/portlet/pictureB");
    } catch (MalformedURLException e) {
        e.printStackTrace();
    }
    URL pictureCUrl= null;
    try {
        pictureCUrl= new URL("http://localhost:8888/portlet/pictureC");
    } catch (MalformedURLException e) {
        e.printStackTrace();
    }
    final Embedded pictureA = new Embedded("", new ExternalResource(pictureAURL));
    pictureA .setType(Embedded.TYPE_IMAGE);
    final Embedded pictureB = new Embedded("", new ExternalResource(pictureBURL));
    pictureB .setType(Embedded.TYPE_IMAGE);
    final Embedded pictureC = new Embedded("", new ExternalResource(pictureCURL));
    pictureC .setType(Embedded.TYPE_IMAGE);


    newItem.addItem("ColorBlue", new Command(){
            public void menuSelected(MenuItem selectedItem) {
                if(!pictureA.equals(pictureB )){

        Resource newPictureResource = new ExternalResource("http://localhost:8888/portlet/pictureA?background=blue");
        newPictureResource.setType(Embedded.TYPE_IMAGE);
        pictureA.setResource(newPictureResource);

                }
                else {
                    window.showNotification("Please select pictureA");
                }
        }
   });

Answer 1

rickthomas是正确的，你应该使用replaceComponent方法。我很确定这里的主要问题是，在删除图片之后，你调用addComponent（pictureA），它实际上将组件添加到组件列表的末尾。如果你没有引用旧图片并且它是第一个组件，那么你可以使用它：

window.replaceComponent(window.getComponentIterator().next(), newPicture);

除此之外，您不必编写HTML来显示图像。您可以使用Embedded。

如果图像在您的类路径中，您可以使用以下内容：

Embedded newPicture = new Embedded("", new ClassResource("my-picture.png", myApplication));
newPicture.setType(Embedded.TYPE_IMAGE);
window.replaceComponent(oldPicture, newPicture);

如果在其他地方找到它们，请使用：

URL url = new URL("http://localhost:8888/portlet/KiviatDiagramm?background=blue");
Embedded newPicture = new Embedded("", new ExternalResource(url));
newPicture.setType(Embedded.TYPE_IMAGE);
window.replaceComponent(oldPicture, newPicture);

这可能会解决您的问题。

Answer 2

查看Vaadin API javadoc，

我发现了这个

public void replaceComponent(Component oldComponent,Component newComponent)

我没有测试过它......但它应该可以工作。

组件位置（Vaadin）

2 个答案: