textArea growByContent doesnt work in layer layout

Question

I used layer layout to keep the title ie textArea on top of button image. But i cannot grow textArea size. Also the padding and margin on the textArea is not working as well.

            Image btnIcon = URLImage.createToStorage(placeholder, "homeIcon" + imageUrl, allUrl.globalHomeImageUrl + imageUrl, URLImage.RESIZE_SCALE);
            int width = placeholder.getWidth();
            int height = placeholder.getHeight();
            homeButton.setPreferredSize(new Dimension(width, height));
            homeButton.getAllStyles().setBgImage(btnIcon);

            TextArea buttonTitle = new TextArea(title);
            buttonTitle.setRows(1);
            buttonTitle.setUIID("smallLabel");
            buttonTitle.getAllStyles().setPadding(0, 0, 0, 0);
            buttonTitle.getAllStyles().setMargin(0, 4, 0, 4);
            buttonTitle.setPreferredW(screenWidth / 3 - 30);
            buttonTitle.setEditable(false);
            buttonTitle.setGrowByContent(true);
            buttonTitle.setIsScrollVisible(false);
            buttonTitle.setGrowLimit(2);
            Container container1 = new Container();
            container1.setUIID("buttonTitleContainer");
            container1.getAllStyles().setMargin(0, 5, 0, 0);
            container1.getAllStyles().setBgTransparency(0);
            container1.add(LayeredLayout.encloseIn(homeButton,     FlowLayout.encloseRightBottom(buttonTitle)));
            middleContainer.addComponent(BorderLayout.CENTER, container1);

How can i grow the textArea row as required and set the padding margin of the textarea.

Update: i commented setPreferredW() and added calcPreferredSize() to set the dimension but how can i set the height dynamically??

TextArea buttonTitle = new TextArea(title){

                        @Override
                        protected Dimension calcPreferredSize() {
                            Dimension d = new Dimension(screenWidth/3-10, 40);
                            return d; //To change body of generated methods, choose Tools | Templates.
                        }

                    };
                    buttonTitle.setUIID("smallLabel");
                    buttonTitle.getAllStyles().setAlignment(Label.LEFT);
                    buttonTitle.setRows(1);
                    buttonTitle.getAllStyles().setPadding(0, 0, 0, 0);
                    buttonTitle.getAllStyles().setMargin(0, 0, 0, 4);
//                    buttonTitle.setPreferredW(screenWidth / 3 - 30);
                    buttonTitle.setEditable(false);
                    buttonTitle.setGrowByContent(true);
                    buttonTitle.setIsScrollVisible(false);
                    buttonTitle.setGrowLimit(2);
                    buttonTitle.setScrollVisible(false);

the design is somewhat like below:

Current screenshot: As you can see, there is only one word displayed and the textArea always has only 1 row and doesnt grow

Shai Almog Shai Almog · Accepted Answer · 2016-03-08T04:25:12

The problem isn't in the LayeredLayout it's due to the fact that you called the deprecated setPreferredW.

Notice that setPreferredW also limits the height.

textArea growByContent doesnt work in layer layout

1 Answers