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

Index

A

  • absolute layouts
    • about / Absolute layouts
    • using / Time for action – using absolute layouts
  • AbstractComponent component / Component
  • AbstractComponentContainer class / Component
  • AbstractField class / Component
  • AbstractOrderedLayout class / Component
  • AbstractSelect class / Component
  • AcceptTerms constructor / What just happened?
  • Accordions
    • about / Accordions
  • addClickHandler method / Remote procedure calls
  • addClickListener method / Buttons
  • addContainerProperty method / What just happened?
  • addMenuOption method / What just happened?
  • addTab method / Tab sheets
  • AJAX crawlable / What just happened?
  • application state
    • preserving / Time for action – preserving application state
  • audio class / Images, Flash, video, audio, and other web content

B

  • borders
    • visualizing / Time for action – visualizing borders, What just happened?
  • Boxwords game
    • about / Boxwords game
    • UI, implementing / Time for action – implementing the game UI
  • BoxwordsUI class / Selecting items in tables
  • browser frame class / Images, Flash, video, audio, and other web content
  • browser title
    • changing / Changing the browser title
  • business classes
    • separating, from UI classes / Time for action – separating business classes from UI classes, What just happened?
  • Button.ClickListener interface
    • about / Buttons
  • buttons
    • about / Buttons
    • styling / Styling buttons

C

  • caption property / Component
  • checkboxes
    • about / Checkboxes
  • Chrome inspector
    • about / Introducing Firebug and Chrome inspector
  • class members
    • UI components as / UI components as class members, What just happened?
  • ClassResource class / Images, Flash, video, audio, and other web content
  • ClickListener instance / Time for action – creating a custom component
  • click listeners
    • about / Click listeners
    • adding, steps for / Time for action – adding click listeners
  • clicks
    • listening to / Time for action – listening to clicks, What just happened?
  • client side application
    • about / Client side applications
    • creating, steps for / Time for action – creating a client side application
  • color picker
    • about / Color picker
  • Combobox
    • about / Comboboxes
    • adding / Time for action – adding a combobox, What just happened?
    • URL / What just happened?
  • ComponentContainer interface / Component
  • Component interface
    • about / Component
    • enabled property / Component
    • caption property / Component
    • visible property / Component
    • read only property / Component
    • icon property / Component
    • parent property / Component
  • components
    • removing, from layouts / Removing components from layouts
    • CSS classes, adding / Adding CSS classes to components
  • CompositeErrorMessage / What just happened?
  • Connector object / Widgets
  • containers
    • about / Containers
  • context menus
    • about / Context menus
  • createWidget method / What just happened?
  • cross-site scripting / Rich text area
  • CRUD (create, read, update, and delete) interface / Notifications
  • CSS
    • about / Introduction to CSS and Sass
  • CSS classes
    • adding, to components / Adding CSS classes to components
  • custom component
    • about / Custom components
    • creating, steps for / Time for action – creating a custom component, What just happened?

D

  • data
    • from tables, reading / Reading data from tables, Time for action – finishing the game
  • data binding
    • about / Vaadin's data model
    • to properties / Time for action – binding data to properties, What just happened?
  • Date/time pickers
    • about / Date/time pickers
  • Drag-and-drop
    • about / Drag-and-drop
    • example / Have a go hero – study a drag-and-drop example

E

  • Eclipse
    • downloading / Time for action – downloading and installing Eclipse
    • installing / Time for action – downloading and installing Eclipse
    • Vaadin plugin, installing / Installing the Vaadin plugin for Eclipse, Time for action – installing the plugin, What just happened?
    • Vaadin project, creating / Time for action – creating a new Vaadin project
    • Vaadin application, deploying / Deploying and running Vaadin applications in Eclipse
    • Vaadin application, running / Deploying and running Vaadin applications in Eclipse
  • embedded class / Images, Flash, video, audio, and other web content
  • enabled property / Component
  • error indicators
    • about / Error indicators
    • user input, validating / Time for action – validating user input, What just happened?
  • ErrorMessage interface / What just happened?
  • expand ratio
    • about / Time for action – expanding components, What just happened?
  • EXPLICIT, enum value / Headers
  • EXPLICIT_DEFAULTS_ID, enum value / Headers
  • Extension / File download
  • extensions
    • about / Extensions
    • creating, steps for / Time for action – creating an extension
  • ExternalResource class / Images, Flash, video, audio, and other web content

F

  • Field interface / Component
  • file download
    • about / File download
  • FileResource class / Images, Flash, video, audio, and other web content
  • files
    • uploading / Uploading files
  • Firebug
    • URL / Introducing Firebug and Chrome inspector
  • Firebug inspector
    • about / Introducing Firebug and Chrome inspector
  • flash class / Images, Flash, video, audio, and other web content
  • footers
    • about / Footers
    • clicking on / Clicking on footers
  • form layouts
    • about / Form layouts
    • using / Time for action – using FormLayout
  • fragments
    • about / Fragments

