What is the expected behaviour of a shrinking scrollable Container?

Question

With Codename One components can change their size and this even can be animated, which is nice.

But what is the expected behaviour with shrinking Container instances, specifically if they are scrollable?

Having a Container, scrollable in the Y-axis and content that is smaller than the container the content sticks to the top. The container can be dragged and the content scrolls back to the top of the container. However, when the content shrinks and becomes smaller than the container the behaviour is - somewhat strange.

I have made an example - when the coloured components are tapped they expand. If tapped again they shrink. One can tap the green Label and it expands. Tapping it again it shrinks and everything is as of before.

However, if one taps a coloured label and scrolls any amount down before tapping it again to shrink it this is the resulting view:

Only if one then drags the scrolling container ever so lightly then the contant scrolls back to the top.

I assume this is a bug. Though I wonder - what should be the behaviour when the content shrinks beyond the scrolling containers size? Since the user might expect the component just tapped to remain where it was - can the scrolling behaviour be controlled somehow?

This is just an example but I want to build expandable "drawer" components.

Here is the code:

public class FormContentSmallerScrollableContainer extends Form {

    private class LabelExpandable extends Label {
        boolean expanded = false;
        LabelExpandable(String aTitle, int aColor) {
            super(aTitle);
            getAllStyles().setBgPainter((aGraphics, aRectangle) -> {
                aGraphics.setColor(aColor);
                aGraphics.fillRoundRect(getX(), getY(), aRectangle.getWidth() - 1, aRectangle.getHeight() - 1, 20, 20);
            });
            setOpaque(true);
        }

        @Override
        public void pointerReleased(int x, int y) {
            super.pointerReleased(x, y);
            expanded = !expanded;
            setShouldCalcPreferredSize(true);
            getParent().animateLayout(400);
        }

        @Override
        protected Dimension calcPreferredSize() {
            if (!expanded) {
                return super.calcPreferredSize();
            }
            Dimension dimension = super.calcPreferredSize();
            dimension.setHeight(Display.getInstance().getDisplayHeight());
            return dimension;
        }
    }

    public FormContentSmallerScrollableContainer() {
        super("FormContentSmallerScrollableContainer");
        setScrollable(false);
        setLayout(new BorderLayout());
        add(BorderLayout.NORTH, new Label("The container below is scrollable in the y-axis"));
        Container containerScrollable = BoxLayout.encloseY(
                new LabelExpandable("LabelExpandable green", 0x00ff00),
                new LabelExpandable("LabelExpandable blue", 0x00c0ff));
        containerScrollable.setScrollableY(true);
        add(BorderLayout.CENTER, containerScrollable);
        add(BorderLayout.SOUTH, new Label("The container above is scrollable in the y axis"));
    }

}

Shai Almog Shai Almog · Accepted Answer · 2019-06-07T04:30:23

This is a long standing behavior when we animate a scrollable area to what's effectively a non-scrollable area. We tried working around this in the past but couldn't find the right approach. You can file the issue on this but I'm not optimistic as it's really hard to even find a workaround for this.

What is the expected behaviour of a shrinking scrollable Container?

1 Answers