Search code examples
htmlcssgwtgxt

GXT MessageBox with scrollable content


I have to show a stacktrace using a GXT AlertMessageBox, and I would like to have a fixed-size box with the content being scrollable (at least vertically). Unfortunately I am not able to achieve that.

What I've done so far is the following :

  • use an @XTemplate like this

    @XTemplate(value = "<pre>{stacktrace}</pre>")
    SafeHtml render(String stacktrace);
    

    to render the stacktrace. Here <pre> is needed to retain the stacktrace format.

  • Use a GXT AlertMessageBox to render the template like this :

    MessageBox box = new AlertMessageBox("", "");
    box.setMessage(StacktraceTemplate.RENDERER.render(stackTrace).asString());
    box.setHeadingText("Stacktrace");
    box.setResize(false);
    box.setHeight(700);
    box.show();
    

It seems to me that I can either :

  • have the container resize itself to the size of the content (if I let box.setResize(true), which is the default anyway)
  • have the container truncate the stacktrace to the size I specify by box.setHeight()

I have already tried the following :

  • have the template declaring overflow: scroll; (i.e. @XTemplate(value = "<pre style='overflow: scroll;'>{stacktrace}</pre>") and also @XTemplate(value = "<div style='overflow: scroll;'><pre>{stacktrace}</pre></div>")). The result is that I see a disabled scrollbar, and the content is still truncated.
  • wrapping the SafeHtml resulting from the XTemplate in an HTML, and then adding it to a ScrollPanel. Then I added the scrollpanel as the box's message this way :

    ScrollPanel container = new ScrollPanel(content);
    container.setAlwaysShowScrollBars(true);
    HTMLPanel panel = new HTMLPanel("");
    panel.add(container.asWidget());
    MessageBox box = new MessageBox(SafeHtmlUtils.fromSafeConstant("<div>StackTrace</div>"),SafeHtmlUtils.fromTrustedString(panel.getElement().getInnerHTML()));
    // same setResize, setHeight, show as before
    

    but the result is the same (i.e. disabled scrollbar).

  • wrapping in a FlowLayoutContainer with getScrollSupport().setScrollMode(ScrollSupport.ScrollMode.ALWAYS);. Same result.

What should I do to have a fixed size MessageBox with scrollable content?


Solution

  • It turns out that I was quite near to a solution : the idea is to let the MessageBox adapt its size to the content, and then to fix the size of the ScrollPanel like this :

    HTML content = new HTML(StacktraceTemplate.RENDERER.render(stackTrace));
    ScrollPanel container = new ScrollPanel(content);
    container.setHeight("700px");
    HTMLPanel panel = new HTMLPanel("");
    panel.add(container.asWidget());
    MessageBox box = new AlertMessageBox(
        SafeHtmlUtils.fromSafeConstant("<div>StackTrace</div>").asString(),
        SafeHtmlUtils.fromTrustedString(panel.getElement().getInnerHTML()).asString());
    box.show();