VerticalGroup does not let ScrollPane to scroll

[rami-alisawi]

From documentation: "A VerticalGroup (code) is equivalent to a Table with only a single column, but is more lightweight." But this is not the case, hence, I have created this issue.

Very easy to reproduce:

VerticalGroup mainVG = new VerticalGroup();
mainVG.setFillParent(true);
mainVG.addActor(container);
stage.addActor(mainVG);

I have tried scrollPane.setHeight() , it did not work the VG does not allow it's child to set own hight. I have tried to wrap the scrollPane with Container, did not have effect.

Now the same exact code but replace the VG with Table, then the scrolling starts to work:

Table mainTable = new Table();
mainTable.setFillParent(true);
mainTable.add(c);
stage.addActor(mainTable);

This means that VG != Table(with single column)

The whole code is here :
http://www.badlogicgames.com/forum/viewtopic.php?f=11&t=20885&p=86539

[xoppa]

Please include a link to the documentation you're referring to.

[intrigus]

https://github.com/libgdx/libgdx/wiki/Scene2d.ui#verticalgroup

[xoppa]

Ow you mean the wiki. I guess the phrase "but is more lightweight" is not descriptive enough. I'm not native English, so not sure how to better rephrase that. But please update the wiki as you think it better fits.

[rami-alisawi]

There is bug in the VerticalGroup code, the wiki is correct. Please try to reproduce the problem it is pretty easy to do so.

[xoppa]

Perhaps I don't understand the issue you're reporting. Make sure to include the required information to reproduce the issue. See https://github.com/libgdx/libgdx/wiki/Getting-Help#executable-example-code

[rami-alisawi]

 import com.badlogic.gdx.*;
    import com.badlogic.gdx.backends.lwjgl.LwjglApplication;
    import com.badlogic.gdx.graphics.GL20;
    import com.badlogic.gdx.scenes.scene2d.Stage;
    import com.badlogic.gdx.scenes.scene2d.ui.*;
    import com.badlogic.gdx.utils.viewport.*;

    public class DesktopLauncher extends ApplicationAdapter {
        Stage stage;

        public void create () {
            stage = new Stage(new ScreenViewport());
            Gdx.input.setInputProcessor(stage);

            Skin skin = new Skin(Gdx.files.internal("uiskin.json"));

            VerticalGroup listOfLabels =new VerticalGroup();
            for (int i = 0; i < 60; i++) {
                listOfLabels.addActor(new Label(i+" Some Label", skin));
            }
            ScrollPane scrollPane=new ScrollPane(listOfLabels);
            Container container= new Container(scrollPane);
            scrollPane.setHeight(50); // it does not matter what I put here, but I think VerticalGroup should use this value
            container.setHeight(50); // it does not matter what I put here, but I think VerticalGroup should use this value

//---- following does NOT let even the scroll to work ( no scrolling possible in vertical direction ) 
            VerticalGroup mainVG=new VerticalGroup();
            mainVG.setFillParent(true);
            mainVG.addActor(container);
            stage.addActor(mainVG);

        }

        public void render () {
            Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
            stage.draw();
        }

        public void resize (int width, int height) {
            // Pass false to not modify the camera position.
            stage.getViewport().update(width, height, true);
        }

        public static void main (String[] args) throws Exception {
            new LwjglApplication(new DesktopLauncher());
        }
    }

[xoppa]

Never mind that. I wasn't reading correctly. Sorry. Thanks for the sscce!

[MobiDevelop]

VerticalGroup uses getPrefHeight on its children when doing its layout. In this case, it is the fact that the ScrollPane's prefHeight is the prefHeight of its child actor even if you explicitly set the height of the ScrollPane. The Container getPrefHeight also uses getPrefHeight on its child actor, which results in the VerticalGroup laying out as if it was simply including listOfLabels.

Not sure what the actual correct solution is here... I don't think this problem is unique to VerticalGroup.

[rami-alisawi]

Quoting from API docs "Scrollbars appear when the widget is larger than the scroll pane." But there is no way to it, given what you said. I think that I should be able to set ScrollPane to be smaller and to set whatever size I want to it, so that the scroll bars starts working according to the space I have for it on UI.

What are my other alternative, I just have made all my screens to extend VerticalGroup, now in one of the screens I need some label then area of scrolling (which I can control its hight) then another label after it.
Would you please help me explore my options, if you don't agree with me that we need to fix something here.

[NathanSweet]

It works correctly. Container sets the size of its children, so set the height of the ScrollPane using Container, not using setHeight.

import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.backends.lwjgl.LwjglApplication;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Container;
import com.badlogic.gdx.scenes.scene2d.ui.Label;
import com.badlogic.gdx.scenes.scene2d.ui.ScrollPane;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.scenes.scene2d.ui.VerticalGroup;
import com.badlogic.gdx.utils.viewport.ScreenViewport;

public class DesktopLauncher extends ApplicationAdapter {
    Stage stage;

    public void create () {
        stage = new Stage(new ScreenViewport());
        stage.setDebugAll(true);
        Gdx.input.setInputProcessor(stage);

        Skin skin = new Skin(Gdx.files.internal("data/uiskin.json"));

        VerticalGroup listOfLabels = new VerticalGroup();
        for (int i = 0; i < 60; i++)
            listOfLabels.addActor(new Label(i + " Some Label", skin));

        ScrollPane scrollPane = new ScrollPane(listOfLabels);

        Container container = new Container(scrollPane);
        container.height(200);

        VerticalGroup mainVG = new VerticalGroup();
        mainVG.setFillParent(true);
        mainVG.addActor(container);

        stage.addActor(mainVG);
    }

    public void render () {
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
        stage.act();
        stage.draw();
    }

    public void resize (int width, int height) {
        stage.getViewport().update(width, height, true);
    }

    public static void main (String[] args) throws Exception {
        new LwjglApplication(new DesktopLauncher());
    }
}