Vaadin 7 UI Design By Example Beginner's Guide -- Table of Contents -- Vaadin 7 UI Design By Example Beginner's Guide -- Credits -- About the Author -- Acknowledgement -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers and more -- Why Subscribe? -- Free Access for Packt account holders -- Preface -- What this book covers -- What you need for this book -- Who this book is for -- Conventions -- Time for action - heading -- What just happened? -- Pop quiz - heading -- Have a go hero - heading -- Reader feedback -- Customer support -- Downloading the example code -- Errata -- Piracy -- Questions -- 1. Writing Your First Vaadin-powered Application -- Creating and running Vaadin applications in Eclipse -- Installing Eclipse -- Time for action - downloading and installing Eclipse -- What just happened? -- Installing the Vaadin plugin for Eclipse -- Time for action - installing the plugin -- What just happened? -- Installing Run Jetty Run plugin -- Time for action - installing Jetty -- What just happened? -- Creating a new Vaadin project in Eclipse -- Time for action - creating a new Vaadin project -- What just happened? -- Deploying and running Vaadin applications in Eclipse -- Time for action - deploying and running -- What just happened? -- Creating and running Vaadin applications in NetBeans -- Installing NetBeans -- Time for action - downloading and installing NetBeans -- What just happened? -- Creating a new Vaadin project in NetBeans -- Time for action - creating a new Vaadin project -- What just happened? -- Deploying and running Vaadin applications in NetBeans -- Time for action - deploying and testing -- What just happened? -- Creating and running Vaadin applications using Maven -- Vaadin 7 Maven archetype -- Time for action - creating a new Vaadin project -- What just happened?.

Deploying and running Vaadin applications with Maven -- Time for action - deploying and running -- What just happened? -- Generated application explained -- Buttons -- Labels -- Have a go hero - display some HTML text -- Layout margin -- A more interesting "hello world" application -- Text fields -- Time for action - using text fields -- What just happened? -- Notifications -- Have a go hero - show notifications -- Pop quiz - Vaadin fundamentals -- Summary -- 2. Using Input Components and Forms - Time to Listen to Users -- The Time It application -- Time for action - separating business classes from UI classes -- What just happened? -- UI components as class members -- Time for action - adding components as class members -- What just happened? -- Time for action - adding some infrastructure -- What just happened? -- Comboboxes -- Time for action - adding a combobox -- What just happened? -- Responding to value changes -- Getting and setting the value of input components -- Tooltips -- Immediate mode -- Error indicators -- Time for action - validating user input -- What just happened? -- Layout spacing -- Time for action - adding input component into the layout -- What just happened? -- Checkboxes -- Removing components from layouts -- Time for action - running the test set -- What just happened? -- Have a go hero - add a validation to Time It -- Time for action - showing the results -- What just happened? -- Thinking in Vaadin -- Servlets and GWT -- UI components hierarchy -- Component -- Vaadin's data model -- Time for action - binding data to properties -- What just happened? -- Items -- Containers -- More input components -- Text area -- Have a go hero - disable word wrap -- Rich text area -- Option groups -- Time for action - fixing the OptionGroup example -- What just happened? -- Have a go hero - improve the OptionGroup example.

Twin column selects -- Date/time pickers -- Time for action - using an InlineDateField component -- What just happened? -- Uploading files -- Pop quiz - thinking in Vaadin -- Summary -- 3. Arranging Components into Layouts -- Horizontal layouts -- Time for action - the main layout -- What just happened? -- Components size -- Time for action - visualizing borders -- What just happened? -- Time for action - setting layouts size -- What just happened? -- Expand ratio -- Time for action - expanding components -- What just happened? -- Split panels -- Time for action - using split panels -- What just happened? -- Implementing a button-based menu -- Time for action - adding menu options -- What just happened? -- Have a go hero - add a public method to set the header -- Grid layouts -- Time for action - using grid layouts -- What just happened? -- Have a go hero - open their eyes -- Have a go hero - expand components in GridLayout -- Absolute layouts -- Time for action - using absolute layouts -- What just happened? -- Click listeners -- Time for action - adding click listeners -- What just happened? -- Have a go hero - get more data from click events -- Form layouts -- Time for action - using FormLayout -- What just happened? -- Panels -- Time for action - using panels -- What just happened? -- Tab sheets -- Accordions -- Have a go hero - find the disobedient line of code -- Windows -- Pop quiz - mastering layouts -- Summary -- 4. Using Vaadin Navigation Capabilities -- Getting request information -- Path info -- Time for action - developing a simple website -- What just happened? -- Parameters -- Time for action - reading request parameters -- What just happened? -- Fragments -- Have a go hero - take a look at the Vaadin API documentation -- Changing the browser title -- Navigators and views -- Time for action - using navigators -- What just happened?.

