How to force a redraw/re-layout in Ext GWT (GXT)?

Question

In GXT, I've got a control with an important panel added to the bottom component, basically like this:

public class SamplePanel extends ContentPanel {

ContentPanel panel = new ContentPanel();    

public SamplePanel() {
    setBottomComponent(panel);
}

public void setVisible(boolean isVisible) {
    panel.setVisible(isVisible);
}

The panel is being set as the "bottom component" because it needs to stay at the bottom of the widget and viewable at all times.

The problem is, while the visibility of the panel toggles correctly, the 'bottom component' area doesn't resize to become smaller and fit the new dimensions of the bottom area.

However, I've noticed that the bottom area does resize when I manually change the size of the widget with the mouse.

Is there any way to programatically force a redraw/repaint/re-layout... anything to have the bottom component change to reflect the new size of its contents?

I've tried all of these and they don't work:

public void setVisibility(boolean isVisible) {
        panel.setVisible(isVisible);
        doLayout(true);
        recalculate();
        repaint();
    }

Thanks

Avan

Answer 1

In the last gxt you can do.

this.layout(true);

Otherwise you can fire an Events.Resize event.

Supportable

That fire resize event trick is so subtle, so hacky, so hidden but it so freaking works... – Narcosis

I know this is an old question but I've run into the a similar problem and I can't find any example of how to use the Event.Resize event. Do you have some code sample to include in your answer? Thanks in advance. – Burdick

@Burdick Here's an example: import com.extjs.gxt.ui.client.widget.LayoutContainer; import com.extjs.gxt.ui.client.widget.layout.BorderLayout; import com.extjs.gxt.ui.client.event.Events; LayoutContainer scriptEditor = new LayoutContainer(new BorderLayout()); scriptEditor.fireEvent(Events.Resize); The tricky part is remembering that Events.Resize can only be fired on certain Components...not com.google.gwt.user.client.ui.HTMLPanels for example. – Lactalbumin

Answer 2

I don't know about GXT, but in GWT I would use one of the force() or forceLayout() methods on my panel. Perhaps there is a similar API for doing that!

HTH.

Felske

Hmm... I can't seem to find a .force() or .forceLayout() method on ContentPanel (the superclass of this class I'm using). What class exposes .force()? – Avan

@Avan which version of GXT are you using? I am using GXT 4.0.2 and the ContentPanel class has the forceLayout() method. It worked for me using it. – Burdick

@vhbazan... i dunno, this was from 7 years ago. but if anyone is using 4.0.2 and that helps, then good deal – Avan

Answer 3

Have you tried using the setLayoutOnChange() method of the ConentPanel?

Precondemn

Answer 4

I would suggest looking at this: http://davidmaddison.blogspot.com/2008/12/gwt-rendering-process.html

What you can try to do is addListeners to the Panel and try calling panel.layout() there

Casablanca

Answer 5

This post claims that the top and bottom components to not participate in layout once the panel has been rendered and suggests a manual workaround (using RowLayout) or manually setting the size of the panel.

Consider finding the sizes from the parent and calling onResize(width, height)

Ampere