Results 1 to 2 of 2

Thread: How to add scrollbars to AbsolutePanel?

  1. #1
    Ext GWT Premium Member
    Join Date
    Jan 2009
    Franktown, CO

    Question How to add scrollbars to AbsolutePanel?

    In the following sample I need to add scroll bars to the AbsolutePanel (or find a different way to do this). See buildGridPanel's comments below for an explanation of what I'm trying to do, but in summary I need to have an internal panel that holds any number of conversation panels each of which can be resized and moved via DnD, that panel must have scroll bars because often not all contained conversation panels will be visible at once.

    Note I've removed other BorderLayoutContainer panels for clarity.

    public class Sample implements EntryPoint {
        private Resources resources;
        public void onModuleLoad() {
            resources = GWT.create(Resources.class);
            Viewport viewport = new Viewport();
            viewport.add(buildMainPanel(), new MarginData(10));
        private Widget buildMainPanel() {
            final BorderLayoutContainer con = new BorderLayoutContainer();
            con.setCenterWidget(buildGridAndBroadcastPanel(), new MarginData());
            SimpleContainer simple = new SimpleContainer();
            simple.add(con, new MarginData());
            return simple;
        private Widget buildGridPanel() {
            final BorderLayoutContainer gridContainer = new BorderLayoutContainer();
            AbsolutePanel con = buildAbsoluteConversationPanel();
            // This will be of varying size, but this is an example, this panel will hold any number of conversation panels
            // in a grid format.  If it is larger then the space allocated by the parent container and it most often will be
            // then it needs to have scroll bars.  Vertical scroll bars will be more common than Horizontal scroll bars.  Each
            // conversation panel contained by this panel may be of varying size but for each will be a multiple of the grid
            // size in both the vertical and horizontal direction, i.e. if the grid is configured to hold 200px x 200px conversation
            // panels, each contained conversation panel will be a multiple of 200px in size.
            con.setPixelSize(800, 1600);
            gridContainer.setCenterWidget(con, new MarginData(0));
            return gridContainer;
        private AbsolutePanel buildAbsoluteConversationPanel() {
            AbsolutePanel con = new AbsolutePanel();
            con.add(buildConversationPanel("#private", 200, 200, false), 5, 5);
            con.add(buildConversationPanel("bob", 200, 200, true), 210, 5);
            con.add(buildConversationPanel("#tom", 200, 400, true), 415, 5);
            con.add(buildConversationPanel("randy", 400, 400, true), 5, 205);
            return con;
        private ContentPanel buildConversationPanel(String title, int width, int height, boolean dragable) {
            // Need Window else not resizable...not sure why...method is still there.
            final Window window = new Window();
            window.setPixelSize(width, height);
    //        applyHeaderTools(window);
            final ListStore<String> listStore = new ListStore<String>(new ModelKeyProvider<String>() {
                public String getKey(String s) {
                    return null;
            final ListView<String, String> list = new ListView<String, String>(listStore, new ValueProvider<String, String>() {
                public String getValue(String s) {
                    return null;
                public void setValue(String s, String s1) {
                public String getPath() {
                    return null;
            VerticalLayoutContainer verticalLayoutContainer = new VerticalLayoutContainer();
            verticalLayoutContainer.insert(list, 0, new VerticalLayoutContainer.VerticalLayoutData(1, height - 60));
            final HBoxLayoutContainer sendLayoutContainer = new HBoxLayoutContainer();
            sendLayoutContainer.setPadding(new Padding(0));
            BoxLayoutContainer.BoxLayoutData flex = new BoxLayoutContainer.BoxLayoutData(new Margins(2));
            sendLayoutContainer.add(new TextField(), flex);
            BoxLayoutContainer.BoxLayoutData flex2 = new BoxLayoutContainer.BoxLayoutData(new Margins(2));
            sendLayoutContainer.add(new TextButton("Send"), flex2);
            verticalLayoutContainer.insert(sendLayoutContainer, 1, new VerticalLayoutContainer.VerticalLayoutData(1, 60));
            window.add(verticalLayoutContainer, new MarginData(0));
            if (dragable) {
                Draggable d = new Draggable(window);
            return window;

  2. #2
    Sencha User
    Join Date
    Jul 2011


    Check out my thread:

    I had the same question and found out how to do it.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts