Eclipse Community Forums: scout » Problems layouting buttons on form

Help

Home

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

Show: Today's Messages :: Show Polls :: Message Navigator

Problems layouting buttons on form [message #1058350]

Mon, 13 May 2013 15:54

Urs Beeli

Messages: 488
Registered: October 2012
Location: Bern, Switzerland

Senior Member

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 298 times)
Attachment: buttons_scout.png
(Size: 5.36KB, Downloaded 290 times)
Attachment: Buttons.png
(Size: 21.59KB, Downloaded 304 times)

Report message to a moderator

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

Mon, 13 May 2013 17:52

Jeremie Bresson

Messages: 1193
Registered: October 2011

Senior Member

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 275 times)

[Updated on: Mon, 13 May 2013 17:53]

Report message to a moderator

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

Tue, 14 May 2013 06:39

Urs Beeli

Messages: 488
Registered: October 2012
Location: Bern, Switzerland

Senior Member

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.

Report message to a moderator

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

Mon, 27 January 2014 13:03

Matt Collins

Messages: 7
Registered: January 2014

Junior Member

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

Report message to a moderator

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

Goto Forum:

-=] Back to Top [=-

[ Syndicate this forum (XML) ] [

]

Current Time: Mon Sep 26 10:43:22 GMT 2016

.:: Contact :: Home ::.