Make Grid add columns based on bean properties (#8392)

* Make Grid add columns based on bean properties

The property set concept used for Binder is slightly generalized and
used by Grid as well to support similar functionality.

Fixes vaadin/framework8-issues#250

1 files changed, 24 insertions, 12 deletions

diff --git a/documentation/components/components-grid.asciidoc b/documentation/components/components-grid.asciidoc
index 3ea0e578f3..52d2301a46 100644
--- a/documentation/components/components-grid.asciidoc
+++ b/documentation/components/components-grid.asciidoc
@@ -42,7 +42,7 @@ cell style generator.
 [[components.grid.data]]
 == Binding to Data
 
-[classname]#Grid# is normally used by binding it to a ,
+[classname]#Grid# is normally used by binding it to a data provider,
 described in
 <<dummy/../../../framework/datamodel/datamodel-providers.asciidoc#datamodel.dataproviders,"Showing Many Items in a Listing">>.
 By default, it is bound to List of items. You can set the items with the
@@ -96,7 +96,7 @@ grid.setSelectionMode(SelectionMode.MULTI);
 grid.addSelectionListener(event -> {
     Set<Person> selected = event.getAllSelectedItems();
     Notification.show(selected.size() + " items selected");
-}
+});
 ----
 
 Programmatically selecting the value is possible via [methodname]#select(T)#.
@@ -214,7 +214,7 @@ selectionModel.addMultiSelectionListener(event -> {
     // Allow deleting only if there's any selected
     deleteSelected.setEnabled(
          event.getNewSelection().size() > 0);
-};
+});
 ----
 
 
@@ -241,7 +241,7 @@ and column.
 [source, java]
 ----
 grid.addCellClickListener(event ->
-    Notification.show("Value: " + event.getItem());
+    Notification.show("Value: " + event.getItem()));
 ----
 
 The clicked grid cell is also automatically focused.
@@ -255,15 +255,11 @@ well as disable cell focus, in a custom theme. See <<components.grid.css>>.
 [[components.grid.columns]]
 == Configuring Columns
 
-Columns are normally defined in the container data source. The
-[methodname]#addColumn()# method can be used to add columns to [classname]#Grid#.
-
-Column configuration is defined in [classname]#Grid.Column# objects, which can
-be obtained from the grid with [methodname]#getColumns()#.
+The [methodname]#addColumn()# method can be used to add columns to [classname]#Grid#.
 
-The setter methods in [classname]#Column# have _fluent API_, so you can easily chain
-the configuration calls for columns if you want to.
+Column configuration is defined in [classname]#Grid.Column# objects, which are returned by `addColumn` and can also be obtained from the grid with [methodname]#getColumns()#.
 
+The setter methods in [classname]#Column# have _fluent API_, so you can easily chain the configuration calls for columns if you want to.
 
 [source, java]
 ----
@@ -275,6 +271,22 @@ grid.addColumn(Person:getBirthDate, new DateRenderer())
 
 In the following, we describe the basic column configuration.
 
+[[components.grid.columns.automatic]]
+=== Automatically Adding Columns
+
+You can configure `Grid` to automatically add columns based on the properties in a bean.
+To do this, you need to pass the `Class` of the bean type to the constructor when creating a grid.
+You can then further configure the columns based on the bean property name.
+
+[source, java]
+----
+Grid<Person> grid = new Grid<>(Person.class);
+
+grid.getColumn("birthDate").setWidth("100px");
+
+grid.setItems(people);
+----
+
 [[components.grid.columns.order]]
 === Column Order
 
@@ -424,7 +436,7 @@ grid.addColumn(person -> "Delete",
       new ButtonRenderer(clickEvent -> {
           people.remove(clickEvent.getValue());
           grid.setItems(people);
-    });
+    }));
 ----
 
 [classname]#ImageRenderer#:: Renders the cell as an image.