Eclipse Community Forums: Eclipse Scout » Problems layouting buttons on form

Home » Eclipse Projects » Eclipse Scout » Problems layouting buttons on form(Unable to resize or place)

Problems layouting buttons on form [message #1058350]

Mon, 13 May 2013 11:54

Eclipse User

I'm trying to put together a form that should contain buttons arranged as the following screenshot (taken from today's implementation) shows.
index.php/fa/14772/0/

However, I've miserably failed in either placing or sizing the buttons:
index.php/fa/14773/0/

Trying to make sure it is not the complexity of the form on which I want to place them, I've created a new dummy form to test sizing and placement. I can succesfully size StringFields and place them as required (in a 2x2 matrix). However, using the same code for Buttons just does not work.
index.php/fa/14774/0/

I assume this is something to do with how Scout implements these buttons. What do I need to do to allow resizable (or fix-sizable really) buttons? What do I need to do so that buttons arrange themselves in a GroupBox instead of just being clipped or - even worse - outside the visible part of the group box?

The following code was used to generate the third image:

String fields (works):

    @Order(20.0)
    public class StringBox extends AbstractGroupBox {
      @Override
      protected int getConfiguredGridColumnCount() {
        return 2;
      }

      @Override
      protected String getConfiguredLabel() {
        return TEXTS.get("StringBox");
      }

      private abstract class AbstractTestStringField extends AbstractStringField {
        public static final int STRING_FIELD_SIZE = 50;

        @Override
        protected boolean getConfiguredFillHorizontal() {
          return false;
        }

        @Override
        protected int getConfiguredLabelWidthInPixel() {
          return STRING_FIELD_SIZE;
        }

        @Override
        protected int getConfiguredWidthInPixel() {
          return 3 * STRING_FIELD_SIZE;
        }
      }

      @Order(10.0)
      public class FirstField extends AbstractTestStringField {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("First");
        }
      }

      @Order(20.0)
      public class SecondField extends AbstractTestStringField {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Second");
        }
      }

      @Order(30.0)
      public class ThirdField extends AbstractTestStringField {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Third");
        }
      }

      @Order(40.0)
      public class FourthField extends AbstractTestStringField {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Fourth");
        }
      }
    }

Button fields (doesn't work):

    @Order(10.0)
    public class ButtonBox extends AbstractGroupBox {
      @Override
      protected int getConfiguredGridColumnCount() {
        return 2;
      }

      @Override
      protected String getConfiguredLabel() {
        return TEXTS.get("ButtonBox");
      }

      private abstract class AbstractTestButton extends AbstractButton {
        public static final int BUTTON_SIZE = 25;

        @Override
        protected boolean getConfiguredFillHorizontal() {
          return false;
        }

        @Override
        protected int getConfiguredLabelWidthInPixel() {
          return 0;
        }

        @Override
        protected int getConfiguredWidthInPixel() {
          return BUTTON_SIZE;
        }

        @Override
        protected boolean getConfiguredGridUseUiWidth() {
          return true;
        }
      }

      @Order(10.0)
      public class OneButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("One");
        }
      }

      @Order(20.0)
      public class TwoButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Two");
        }
      }

      @Order(30.0)
      public class ThreeButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Three");
        }
      }

      @Order(40.0)
      public class FourButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Four");
        }
      }
    }

I have tried adding the following to the four buttons:

        @Override
        protected int getConfiguredGridX() {
          return ?; // ?=0 for button 1 and 3, ?=1 for button 2 and 4
        }

        @Override
        protected int getConfiguredGridY() {
          return ?;  // ?=0 for button 1 and 2, ?=1 for button 3 and 4
        }

but that didn't make any difference (I can use these two methods to place the string fields in any position I want (independent of the @Order annotation, but the buttons ignore it).

I've also tried returning false in getConfiguredGridUseUiWidth() for the buttons. This has the effect that they are now huge, but still ignore any width returned from getConfiguredWidthInPixel().

Attachment: buttons_nets.png
(Size: 3.45KB, Downloaded 786 times)
Attachment: buttons_scout.png
(Size: 5.36KB, Downloaded 748 times)
Attachment: Buttons.png
(Size: 21.59KB, Downloaded 804 times)

Re: Problems layouting buttons on form [message #1058366 is a reply to message #1058350]

Mon, 13 May 2013 13:52

Eclipse User

I think the property you are looking for is ProcessButton: This property influences where the button will be located. If true (default) the button will ignore the other Layout properties (because process buttons are often placed on the bottom of a form or of a group box). If set to false, the button will behave as any other form-field. I think you just need to set this property to false to take control of the button position.

Here your example:
index.php/fa/14776/0/

    @Order(10.0)
    public class ButtonBox extends AbstractGroupBox {
      @Override
      protected int getConfiguredGridColumnCount() {
        return 2;
      }

      @Override
      protected String getConfiguredLabel() {
        return TEXTS.get("ButtonBox");
      }

      private abstract class AbstractTestButton extends AbstractButton {
        public static final int BUTTON_SIZE = 150;

        @Override
        protected boolean getConfiguredFillHorizontal() {
          return false;
        }

        @Override
        protected int getConfiguredLabelWidthInPixel() {
          return 0;
        }

        @Override
        protected int getConfiguredWidthInPixel() {
          return BUTTON_SIZE;
        }

        @Override
        protected boolean getConfiguredGridUseUiWidth() {
          return true;
        }

        @Override
        protected boolean getConfiguredProcessButton() {
          return false;
        }
      }

      @Order(10.0)
      public class OneButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("One");
        }
      }

      @Order(20.0)
      public class TwoButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Two");
        }
      }

      @Order(30.0)
      public class ThreeButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Three");
        }
      }

      @Order(40.0)
      public class FourButton extends AbstractTestButton {
        @Override
        protected String getConfiguredLabel() {
          return TEXTS.get("Four");
        }
      }
    }

I just added the getConfiguredProcessButton() in the AbstractTestButton class (I also modified BUTTON_SIZE in order to see something).

I hope this helps.

Attachment: ButtonBox.PNG
(Size: 2.75KB, Downloaded 713 times)

[Updated on: Mon, 13 May 2013 13:53] by Moderator

Re: Problems layouting buttons on form [message #1058440 is a reply to message #1058366]

Tue, 14 May 2013 02:39

Eclipse User

Jeremie Bresson wrote on Mon, 13 May 2013 19:52

I think the property you are looking for is ProcessButton: This property influences where the button will be located. If true (default) the button will ignore the other Layout properties (because process buttons are often placed on the bottom of a form or of a group box). If set to false, the button will behave as any other form-field. I think you just need to set this property to false to take control of the button position.
    @Order(10.0)
        @Override
        protected boolean getConfiguredProcessButton() {
          return false;
        }
I hope this helps.

Thank you, this is exactly what I had been looking for.

Re: Problems layouting buttons on form [message #1236538 is a reply to message #1058440]

Mon, 27 January 2014 08:03

Eclipse User

Thank you, Jeremie and Urs! It's exactly what I needed.

You know, I've been a programmer for 30 years. It's not the big conceptual things that trip me up when I'm learning something new. It's these little things.

Thanks again.

Matt

Previous Topic:	XML validation with XSD
Next Topic:	Aligning Fields in a Scout Form

Goto Forum:

-=] Back to Top [=-

Current Time: Tue Jul 08 01:23:34 EDT 2025

.:: Contact :: Home ::.

Breadcrumbs

Sign up to our Newsletter