aps109
aps109

Reputation: 167

scrollable vaadin view to display all the components in the page

How can one achieve a html webpage in vaadin using layout components (new to vaadin)

Right now whatever components i add in UI Component only some components appear in the browser...

there is no scrolling option to see other components i added below in the hierarchy

public class LoginView extends CustomComponent implements View,
    Button.ClickListener {

    public static final String NAME = "login";

    private TextField user;

    private PasswordField password;

    private Button loginButton;
    NativeSelect select_role;

    private HorizontalLayout fieldsBottomPanel;

    private VerticalLayout fieldsLeftPanel;

    private GridLayout loginPanelGrid;

    private VerticalLayout filedsTopPanel;

    private VerticalLayout loginFormLayout;

    private Label top_header_panel;

    private VerticalLayout virtualKeyboard;

    private VerticalLayout fieldsRightPanel;

    private VerticalLayout footer;

    private VerticalLayout header;

    private Window page;



    public LoginView() {
        setSizeFull();  
        addTopPanelToLoginForm();
        addLeftPanelToLoginForm();
        addBottomPanelToLoginForm();
        addRightPanelToLoginForm();
        addLoginFormToPage();
        addFooterToPage();
        addHeaderToPage();

        VerticalLayout viewLayout = new VerticalLayout(header,loginFormLayout,footer);
        viewLayout.setComponentAlignment(loginFormLayout,
                Alignment.MIDDLE_CENTER);
        viewLayout.setStyleName(Reindeer.LAYOUT_WHITE);

        setCompositionRoot(viewLayout);
    }

    public void addHeaderToPage(){
        header = new VerticalLayout();
        header.setStyleName("header-login");
    }


    public void addFooterToPage(){
        footer = new VerticalLayout();
        footer.addStyleName("footer-login");
    }
}

Upvotes: 3

Views: 3796

Answers (1)

nexus
nexus

Reputation: 2937

You have to put your content into a Panel because layouts don't provide scrollbars.

[...] if it [Panel] has a fixed or percentual size and its content becomes too big to fit in the content area, a scroll bar will appear for the particular direction. [...]

From the Vaadin Book Chapter 6.6.1

Have a look at this thread here.

Upvotes: 5

Related Questions