Examples of CssLayout

com.vaadin.ui.CssLayout
CssLayout is a layout component that can be used in browser environment only. It simply renders components and their captions into a same div element. Component layout can then be adjusted with css.
In comparison to {@link HorizontalLayout} and {@link VerticalLayout}
- rather similar server side api
- no spacing, alignment or expand ratios
- much simpler DOM that can be styled by skilled web developer
- no abstraction of browser differences (developer must ensure that the result works properly on each browser)
- different kind of handling for relative sizes (that are set from server side) (*)
- noticeably faster rendering time in some situations as we rely more on the browser's rendering engine.
With {@link CustomLayout} one can often achieve similar results (good lookinglayouts with web technologies), but with CustomLayout developer needs to work with fixed templates.
By extending CssLayout one can also inject some css rules straight to child components using {@link #getCss(Component)}.
(*) Relative sizes (set from server side) are treated bit differently than in other layouts in Vaadin. In cssLayout the size is calculated relatively to CSS layouts content area which is pretty much as in html and css. In other layouts the size of component is calculated relatively to the "slot" given by layout.
Also note that client side framework in Vaadin modifies inline style properties width and height. This happens on each update to component. If one wants to set component sizes with CSS, component must have undefined size on server side (which is not the default for all components) and the size must be defined with class styles - not by directly injecting width and height. @since 6.1 brought in from "FastLayouts" incubator project

Examples of com.vaadin.ui.CssLayout


public class DragAndDropFiles extends TestBase {


    @Override
    protected void setup() {
        CssLayout cssLayout = new CssLayout() {
            @Override
            protected String getCss(Component c) {
                return "display: block; padding:20px; border: 2px dotted black; background: #aaa;";
            }
        };
        Component l = new Label("Drag file on me");
        l.setSizeUndefined();
        cssLayout.addComponent(l);
        DragAndDropWrapper dragAndDropWrapper = new DragAndDropWrapper(
                cssLayout);
        dragAndDropWrapper.setSizeUndefined();
        dragAndDropWrapper.setDropHandler(new DropHandler() {

View Full Code Here

Examples of com.vaadin.ui.CssLayout


        TextField tf;


        VerticalLayout vl;


        CssLayout cssLayout = new CssLayout() {
            @Override
            protected String getCss(Component c) {
                return "margin-top: 20px; background:red;";
            }
        };


        vl = new VerticalLayout();
        vl.setHeight("40px");
        vl.setWidth("200px");


        tf = new TextField();
        tf.setSizeFull();
        vl.addComponent(tf);
        vl.setCaption("Fullsize textfield in 40px height 200px width box");
        cssLayout.addComponent(vl);


        vl = new VerticalLayout();
        vl.setHeight("40px");
        vl.setWidth("200px");


        TextArea ta = new TextArea();
        ta.setRows(2); // make it text area, instead of oneliner
        ta.setSizeFull();
        vl.addComponent(ta);
        vl.setCaption("Fullsize textarea in 100px height 200px width box");
        cssLayout.addComponent(vl);


        vl = new VerticalLayout();
        vl.setSizeUndefined();


        tf = new TextField();
        vl.addComponent(tf);
        vl.setCaption("Normal textfield in natural size.");
        cssLayout.addComponent(vl);


        getLayout().addComponent(cssLayout);


    }

View Full Code Here

Examples of com.vaadin.ui.CssLayout

                gridLayout.setStyleName("borders");
            }
            l = gridLayout;
        } else if (layoutClass == CssLayout.class) {
            if (cssLayout == null) {
                cssLayout = new CssLayout();
                cssLayout.setStyleName("borders");
            }
            l = cssLayout;
        } else if (layoutClass == FormLayout.class) {
            if (formLayout == null) {

View Full Code Here

Examples of com.vaadin.ui.CssLayout


public class SplitPanelStyleLeak extends AbstractTestUI {


    @Override
    protected void setup(VaadinRequest request) {
        CssLayout wrap = new CssLayout();
        addComponent(wrap);


        wrap.addComponent(getSplit(true, null));
        wrap.addComponent(getSplit(false, null));


        wrap.addComponent(getSplit(true, "small"));
        wrap.addComponent(getSplit(false, "small"));


        wrap.addComponent(getSplit(true, "large"));
        wrap.addComponent(getSplit(false, "large"));
    }

View Full Code Here

Examples of com.vaadin.ui.CssLayout

    void buildMainView() {
        mainLayout.setWidth("100%");
        mainLayout.setHeight("400px");
        mainLayout.addComponent(getTopMenu());


        CssLayout margin = new CssLayout();
        margin.setSizeFull();
        tabs = new TabSheet();
        tabs.setSizeFull();
        margin.addComponent(tabs);
        mainLayout.addComponent(margin);
        mainLayout.setExpandRatio(margin, 1);


        tabs.addComponent(buildLabels());
        tabs.addComponent(buildButtons());

View Full Code Here

Examples of com.vaadin.ui.CssLayout


        return l;
    }


    Layout buildWindows() {
        final CssLayout l = new CssLayout();
        l.setCaption("Windows");


        VerticalLayout layout = new VerticalLayout();
        layout.setMargin(true);
        final Window w = new Window("Normal window", layout);
        w.setWidth("280px");

View Full Code Here

Examples of com.vaadin.ui.CssLayout

    private CssLayout layout;


    @Override
    protected void setup() {
        setTheme("tests-tickets");
        layout = new CssLayout() {
            @Override
            protected String getCss(com.vaadin.ui.Component c) {
                return css.get(c);
            }
        };

View Full Code Here

Examples of com.vaadin.ui.CssLayout


public class CssLayoutTest extends AbstractIndexedLayoutTest {


    @Override
    protected Layout createLayout() {
        return new CssLayout();
    }

View Full Code Here

Examples of com.vaadin.ui.CssLayout

        });
        addComponent(cb2);
        gl.setWidth("1000px");
        gl.setHeight("500px");


        CssLayout ta = new CssLayout();
        ta.setSizeFull();
        // Only on last row
        gl.addComponent(ta, 0, 3, 3, 3);


        gl.setRowExpandRatio(3, 1);
        addComponent(gl);

View Full Code Here

Examples of com.vaadin.ui.CssLayout

    }


    @Override
    protected void setup() {


        final CssLayout log = new CssLayout();
        log.setWidth("100%");


        final Table table = new Table() {
            @Override
            public Property<?> getContainerProperty(Object itemId,
                    Object propertyId) {
                log("Fetched container property \"" + propertyId
                        + "\" for item \"" + itemId + "\"");
                return super.getContainerProperty(itemId, propertyId);
            }


            private void log(String string) {
                log.addComponent(new Label(string));


            }
        };


        table.addContainerProperty("foo", String.class, "bar");

View Full Code Here

0 1 2 3 4 5

TOP

All source code are property of their respective owners. Java is a trademark of Sun Microsystems, Inc and owned by ORACLE Inc. Contact coftware#gmail.com.