Scout Eclipse Neon two columns with fix width

Question

I have form and I want to have it organised in two columns. First is long and scrollable, and other need to always stays on right side. Second columns need to be small in width, so that it doesn't take too much screen space.

my code look like something like this :

@Order(1000.0)
public class MainBox extends AbstractGroupBox {

    @Override
    protected TriState getConfiguredScrollable() {

      return TriState.FALSE;
    }

    @Order(1000.0)
    public class OfferBox extends SxAbstractGroupBox {

      @Override
      protected TriState getConfiguredScrollable() {

        return TriState.TRUE;
      }

      @Override
      protected int getConfiguredGridColumnCount() {

        return 1;
      }

      @Override
      protected int getConfiguredGridX() {

        return 0;
      }

      @Override
      protected int getConfiguredGridY() {

        return 0;
      }

      @Override
      protected double getConfiguredGridWeightX() {

        return 1; // This should stretch this box 
      }
      ......
    }

    @Order(4000.0)
    public class ShortCutBox extends AbstractGroupBox {

      @Override
      protected TriState getConfiguredScrollable() {

        return TriState.TRUE;
      }

      @Override
      protected int getConfiguredGridColumnCount() {

         return 1;
      }

      @Override
      protected int getConfiguredGridX() {

         return 1;
      }

      @Override
      protected int getConfiguredGridY() {

         return 0;
      }

     @Override
     protected double getConfiguredGridWeightX() {

        return 0; // this defined that box shouldn't stretch
     }

     @Override
     protected int getConfiguredWidthInPixel() {

         return 200;  // This should give me fix width 200
     }

     @Order(4100)
     public class MyButton1 extends AbstractButton {

     }

     @Order(4200)
     public class MyButton2 extends AbstractButton {

     }
     ....
  }
}

But this configurations give a layout like this :

If I set buttons to have

@Override
protected int getConfiguredHorizontalAlignment() {

   return 1;
}

it looks right, but problem is that box still right box still extends over left one, so scroll and click on fields doesn't work on right side on the left panel. (inside black rectangle)

What am I missing?

mlu mlu · Accepted Answer · 2016-03-17T12:57:45

I just had a look at your problem, and I could build the layout I think you wanted to by doing the following:

1. I added the getConfiguredGridW() method, returning 1 to your two group boxes, to achieve, that each group box will span only over one column (parent group box has grid column count=2).

2. In addition, I removed the getConfiguredGridX() and the getConfiguredGridY() methods from both group boxes, because I think, they're not necessary as Scout orders them in that way automatically when the parent group box's getConfiguredGridColumnCount() returns 2 (or default).

3. This one's the important one: In every button, I override getConfiguredProcessButton() returning false (instead of true by default), as I experienced, that scout builds its grid layout in a different way, when declaring buttons as non-process buttons. The java doc also says:

Configures whether this button is a process button. Process buttons are typically displayed on a dedicated button bar at the bottom of a form. Non-process buttons can be placed anywhere on a form. Subclasses can override this method. Default is true.

4. This one's optional: Add getConfiguredFillHorizontal() and return true, so that all buttons in the right group box enlarge their width to the parent group box's width.

My whole arrangement looks like this:

@Order(1000.0)
public class MainBox extends AbstractGroupBox {

    @Override
    protected TriState getConfiguredScrollable() {

        return TriState.FALSE;
    }

    @Order(1000.0)
    public class OfferBox extends AbstractGroupBox {

        @Override
        protected TriState getConfiguredScrollable() {

            return TriState.TRUE;
        }

        @Override
        protected int getConfiguredGridColumnCount() {

            return 1;
        }

        @Override
        protected int getConfiguredGridW() {
            return 1;   // XXX: Added
        }

        /*
        // XXX: Removed
        @Override
        protected int getConfiguredGridX() {

            return 0;
        }

        @Override
        protected int getConfiguredGridY() {

            return 0;
        }
        */

        @Override
        protected double getConfiguredGridWeightX() {

            return 1; // This should stretch this box
        }

        @Override
        protected void injectFieldsInternal(OrderedCollection<IFormField> fields) {
            // Used to inject some dummy fields to enable scrolling
            for (int i = 0; i < 30; i++) {
                 // Add some fields here
            }
        }
    }

    @Order(4000.0)
    public class ShortCutBox extends AbstractGroupBox {

        @Override
        protected TriState getConfiguredScrollable() {

            return TriState.TRUE;
        }

        @Override
        protected int getConfiguredGridColumnCount() {

            return 1;
        }

        @Override
        protected int getConfiguredGridW() {
            return 1;   // XXX: Added
        }

        /*
        // XXX: Removed
        @Override
        protected int getConfiguredGridX() {

            return 1;
        }

        @Override
        protected int getConfiguredGridY() {

            return 0;
        }
        */

        @Override
        protected double getConfiguredGridWeightX() {

            return 0; // this defined that box shouldn't stretch
        }

        @Override
        protected int getConfiguredWidthInPixel() {

            return 200; // This should give me fix width 200
        }

        @Order(4100)
        public class MyButton1 extends AbstractButton {

            @Override
            protected String getConfiguredLabel() {
                return "Button 1";
            }

            @Override
            protected boolean getConfiguredProcessButton() {
                return false;   // XXX: Added
            }

            @Override
            protected boolean getConfiguredFillHorizontal() {
                return true; // XXX: This is optional
            }
        }

        @Order(4200)
        public class MyButton2 extends AbstractButton {

            @Override
            protected String getConfiguredLabel() {
                return "Button 2";
            }

            @Override
            protected boolean getConfiguredProcessButton() {
                return false;   // XXX: Added
            }

            @Override
            protected boolean getConfiguredFillHorizontal() {
                // XXX: This is optional. Enlarge buttons to group box width
                return true;
            }
        }
    }
}

The result: Final Layout, please ignore scrollbar-tooltip overlay ;)

Please let me know, if this works for you!

Best regards, Matthias

Scout Eclipse Neon two columns with fix width

1 Answers