G

  • gameOver method / Time for action – finishing the game
  • generated columns
    • about / Understanding generated columns
    • collapsing / Collapsing and reordering columns
    • reordering / Collapsing and reordering columns
  • getElement method / What just happened?
  • getValue() method / What just happened?
  • getValue method / Date/time pickers
  • grid layout
    • about / Grid layouts
    • using / Time for action – using grid layouts, What just happened?
    • components, expandibng / Have a go hero – expand components in GridLayout
  • GWT.create method / What just happened?
  • GWT handlers
    • about / Have a go hero – experiment with GWT handlers

H

  • HeaderClickLister method / Clicking on headers
  • headers
    • about / Headers
    • clicking on / Clicking on headers
  • hello world application
    • about / A more interesting "hello world" application
  • HIDDEN, enum value / Headers
  • HTML
    • inspecting / Time for action – inspecting HTML

I

  • icon property / Component
  • icons
    • about / Icons
    • adding, steps for / Time for action – adding icons
  • ID, enum value / Headers
  • Image class / Images, Flash, video, audio, and other web content
  • immediate mode
    • about / Immediate mode
  • initCombo method / Immediate mode
  • init method / Rich text area
  • InlineDateField component
    • using / Time for action – using an InlineDateField component, What just happened?
  • input components
    • value, setting / Getting and setting the value of input components
    • value, getting / Getting and setting the value of input components
    • adding, in layout / Time for action – adding input component into the layout
    • about / More input components
  • int object type / The Time It application
  • ItemClickEvent method / What just happened?
  • ItemClickListener method / What just happened?
  • items
    • about / Items
    • in tables, selecting / Selecting items in tables
  • Ivy
    • about / What just happened?
  • IvyDE
    • about / What just happened?

J

  • @JavaScript annotation / What just happened?
  • java.util.Date object / Date/time pickers
  • JavaScript
    • about / Custom JavaScript
    • calling, from server / Calling JavaScript from the server, Calling the server from JavaScript
    • components / JavaScript components
    • components, creating / Time for action – creating a JavaScript component
    • extensions / JavaScript extensions
    • extensions, implementing / Have a go hero – implement a JavaScript extension
  • JQuery / What just happened?
  • JQuery UI / What just happened?

K

  • Kind of option / Option groups

L

  • Label component / What just happened?
  • labels
    • about / Generated application explained, Labels
    • styling / Styling labels
  • layout
    • margin / Layout margin
    • about / Horizontal layouts
    • main layout / Time for action – the main layout, What just happened?
    • size, setting / Time for action – setting layouts size
  • Layout / Component
  • layouts
    • main layout / Time for action – the main layout
  • lowerSection component / What just happened?

M

  • MarqueeLabelConnector.onStateChanged method / What just happened?
  • MarqueeLabelWidget method / What just happened?
  • Maven
    • Vaadin application, creating / Creating and running Vaadin applications using Maven
    • Vaadin application, running / Creating and running Vaadin applications using Maven, Time for action – deploying and running
    • Vaadin application, deploying / Time for action – deploying and running
  • menu
    • optios, adding / Time for action – adding menu options
  • menus
    • about / Menus
    • styling / Styling menus
  • MethodProperty instance / Editable tables
  • Mixins
    • about / Mixins
  • module descriptor
    • about / Time for action – creating a client side application

N

  • navigators
    • about / Navigators and views
    • using / Time for action – using navigators
    • programmatically / Time for action – navigating programmatically, What just happened?
  • nesting
    • about / Nesting
  • NetBeans
    • Vaadin application, creating / Creating and running Vaadin applications in NetBeans
    • Vaadin application, running / Creating and running Vaadin applications in NetBeans
    • Vaadin project, creating / Creating a new Vaadin project in NetBeans, Time for action – creating a new Vaadin project
    • Vaadin application, deploying / Time for action – deploying and testing
    • Vaadin application, testing / Time for action – deploying and testing
  • Notification class / Notifications
  • notifications
    • about / Notifications

O

  • OptionGroup
    • about / Option groups
    • example, fixing / Time for action – fixing the OptionGroup example
    • example, improving / Have a go hero – improve the OptionGroup example

P

  • page length
    • about / Page length
  • panels
    • about / Panels
    • using / Time for action – using panels, What just happened?
    • styling / Styling panels
  • parameters
    • about / Parameters
    • request parameters, reading / Time for action – reading request parameters
  • parent property / Component
  • path info
    • about / Path info
  • progress indicators
    • about / Progress indicators
  • Property interface / What just happened?
  • public method
    • adding, to set header / Have a go hero – add a public method to set the header

R

  • read only property / Component
  • Receiver interface / Uploading files
  • receiveUpload method / Uploading files
  • request information
    • getting / Getting request information
  • results
    • displaying / Time for action – showing the results
  • RichTextArea component
    • about / Rich text area
    / Rich text area
  • Run Jetty Run plugin
    • installing / Installing Run Jetty Run plugin, Time for action – installing Jetty

S

  • sanitizing / Rich text area
  • SaSS
    • about / Introduction to CSS and Sass
  • selector part / Introduction to CSS and Sass
  • server
    • calling, from JavaScript / Calling the server from JavaScript
  • servlets
    • about / Servlets and GWT
  • setChildrenAllowed method / What just happened?, What just happened?
  • setCompositionRoot method / Custom components
  • setDateFormat method / Date/time pickers
  • setSplitPosition(float pos, boolean reverse) method / What just happened?
  • setSplitPosition(float pos, Unit unit) method / What just happened?
  • setSplitPosition(float pos, Unit unit, boolean reverse) method / What just happened?
  • setStyleName method / What just happened?
  • shortcut
    • for buttons / Shortcuts for buttons
  • shortcut, for buttons
    • navigators used / Time for action – a tedious application
  • shortcut, for Panel
    • about / Shortcuts for Window and Panel
  • shortcut, for Window
    • about / Shortcuts for Window and Panel
  • shortcut keys
    • about / Shortcut keys
  • sliders
    • about / Sliders
  • split panels
    • about / Split panels
    • using / Time for action – using split panels, What just happened?
  • StreamResource class / Images, Flash, video, audio, and other web content
  • StringBuilder class / The Time It application
  • SystemError / What just happened?

T

  • tables
    • about / Tables
    • first table, creating / Time for action – my first table, What just happened?
    • data, reading / Reading data from tables, Time for action – finishing the game
    • editable / Editable tables
    • custom field factory, using / Time for action – using a custom field factory, What just happened?
    • styling / Styling tables
  • tab sheets
    • about / Tab sheets
  • Text area
    • about / Text area
  • TextField component / What just happened?
  • text fields
    • using / Time for action – using text fields
    • styling / Styling text fields
  • ThemeResource class / Images, Flash, video, audio, and other web content
  • Time It application
    • about / The Time It application
  • TimeItUI class / Time for action – separating business classes from UI classes, What just happened?, Time for action – adding some infrastructure
  • tooltip
    • about / Tooltips
  • trees
    • about / Trees
    • first tree, creating / Time for action – my first tree, What just happened?
    • events / Tree events
    • tables / Tree tables
    • file browser / Time for action – a file browser, What just happened?
  • TwinColSelect / Twin column selects

U

  • UI classes
    • business classes, separating from / Time for action – separating business classes from UI classes, What just happened?
  • UI components
    • adding, as class members / UI components as class members, What just happened?
    • hierarchy / UI components hierarchy
  • UserError / What just happened?
  • user session
    • about / User session

V

  • Vaadin 7 Maven archetype
    • about / Vaadin 7 Maven archetype
  • Vaadin application
    • in Eclipse / Creating and running Vaadin applications in Eclipse
    • deploying, in Eclipse / Deploying and running Vaadin applications in Eclipse
    • running, in Eclipse / Deploying and running Vaadin applications in Eclipse
    • running, in NetBeans / Time for action – downloading and installing NetBeans, Time for action – deploying and testing
    • creating, in NetBeans / Time for action – downloading and installing NetBeans
    • deploying, in NetBeans / Time for action – deploying and testing
    • running, in Maven / Creating and running Vaadin applications using Maven
    • creating, in Maven / Creating and running Vaadin applications using Maven
    • deploying, with Maven / Time for action – deploying and running, What just happened?
    • running, with Maven / Time for action – deploying and running
  • Vaadin plugin
    • installing, for Eclipse / Installing the Vaadin plugin for Eclipse, Time for action – installing the plugin, What just happened?
  • Vaadin project
    • creating, in Eclipse / Creating a new Vaadin project in Eclipse
    • creating, in NetBeans / Creating a new Vaadin project in NetBeans, Time for action – creating a new Vaadin project
    • creating / Time for action – creating a new Vaadin project
  • Vaadin theme
    • changing / Time for action – changing themes
    • new Vaadin theme, creating / Time for action – creating a new Vaadin theme, Time for action – creating a new Vaadin theme, What just happened?
  • validate method / What just happened?
  • value changes
    • responding to / Responding to value changes
  • variables
    • about / Variables
  • VerticalLayout / Generated application explained
  • video class / Images, Flash, video, audio, and other web content
  • visible property / Component

W

  • web content
    • rendering / Time for action – render web content, What just happened?
  • website
    • building / Time for action – developing a simple website, What just happened?
  • widget
    • creating, steps for / Time for action – creating a widget, What just happened?
  • widgets
    • about / Widgets
  • Windows
    • about / Windows
    • dragging, disabling / Windows
    • positioning / Windows