Time for action - navigating programmatically -- What just happened? -- Keeping state after refresh -- Time for action - preserving application state -- What just happened? -- User session -- Menus -- Shortcut keys -- Shortcuts for buttons -- Time for action - a tedious application -- What just happened? -- Have a go hero - improve user experience -- Shortcuts for Window and Panel -- Pop quiz - navigation capabilities -- Summary -- 5. Using Tables - Time to Talk to Users -- Tables -- Time for action - my first table -- What just happened? -- Headers -- Clicking on headers -- Footers -- Clicking on footers -- Boxwords game -- Time for action - implementing the game UI -- What just happened? -- Page length -- Selecting items in tables -- Time for action - listening to clicks -- What just happened? -- Reading data from tables -- Time for action - finishing the game -- What just happened? -- Editable tables -- Table field factories -- Time for action - using a custom field factory -- What just happened? -- Understanding generated columns -- Collapsing and reordering columns -- Have a go hero - activate column reordering powers -- Pop quiz - mastering tables -- Summary -- 6. Adding More Components -- Trees -- Time for action - my first tree -- What just happened? -- Tree events -- Tree tables -- Time for action - a file browser -- What just happened? -- Have a go hero - use TreeTable or Tree interchangeably -- Progress indicators -- Icons -- Time for action - adding icons -- What just happened? -- Images, Flash, video, audio, and other web content -- Time for action - render web content -- What just happened? -- Sliders -- Color picker -- Have a go hero - experiment with ColorPicker -- File download -- Context menus -- Drag-and-drop -- Have a go hero - study a drag-and-drop example -- Pop quiz - more components -- Summary.

7. Customizing UI Components - Time to Theme it -- Vaadin themes -- Time for action - changing themes -- What just happened? -- Introduction to CSS and Sass -- Variables -- Nesting -- Mixins -- Introducing Firebug and Chrome inspector -- Time for action - inspecting HTML -- What just happened? -- Creating new themes -- Time for action - creating a new Vaadin theme -- What just happened? -- Styling labels -- Time for action - creating a new Vaadin theme -- What just happened? -- Adding CSS classes to components -- Styling text fields -- Styling buttons -- Styling panels -- Styling menus -- Styling tables -- Pop quiz - Vaadin themes -- Summary -- 8. Developing Your Own Components -- Custom components -- Time for action - creating a custom component -- What just happened? -- Client side applications -- Time for action - creating a client side application -- What just happened? -- Have a go hero - check that the app is purely client side -- Widgets -- Time for action - creating a widget -- What just happened? -- Remote procedure calls -- Extensions -- Time for action - creating an extension -- What just happened? -- Have a go hero - experiment with GWT handlers -- Custom JavaScript -- Calling JavaScript from the server -- Calling the server from JavaScript -- JavaScript components -- Time for action - creating a JavaScript component -- What just happened? -- JavaScript extensions -- Have a go hero - implement a JavaScript extension -- Pop quiz - CustomComponents -- Summary -- A. Pop Quiz Answers -- Chapter 1, Writing Your First Vaadin-powered Application -- Pop quiz - Vaadin fundamentals -- Chapter 2, Using Input Components and Forms - Time to Listen to Users -- Pop quiz - thinking in Vaadin -- Chapter 3, Arranging Components into Layouts -- Pop quiz - mastering layouts -- Chapter 4, Using Vaadin Navigation Capabilities.

Pop quiz - navigation capabilities.