Change in component as button click reaction

Hi,
Could somebody try this snippet code and tell me what I have to do to get the central label changed when I hit the button?

Thanks!

import com.vaadin.Application;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Window;

public class Test1 extends Application {
	
	Label middle;	
	Window mainWindow;
	
	public void init() {		
		Label top = new Label("Top");
		middle = new Label("Middle");
		Button bottom = new Button("Click!", new Button.ClickListener() {
            public void buttonClick(ClickEvent event) {
            	mainWindow.showNotification("Clicked!");
            	middle = new Label("Why I didn't change?");
            	middle.requestRepaint();
            }
        });
		
		VerticalLayout mainLayout = new VerticalLayout();
			mainLayout.addComponent(top);				
			mainLayout.addComponent(middle);
			mainLayout.addComponent(bottom);						
										
		mainWindow = new Window();
			mainWindow.setContent(mainLayout);

		setMainWindow(mainWindow);
	}		
	
}

Your button’s click listener replaces the value of “middle” with a new label but doesn’t update it in the mainLayout.

Try something like this:


import com.vaadin.Application;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Window;

public class Test1 extends Application {
    
    Label middle;    
    Window mainWindow;
    VerticalLayout mainLayout;
    
    public void init() {        
        Label top = new Label("Top");
        middle = new Label("Middle");
        Button bottom = new Button("Click!", new Button.ClickListener() {
            public void buttonClick(ClickEvent event) {
                mainWindow.showNotification("Clicked!");
                Label newMiddle = new Label("I change now!!");
                mainLayout.replaceComponent(middle, newMiddle);
                middle = newMiddle;
            }
        });
        
       mainLayout = new VerticalLayout();
            mainLayout.addComponent(top);                
            mainLayout.addComponent(middle);
            mainLayout.addComponent(bottom);                        
                                        
        mainWindow = new Window();
        mainWindow.setContent(mainLayout);

        setMainWindow(mainWindow);
    }        
    
}

It works great!