Book Image

Vaadin 7 UI Design By Example: Beginner's Guide

Book Image

Vaadin 7 UI Design By Example: Beginner's Guide

Overview of this book

Vaadin is a mature, open-source, and powerful Java framework used to build modern web applications in plain Java. Vaadin brings back the fun of programming UI interfaces to the web universe. No HTML, no CSS, no JavaScript, no XML. Vaadin lets you implement web user interfaces using an object oriented model, similar to desktop technologies such as Swing and AWT. Vaadin 7 UI Design By Example: Beginner's Guide is an engaging guide that will teach you how to develop web applications in minutes. With this book, you will Develop useful applications and learn basics of Java web development. By the end of the book you will be able to build Java web applications that look fantastic. The book begins with simple examples using the most common Vaadin UI components and quickly move towards more complex applications as components are introduced chapter-by-chapter. Vaadin 7 UI Design By Example: Beginner's Guide shows you how to use Eclipse, Netbeans, and Maven to create Vaadin projects. It then demonstrates how to use labels, text fields, buttons, and other input components. Once you get a grasp of the basic usage of Vaadin, the book explains Vaadin theory to prepare you for the rest of the trip that will enhance your knowledge of Vaadin UI components and customization techniques.
Table of Contents (17 chapters)
Vaadin 7 UI Design By Example Beginner's Guide
Credits
About the Author
Acknowledgement
About the Reviewers
www.PacktPub.com
Preface
Index

Windows


A Window is a visual area that floats over the page. You can easily add windows to your UI class:

Window w1 = new Window("Default window");
addWindow(w1); // from UI class

Once the window is added, it will majestically appear on the screen:

You can disable the close button of the window:

Window w2 = new Window("You can't close this window, sorry");
w2.setClosable(false);

Or you can fix the size of the window and ban future size changes:

Window w3 = new Window("You can't resize me, ha-ha");
w3.setWidth("200px");
w3.setHeight("100px");
w3.setResizable(false);

As you can see, sizing is done as usual with the setWidth and setHeight methods.

Usually the content of a window is some kind of layout; however, you can set any component as the window content. Here, we are using a label:

Window w4 = new Window("I have a Label inside");
w4.setContent(new Label("I'm that Label."));

You can also disable window dragging:

Window w5 = new Window(
    "You can't drag me :( but you can close me :)");
w5.setDraggable...